/* =====================================================================
   JSTFI: Jurnal Sains dan Teknologi Farmasi Indonesia
   CSS RESPONSIF (override tema bawaan OJS 3.3.0.23)
   ---------------------------------------------------------------------
   Cara pakai:
   OJS > Settings > Website > Appearance > Advanced > Journal Style Sheet
   Upload file ini MENGGANTIKAN stylesheet lama. File ini hanya berisi
   override, jadi tidak perlu lagi menyalin seluruh CSS tema bawaan.

   Palet warna mengikuti banner & cover JSTFI:
   cyan/turquoise (judul & aksen banner), biru-navy (teks "FARMASI
   INDONESIA"), kuning-emas (lambang STFI) sebagai aksen.

   Breakpoint mengikuti tema OJS: 480 / 768 / 992 / 1200 px.
   ===================================================================== */


/* =====================================================================
   1. VARIABEL WARNA & FONT (ubah di sini untuk ganti identitas visual)
   ===================================================================== */
:root {
    --primary-color: #0a6f87;      /* cyan tua */
    --secondary-color: #0095b0;    /* cyan jurnal */
    --accent-color: #f2c230;       /* kuning emas (lambang STFI) */
    --mint-color: #d9f1f7;         /* cyan muda */
    --link-color: #0a7a93;
    --link-hover-color: #00a6c4;
    --text-color: #243447;
    --border-color: #d0e5ec;
    --page-bg: #e6f3f7;

    --gradient-primary: linear-gradient(135deg, #0a7a93 0%, #07495b 100%);
    --gradient-secondary: linear-gradient(135deg, #14abc8 0%, #0a6f87 100%);
    --gradient-mint: linear-gradient(135deg, #e3f5fa 0%, #b8e3ee 100%);
    --gradient-nav: linear-gradient(90deg, #0a6f87 0%, #0095b0 100%);
    --gradient-cover: linear-gradient(135deg, #0a7a93 0%, #0a6f87 60%, #07495b 100%);

    --font-body: "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
                 "Helvetica Neue", Arial, "Noto Naskh Arabic", "Traditional Arabic", sans-serif;
    --font-heading: var(--font-body);
}


/* =====================================================================
   2. DASAR
   ===================================================================== */
html {
    background: var(--page-bg);
}

body {
    background: transparent;
    font-family: var(--font-body);
    font-size: 15px;
    color: var(--text-color);
    overflow-x: hidden;               /* jaring pengaman: tidak ada scroll samping */
}

a {
    color: var(--link-color);
    text-decoration: none;
}
a:hover,
a:focus {
    color: var(--link-hover-color);
}

.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3,
.pkp_structure_main h4,
.pkp_structure_main h5,
.pkp_structure_main h6 {
    font-family: var(--font-heading);
    color: var(--primary-color);
    overflow-wrap: break-word;
}

/* URL / DOI panjang tanpa spasi harus bisa terpotong, bukan melebar */
.pkp_structure_main,
.pkp_structure_sidebar,
.pkp_footer_content {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.pkp_structure_main h1 { font-size: clamp(20px, 4.2vw, 26px); line-height: 1.3; margin: 0 0 1rem; }
.pkp_structure_main h2 { font-size: clamp(18px, 3.4vw, 21px); line-height: 1.35; margin: 1.6rem 0 .8rem; }
.pkp_structure_main h3 { font-size: 17px; line-height: 1.4; margin: 1.4rem 0 .6rem; }
.pkp_structure_main h4 { margin: 1.2rem 0 .5rem; }

.pkp_structure_main p,
.pkp_structure_main ul,
.pkp_structure_main ol {
    font-size: 16px;
    line-height: 1.75;
}
.pkp_structure_main p { margin: 0 0 1rem; text-align: justify; }
.pkp_structure_main p:last-child { margin-bottom: 0; }

/* Teks campuran Arab / Latin: arah paragraf mengikuti huruf pertama */
.obj_article_summary > .title,
.obj_article_details .page_title,
.obj_article_details .abstract p,
.obj_article_details .references p,
.csl-entry {
    unicode-bidi: plaintext;
}
.obj_article_details .page_title { text-align: start; }

/* Gambar, media, kode: tidak boleh melebihi lebar kolom */
.pkp_structure_main img { max-width: 100% !important; height: auto !important; }
iframe, video, embed, object { max-width: 100%; }
pre, code { white-space: pre-wrap; overflow-wrap: break-word; }
pre { overflow-x: auto; max-width: 100%; }

/* Tabel di halaman statis (About, info jurnal, dll.) */
.pkp_structure_main table {
    width: 100% !important;
    max-width: 100%;
    margin-bottom: 1rem;
    border-collapse: collapse;
}
.pkp_structure_main table td,
.pkp_structure_main table th {
    padding: .45rem .6rem;
    vertical-align: top;
    overflow-wrap: anywhere;          /* isi sel panjang (URL, email) boleh terpotong */
}
/* Sel pertama = label ("Journal title", "Abbreviation"): jangan dipotong di tengah kata */
.pkp_structure_main table td:first-child,
.pkp_structure_main table th:first-child {
    overflow-wrap: normal;
    word-break: normal;
}
.pkp_structure_main table td p { margin: 0; text-align: left; }

/* Fokus keyboard tetap terlihat */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}


/* =====================================================================
   3. KARTU HALAMAN (fluid, selalu punya margin tepi)
   ===================================================================== */
.pkp_structure_page {
    width: calc(100% - 32px);
    max-width: 1160px;
    margin: 20px auto;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 8px rgba(7, 73, 91, .25);
}

/* Hapus lebar tetap bawaan tema (728 / 952 / 1160px) */
.pkp_site_name_wrapper,
.pkp_navigation_primary_wrapper,
.has_site_logo .pkp_navigation_primary_wrapper,
.pkp_navigation_user,
.pkp_search_mobile,
.pkp_structure_content,
.pkp_structure_footer,
.has_site_logo .pkp_head_wrapper {
    width: 100%;
    max-width: none;
}
.has_site_logo .pkp_head_wrapper { padding-left: 0; padding-right: 0; }

.pkp_structure_head {
    background: var(--gradient-primary);
    border-bottom: 0;
    border-radius: 8px 8px 0 0;
}


/* =====================================================================
   4. HEADER: logo / banner
   ===================================================================== */
.pkp_site_name,
.pkp_site_name a {
    color: #fff !important;
}
.pkp_site_name {
    margin: 0;
}
.pkp_site_name .is_img {
    display: block;
    margin: 0;
    padding: 0;
}
.pkp_site_name .is_img img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: none;
    margin: 0 auto;
}
.pkp_site_name .is_text {
    display: block;
    padding: .8rem 1rem;
    line-height: 1.4;
    overflow-wrap: break-word;
}


/* =====================================================================
   5. NAVIGASI: tampilan umum
   ===================================================================== */
.pkp_site_nav_menu a { color: #fff; }

.pkp_navigation_user .task_count {
    background: rgba(255, 255, 255, .18);
}

/* Dropdown (latar cyan tua, hover cyan muda) */
.pkp_nav_list ul {
    max-width: 90vw;
}


/* =====================================================================
   6. NAVIGASI MOBILE / TABLET (< 992px): tombol hamburger
   ===================================================================== */
@media (max-width: 991px) {

    /* Bar atas berisi tombol hamburger, banner di bawahnya */
    .pkp_site_name_wrapper {
        height: auto;
        padding: 2.857rem 0 0;
        background: var(--gradient-primary);
    }
    .pkp_site_name {
        position: static;
        left: auto;
        right: auto;
        padding: 0;
        overflow: visible;
        white-space: normal;
        font-size: 1rem;
        background: transparent;
    }
    .pkp_site_nav_toggle {
        background: rgba(255, 255, 255, .06);
        border-radius: 8px 0 0 0;
    }

    /* Menu terbuka tepat di bawah bar hamburger */
    .pkp_site_nav_menu {
        top: 2.857rem;
        max-height: calc(100vh - 2.857rem);
        overflow-y: auto;
        padding: .5rem 1rem 1rem;
        background: var(--primary-color);
        box-shadow: 0 10px 18px rgba(0, 0, 0, .3);
    }
    .pkp_site_nav_menu a {
        display: block;
        padding: .7rem .25rem;        /* area sentuh min. ~44px */
        border-bottom: 1px solid rgba(255, 255, 255, .12);
    }
    .pkp_site_nav_menu a:hover,
    .pkp_site_nav_menu a:focus {
        background: rgba(255, 255, 255, .1);
        text-decoration: none;
    }
    .pkp_site_nav_menu ul ul {
        padding-left: 1rem;
    }
    .pkp_navigation_primary_wrapper,
    .pkp_navigation_user_wrapper {
        padding: 0;
    }
    .pkp_navigation_search_wrapper {
        border-top: 0;
        margin-top: .5rem;
        padding-top: 0;
    }
}


/* =====================================================================
   7. NAVIGASI DESKTOP (>= 992px)
   ===================================================================== */
@media (min-width: 992px) {

    /* Tombol Register / Login tampil di pojok kanan atas, menumpuk di atas banner.
       (Di HP, tautan Login/Register ada di dalam menu hamburger.) */
    .pkp_head_wrapper,
    .has_site_logo .pkp_head_wrapper {
        padding-top: 0;
    }
    .pkp_site_name .is_img img {
        border-radius: 8px 8px 0 0;
    }

    /* Kotak cyan di pojok kanan atas banner (21,2% lebar x 14,8% tinggi banner,
       ukurannya mengikuti gambar). Login/Register diletakkan tepat di dalamnya. */
    .pkp_navigation_user_wrapper {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 0;
        left: auto;
        right: 0;
        width: 21.2%;
        aspect-ratio: 546 / 120;        /* sama dengan kotak cyan pada banner */
        box-sizing: border-box;
        padding: 0 3%;
        transform: none;
        text-align: center;
        z-index: 1000;
    }
    .pkp_navigation_user {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: center;
        gap: 4px;
        width: 100%;
        margin: 0;
        padding: 0;
    }
    .pkp_navigation_user::before,
    .pkp_navigation_user::after {
        display: none;
    }
    .pkp_navigation_user > li {
        flex: 1 1 auto;                 /* lebar mengikuti isi, teks tidak terpotong */
        min-width: max-content;
        margin: 0;
    }
    .pkp_navigation_user > li > a {
        display: block;
        margin: 0;
        padding: .3rem .5rem;
        border: 1px solid rgba(255, 255, 255, .55);
        border-radius: 4px;
        background: var(--primary-color);
        color: #fff;
        font-size: clamp(11px, 1.1vw, 13px);   /* mengecil sedikit mengikuti lebar layar */
        font-weight: 600;
        line-height: 1.4;
        text-align: center;
        white-space: nowrap;
    }
    .pkp_navigation_user > li > a:hover,
    .pkp_navigation_user > li > a:focus {
        background: var(--accent-color);
        border-color: var(--accent-color);
        color: #263f56;
    }
    .pkp_navigation_user > li:last-child > a {
        margin: 0;
    }

    /* Bilah menu utama */
    .pkp_site_nav_menu {
        width: 100%;
        background: var(--gradient-nav);
    }
    .pkp_navigation_primary_row {
        display: block;
        background: transparent;
    }
    .pkp_navigation_primary_wrapper,
    .has_site_logo .pkp_navigation_primary_wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        padding: 0 1rem;
        background: transparent;
    }
    .pkp_navigation_primary_wrapper::before,
    .pkp_navigation_primary_wrapper::after {
        display: none;
    }
    .pkp_navigation_primary {
        display: flex;
        flex-wrap: wrap;
        flex: 1 1 auto;
        max-width: none;
        text-align: left;
        margin: 0;
    }
    .pkp_navigation_primary > li:first-child a { margin-left: .5em; }
    .pkp_navigation_primary > li > a {
        font-weight: 600;
        color: #fff;
    }
    .pkp_navigation_primary > li > a:hover {
        color: #fff;
        background: rgba(255, 255, 255, .1);
        border-color: var(--accent-color);
    }
    .pkp_navigation_search_wrapper {
        float: none;
        margin-left: auto;
    }
    .pkp_navigation_search_wrapper a:hover {
        border-color: var(--accent-color);
    }

    /* Dropdown */
    .pkp_nav_list ul {
        background: var(--primary-color);
        border-radius: 0 0 6px 6px;
    }
    .pkp_nav_list ul a {
        color: #fff;
        background: var(--primary-color);
    }
    .pkp_nav_list ul a:hover,
    .pkp_nav_list ul a:focus {
        background: var(--mint-color);
        border-color: var(--accent-color);
        color: var(--primary-color);
    }
}


/* =====================================================================
   8. LAYOUT KONTEN + SIDEBAR
   ===================================================================== */
.pkp_structure_content {
    padding-left: 0;
    padding-right: 0;
}

/* Garis pemisah bawaan (posisi px tetap) dimatikan, diganti border */
@media (min-width: 768px) {
    .pkp_structure_main::before,
    .pkp_structure_main::after {
        display: none !important;
        content: none !important;
    }
}

/* Mobile kecil: gutter tepi kecil agar teks lega */
@media (max-width: 479px) {
    .pkp_structure_content {
        padding-left: .286rem;
        padding-right: .286rem;
    }
}

/* Tablet & HP: sidebar di bawah konten, blok disusun grid otomatis */
@media (max-width: 991px) {
    .pkp_structure_sidebar {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        gap: 16px;
        align-items: start;
        padding: 0 1rem 1.5rem;
    }
}

/* Desktop: dua kolom fluid (konten + sidebar 300px) */
@media (min-width: 992px) {
    .pkp_structure_content {
        padding-top: 1.25rem;
        display: flex;
        align-items: stretch;
        flex-wrap: nowrap;
    }
    .pkp_structure_content::before,
    .pkp_structure_content::after {
        display: none;
    }
    .pkp_structure_main {
        float: none;
        flex: 1 1 0;
        width: auto;
        min-width: 0;                   /* kunci: cegah konten mendorong sidebar */
        border: 0 !important;           /* tanpa garis pemisah vertikal */
        padding-bottom: 3rem;
    }
    .pkp_structure_main:first-child:last-child {
        margin: 0;
        border: 0;
    }
    .pkp_structure_sidebar {
        float: none;
        flex: 0 0 300px;
        width: 300px;
        padding: 0 1.25rem 1.5rem;
    }
}


/* =====================================================================
   9. BLOK SIDEBAR
   ===================================================================== */
.pkp_structure_sidebar .pkp_block {
    padding: 0;
    margin: 0 0 16px;
    background: transparent;
    border: 0;                        /* tanpa bingkai di sekeliling blok */
    border-radius: 0;
    overflow: hidden;
    font-size: 14px;
}
.pkp_structure_sidebar .pkp_block .title:not(.pkp_screen_reader) {
    display: block;
    margin: 0 0 8px;
    padding: 8px 12px;
    background: var(--gradient-primary);
    border-bottom: 2px solid var(--accent-color);
    color: #fff !important;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .5px;
    text-align: center;
    text-transform: uppercase;
}
.pkp_structure_sidebar .pkp_block .content,
.pkp_structure_sidebar .pkp_block > p,
.pkp_structure_sidebar .pkp_block > ul {
    padding: 4px 12px 10px;
}
.pkp_structure_sidebar .pkp_block .content ul li {
    padding: .3rem 0;
}
.pkp_structure_sidebar .pkp_block img {
    max-width: 100%;
    height: auto;
}

/* Blok kustom berisi menu (Journal Policies, People, Submission, dll.) */
.pkp_block.block_custom p.menu_item,
.pkp_block.block_custom p {
    margin: 0;
}
.pkp_block.block_custom p.menu_item a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--border-color);
    transition: background .2s ease, padding .2s ease;
}
.pkp_block.block_custom p.menu_item a:hover {
    padding-left: 18px;
    background: var(--gradient-mint);
    color: var(--primary-color);
}
.pkp_block.block_custom p.menu_item a .fa {
    width: 16px;
    flex-shrink: 0;
    text-align: center;
    color: var(--secondary-color);
}

/* Tombol "Make a Submission" */
.pkp_structure_sidebar .block_make_submission {
    border: 0;
    background: transparent;
    overflow: visible;
}
.pkp_structure_sidebar .block_make_submission a {
    display: block;
    border: 0;
    border-radius: 6px;
    background: var(--gradient-secondary);
    box-shadow: none;
    color: #fff;
    font-size: 14px;
    line-height: 2.8;
    text-align: center;
    text-transform: uppercase;
}
.pkp_structure_sidebar .block_make_submission a:hover {
    background: var(--gradient-mint);
    color: var(--primary-color);
}


/* =====================================================================
   10. BERANDA
   ===================================================================== */
/* Urutan beranda: Additional Content -> Pengumuman -> Current Issue
   (elemen lain, mis. gambar beranda, tetap di paling atas) */
.page_index_journal {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.page_index_journal .additional_content { order: 1; padding-bottom: 1rem; }
.page_index_journal .cmp_announcements  { order: 2; }
.page_index_journal .current_issue      { order: 3; margin-top: 1.5rem; }

.pkp_page_index .current_issue > h2 {
    margin: 0 0 .5rem;
    padding: 4px 12px;
    background: var(--gradient-primary);
    border-radius: 5px;
    color: #fff;
    text-align: center;
}
.pkp_page_index .current_issue .current_issue_title {
    margin: 12px 0;
    color: var(--primary-color);
}
.pkp_page_index .additional_content {
    border-top: 0;
    padding-top: 0;
}

/* Tombol "View All Issues" / "Read more" */
a.read_more,
.pkp_page_index .current_issue .read_more {
    margin-top: 6px;
    padding-left: 12px;
    border-radius: 5px;
    background: var(--gradient-secondary);
    color: #fff !important;
}
a.read_more:hover {
    background: var(--gradient-mint);
    color: var(--primary-color) !important;
}


/* =====================================================================
   11. DAFTAR ISI ISSUE & KARTU ARTIKEL
   ===================================================================== */
.cmp_article_list > li {
    margin-bottom: 14px;
}
.obj_article_summary {
    padding: 16px 18px;
    background: #fff;
    border: 1px solid var(--border-color);
    border-left: 3px solid var(--accent-color);
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
}
.obj_article_summary > .title {
    font-size: 16px;
    line-height: 1.5;
    overflow-wrap: break-word;
}
.obj_article_summary > .title a { color: var(--primary-color); }
.obj_article_summary > .title a:hover { color: var(--link-hover-color); }
.obj_article_summary .authors { overflow-wrap: break-word; }

/* Tombol PDF / galley boleh turun baris, tidak melebar keluar layar */
.obj_article_summary .galleys_links,
.obj_issue_toc .galleys_links,
.obj_article_details .galleys_links {
    flex-flow: row wrap;
    gap: .5rem;
}
.obj_article_summary .galleys_links li,
.obj_issue_toc .galleys_links li,
.obj_article_details .galleys_links li {
    margin-inline-end: 0;
}

.obj_galley_link {
    border: 0;
    background: var(--gradient-secondary);
    color: #fff;
}
.obj_galley_link:hover,
.obj_galley_link:focus {
    background: var(--gradient-mint);
    color: var(--primary-color);
}

/* Judul seksi pada daftar isi */
.obj_issue_toc .section {
    margin: 1.5rem 0;
    padding: 0;
}
.obj_issue_toc .section::before,
.obj_issue_toc .galleys::before {
    display: none;
}
.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3,
.obj_issue_toc .galleys > h2,
.obj_issue_toc .galleys > h3 {
    display: block;
    left: 0;
    margin: 0 0 .75rem;
    padding: .3rem 1rem;
    background: var(--gradient-primary);
    border-radius: 5px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.8;
}
@media (min-width: 768px) {
    .obj_issue_toc .galleys,
    .obj_issue_toc .section {
        margin: 1.5rem 0;
        padding: 0;
    }
}

.obj_issue_toc .cover img,
.obj_issue_summary .cover img {
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .15);
}
.page_issue_archive .issues_archive > li {
    padding-top: 14px;
    padding-bottom: 14px;
}


/* =====================================================================
   12. HALAMAN DETAIL ARTIKEL (menggantikan lebar kolom tetap)
   ===================================================================== */
.obj_article_details .row {
    display: flex;
    flex-wrap: wrap;
    border: 0;
    margin-top: 1rem;
}
.obj_article_details .row::before,
.obj_article_details .row::after {
    display: none;
}
.obj_article_details .main_entry,
.obj_article_details .entry_details {
    float: none;
    width: 100%;
    min-width: 0;
}
.obj_article_details .main_entry {
    border-right: 0;
}
.obj_article_details .item {
    overflow-wrap: break-word;
}
.obj_article_details .item .label,
.obj_article_details .main_entry .item .label {
    color: var(--primary-color);
}
.obj_article_details .authors .name { color: var(--primary-color); }
.obj_article_details .authors .userGroup { display: none; }
.obj_article_details .entry_details .item .label {
    color: var(--primary-color);
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 4px;
    margin-bottom: 6px;
}
.obj_article_details .citation_display .csl-entry,
.csl-entry {
    font-size: 15px;
    text-align: start;
}

/* HP: panel samping (cover, PDF, tanggal, kutipan) turun ke bawah */
@media (max-width: 767px) {
    .obj_article_details .entry_details {
        margin: 1.25rem 0 0;
        background: #f5fafc;
        border: 1px solid var(--border-color);
        border-radius: 6px;
    }
}

/* Tablet & desktop: dua kolom fluid */
@media (min-width: 768px) {
    .obj_article_details .row {
        margin-left: 0;
        margin-right: 0;
        flex-wrap: nowrap;
    }
    .obj_article_details .main_entry {
        flex: 1 1 0;
        width: auto;
    }
    .obj_article_details .entry_details {
        flex: 0 0 270px;
        width: 270px;
        margin: 0;
        background: #f5fafc;
        border-top: 0;
        border-left: 1px solid var(--border-color);
        border-radius: 0 6px 6px 0;
    }
}
@media (min-width: 992px) {
    .obj_article_details .entry_details { flex-basis: 300px; width: 300px; }
}


/* =====================================================================
   13. TOMBOL & FORMULIR
   ===================================================================== */
.pkp_button_primary,
.cmp_button,
.cmp_form .buttons button {
    background: var(--gradient-secondary);
    border-color: var(--secondary-color);
    color: #fff;
}
.pkp_button,
.cmp_button_wire {
    color: var(--link-color);
    border-color: var(--secondary-color);
}
.cmp_button_wire:hover,
.cmp_button_wire:focus {
    background: var(--secondary-color);
    color: #fff;
}
.pkp_button_primary:hover,
.pkp_button_primary:focus,
.cmp_button:hover,
.cmp_button:focus {
    background: var(--primary-color);
    color: #fff;
}
.page_search .submit button::after { background: var(--secondary-color); }

.cmp_form input[type="text"],
.cmp_form input[type="email"],
.cmp_form input[type="password"],
.cmp_form input[type="url"],
.cmp_form input[type="tel"],
.cmp_form select,
.cmp_form textarea {
    max-width: 100%;
}
@media (max-width: 479px) {
    .page_login .login,
    .page_lost_password .lost_password {
        max-width: 100%;
    }
    .page_search .date_range [name*="Year"],
    .page_search .date_range [name*="Day"],
    .page_search .date_range [name*="Month"] {
        width: auto;
        max-width: 31%;
    }
}

.header_view { background: var(--primary-color); }
.header_view .return { color: var(--primary-color); }


/* =====================================================================
   14. FOOTER (full lebar, tanpa logo PKP)
   ===================================================================== */
.pkp_structure_footer_wrapper {
    background: var(--gradient-cover);
    border-radius: 0 0 8px 8px;
    color: #fff;
}
.pkp_structure_footer {
    width: 100%;
    max-width: none;
    padding: 0;
}
/* Hilangkan bingkai/jarak bawaan agar isi footer menempel penuh ke tepi kartu */
.pkp_footer_content {
    padding: 0;
    color: #fff;
    text-align: left;
    overflow-wrap: break-word;
}
.pkp_footer_content > * {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 1.75rem 1.5rem !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 0 8px 8px !important;
    box-shadow: none !important;
    color: #fff;
}
.pkp_footer_content p,
.pkp_footer_content address,
.pkp_footer_content li,
.pkp_footer_content h2,
.pkp_footer_content h3,
.pkp_footer_content h4 {
    color: #fff;
    font-style: normal;
}
.pkp_footer_content a {
    color: #fff;
    text-decoration: underline;
}
.pkp_footer_content a:hover {
    color: var(--mint-color);
}
.pkp_footer_content iframe {
    display: block;
    width: 100% !important;
    max-width: 100%;
    border: 0;
    border-radius: 6px;
}
/* Logo "Platform & workflow by OJS/PKP" disembunyikan */
.pkp_brand_footer {
    display: none !important;
}

/* Kolom footer buatan sendiri jadi satu kolom di layar kecil */
@media (max-width: 767px) {
    .pkp_footer_content [style*="grid-template-columns"] {
        grid-template-columns: 1fr !important;
    }
    .pkp_footer_content [style*="display: flex"],
    .pkp_footer_content [style*="display:flex"] {
        flex-wrap: wrap !important;
    }
    .pkp_footer_content > * {
        padding: 1.25rem 1rem !important;
        border-radius: 0 !important;
    }
}

/* Footer kolom-kolom (opsional, kompatibel dengan struktur footer Ingenium) */
.footer-contact .row {
    display: flex;
    flex-wrap: wrap;
    gap: 24px 30px;
    justify-content: space-between;
}
.footer-contact .row::before,
.footer-contact .row::after {
    display: none;
}
.footer-contact .footer-col {
    flex: 1 1 220px;
    min-width: 0;
}
.footer-title {
    display: inline-block;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 2px solid var(--accent-color);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
}
.footer-contact ul { margin: 0; padding: 0; list-style: none; }


/* =====================================================================
   15. PENYESUAIAN UKURAN LAYAR
   ===================================================================== */

/* Tablet: kartu halaman sedikit lebih lebar */
@media (max-width: 1024px) {
    .pkp_structure_page { width: calc(100% - 24px); }
}

/* HP & tablet kecil: kartu penuh layar, tanpa sudut membulat */
@media (max-width: 767px) {
    .pkp_structure_page {
        width: 100%;
        margin: 0;
        border-radius: 0;
        box-shadow: none;
    }
    .pkp_structure_head,
    .pkp_structure_footer_wrapper {
        border-radius: 0;
    }
    body { font-size: 14px; }
    .obj_article_summary { padding: 14px; }
}

/* HP: ukuran teks & perataan lebih nyaman dibaca */
@media (max-width: 576px) {
    .pkp_structure_main p,
    .pkp_structure_main ul,
    .pkp_structure_main ol {
        font-size: 15px;
    }
    .pkp_structure_main p { text-align: start; }   /* justify di layar sempit = spasi renggang */
    .pkp_structure_main table td,
    .pkp_structure_main table th {
        width: auto !important;
        padding: .35rem .45rem;
        font-size: 14px;
    }
    .obj_article_summary > .title { font-size: 15px; }
}

/* Hormati preferensi "kurangi animasi" */
@media (prefers-reduced-motion: reduce) {
    * {
        transition: none !important;
        animation: none !important;
    }
}


/* =====================================================================
   16. MENU SIDEBAR BERIKON (People / Journal Policies / Submission)
   Kompatibel dengan HTML Ingenium: ul.*_list > li.*_item > a.*_item_link
   Ikon dipilih otomatis dari atribut title="..." pada link.
   Butuh FontAwesome (sudah dimuat tema OJS).
   ===================================================================== */
.submission_title, .journal_policies_title, .governing_body_title,
.visitor_title, .visitor_header_title, .eissn_title, .assosiate_title,
.tools_title, .scimago-journal-rank {
    display: block;
    margin: 0;
    padding: 8px 12px;
    background: var(--gradient-primary);
    border-bottom: 2px solid var(--accent-color);
    border-radius: 5px 5px 0 0;
    color: #fff !important;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .5px;
    text-align: center;
    text-transform: uppercase;
    list-style: none;
}
.governing_body_list, .submission_list, .journal_policies_list {
    margin: 0;
    padding: 0;
    list-style: none;
}
.governing_body_item_link,
.submission_item_link,
.journal_policies_item_link {
    display: flex;
    align-items: flex-start;
    padding: 9px 12px;
    border-bottom: 1px solid var(--border-color);
    color: var(--primary-color);
    font-size: 14px;
    line-height: 1.5;
    transition: background .2s ease, padding .2s ease;
}
.governing_body_item_link::before,
.submission_item_link::before,
.journal_policies_item_link::before {
    flex-shrink: 0;
    width: 18px;
    margin-right: 10px;
    font-family: FontAwesome;
    text-align: center;
    color: var(--secondary-color);
}
.governing_body_item_link:hover,
.submission_item_link:hover,
.journal_policies_item_link:hover {
    padding-left: 18px;
    background: var(--gradient-primary);
    color: #fff;
}
.governing_body_item_link:hover::before,
.submission_item_link:hover::before,
.journal_policies_item_link:hover::before {
    color: #fff;
}
.governing_body_item_link[title*="Editorial Team"]::before { content: "\f0c0"; }
.governing_body_item_link[title*="Peer Reviewers"]::before { content: "\f233"; }
.governing_body_item_link[title*="Reviewers"]::before      { content: "\f233"; }
.governing_body_item_link[title*="Contact"]::before        { content: "\f0e0"; }

.submission_item_link[title*="Submit Now"]::before          { content: "\f0ee"; }
.submission_item_link[title*="Author Guidelines"]::before   { content: "\f02d"; }
.submission_item_link[title*="Reviewer Guidelines"]::before { content: "\f044"; }
.submission_item_link[title*="Template"]::before            { content: "\f1c1"; }
.submission_item_link[title*="Privacy Statement"]::before   { content: "\f023"; }
.submission_item_link[title*="AI"]::before                  { content: "\f1b2"; }

.journal_policies_item_link[title*="Aim and Scope"]::before            { content: "\f05b"; }
.journal_policies_item_link[title*="Peer Review"]::before              { content: "\f00c"; }
.journal_policies_item_link[title*="Publication Ethics"]::before       { content: "\f24e"; }
.journal_policies_item_link[title*="Misconduct"]::before               { content: "\f071"; }
.journal_policies_item_link[title*="Retraction"]::before               { content: "\f0e2"; }
.journal_policies_item_link[title*="Conflicts of Interest"]::before    { content: "\f0ec"; }
.journal_policies_item_link[title*="Complaints"]::before               { content: "\f0e6"; }
.journal_policies_item_link[title*="Plagiarism"]::before               { content: "\f1f8"; }
.journal_policies_item_link[title*="Copyright"]::before                { content: "\f1f9"; }
.journal_policies_item_link[title*="Publication Frequency"]::before    { content: "\f017"; }
.journal_policies_item_link[title*="Processing Charge"]::before        { content: "\f155"; }
.journal_policies_item_link[title*="Withdrawal"]::before               { content: "\f05e"; }
.journal_policies_item_link[title*="Open Access"]::before              { content: "\f09c"; }
.journal_policies_item_link[title*="Archiving"]::before                { content: "\f187"; }
.journal_policies_item_link[title*="Revenue"]::before                  { content: "\f0d6"; }
.journal_policies_item_link[title*="Generative AI"]::before            { content: "\f1b2"; }
.journal_policies_item_link[title*="Indexing"]::before                 { content: "\f022"; }
.journal_policies_item_link[title*="Abstracting"]::before              { content: "\f022"; }

/* Pembungkus kotak menu */
.submission, .governing_body, .journal_policies,
.png-scimago, .tools_grid, .png_visitor, .png_citedness,
.png_custom_block, .png-assosiate {
    margin-bottom: 16px;
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: hidden;
}


/* =====================================================================
   17. BLOK KECIL: scimago, tools, visitor, asosiasi, sitasi
   ===================================================================== */
.png-scimago img,
.png_citedness img,
.png_custom_block img,
.png_statcounter img {
    display: block;
    max-width: 100%;
    margin: 6px auto;
    transition: transform .2s ease;
}
.png-scimago img:hover,
.png_citedness img:hover,
.png_custom_block img:hover { transform: scale(1.04); }
.png_visitor, .png_citedness { padding: 6px 10px; }
figure.visitor_card { margin: .75rem 0; }

.png-assosiate {
    display: flex;
    flex-wrap: wrap;                     /* boleh turun baris di layar sempit */
    justify-content: center;
    align-items: center;
    gap: 14px;
    padding: 10px 8px;
}
.png-assosiate img {
    flex: 0 1 100px;
    max-width: 100px;
    height: 80px;
    object-fit: contain;
}

.tools_list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin: 8px;
    padding: 0;
    list-style: none;
}
.tools_item {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 70px;
    padding: 5px;
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    overflow: hidden;
    transition: box-shadow .2s ease, border-color .2s ease;
}
.tools_item a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}
.tools_item img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}
.tools_item:hover {
    border-color: var(--secondary-color);
    box-shadow: 0 2px 5px rgba(0, 0, 0, .12);
}


/* =====================================================================
   18. KEYWORD CLOUD
   ===================================================================== */
.pkp_block.block_Keywordcloud .title:not(.pkp_screen_reader) { margin-bottom: 0; }
.pkp_block.block_Keywordcloud .content {
    padding: 12px;
    min-height: 60px;
    background: #fff;
}
.pkp_block.block_Keywordcloud .content svg {
    display: block;
    max-width: 100%;
    height: auto;
}


/* =====================================================================
   19. KARTU SUBMISSION / LOGIN / INDEXING (di halaman atau blok)
   Class .ijstb-* dipertahankan agar HTML dari Ingenium bisa dipakai;
   class .lw-* adalah nama yang sama untuk Lughawiyah.
   ===================================================================== */
.lw-submission, .ijstb-submission {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 800px;
    margin: 20px auto;
}
.lw-actions, .ijstb-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}
.lw-btn, .ijstb-btn {
    display: inline-block;
    padding: 10px 22px;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    transition: all .25s ease;
}
.lw-btn--primary, .ijstb-btn--primary {
    background: var(--gradient-secondary);
    box-shadow: 0 3px 6px rgba(0, 0, 0, .2);
    color: #fff !important;
}
.lw-btn--primary:hover, .ijstb-btn--primary:hover {
    background: var(--gradient-mint);
    color: var(--primary-color) !important;
}
.lw-btn--outline, .ijstb-btn--outline {
    background: #fff;
    border: 2px solid var(--primary-color);
    color: var(--primary-color) !important;
}
.lw-btn--outline:hover, .ijstb-btn--outline:hover {
    background: var(--gradient-primary);
    color: #fff !important;
}
.lw-card, .ijstb-card {
    padding: 18px 20px;
    background: #fff;
    border: 1px solid var(--border-color);
    border-left: 3px solid var(--accent-color);
    border-radius: 8px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, .06);
}
.lw-card__title, .ijstb-card__title {
    display: inline-block;
    margin: 0 0 12px;
    padding-bottom: 4px;
    border-bottom: 2px solid var(--accent-color);
    color: var(--primary-color);
    font-size: 17px;
}
.lw-card p, .ijstb-card p { margin: 0; }
.lw-login-list, .ijstb-login-list { margin: 0 0 10px; padding: 0; list-style: none; }
.lw-login-list li, .ijstb-login-list li {
    padding: 8px 0;
    border-bottom: 1px dashed var(--border-color);
}
.lw-login-list li:last-child, .ijstb-login-list li:last-child { border-bottom: 0; }
.lw-link, .ijstb-link { color: var(--secondary-color); font-weight: 700; text-decoration: underline; }
.lw-note, .ijstb-note { margin-top: 8px; color: #666; font-size: 13px; }

.lw-indexing-grid, .ijstb-indexing-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.lw-indexing-grid a, .ijstb-indexing-grid a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 90px;
    width: 90px;
    height: 90px;
    padding: 6px;
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    transition: all .2s ease;
}
.lw-indexing-grid a:hover, .ijstb-indexing-grid a:hover {
    border-color: var(--accent-color);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
    transform: translateY(-2px);
}
.lw-indexing-grid img, .ijstb-indexing-grid img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
@media (max-width: 600px) {
    .lw-actions, .ijstb-actions { flex-direction: column; }
    .lw-card, .ijstb-card { padding: 14px; }
}


/* =====================================================================
   20. TIM EDITORIAL (halaman Editorial Team)
   ===================================================================== */
.editorial-team { max-width: 1000px; line-height: 1.6; }
.editorial-section-title {
    margin: 14px 0 6px !important;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--primary-color);
    color: var(--primary-color);
    font-size: 1.2rem;
}
.editorial-member-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 10px;
    padding: 6px 0;
}
.editorial-featured { padding-left: 10px; border-left: 3px solid var(--accent-color); }
.editorial-photo {
    flex: 0 0 auto;
    width: 70px;
    height: 70px;
    object-fit: cover;
    background: #f0f0f0;
    border: 1px solid var(--border-color);
    border-radius: 8px;
}
.editorial-member-info { flex: 1 1 0; min-width: 0; }
.editorial-member-name { margin: 0 !important; line-height: 1.4 !important; }
.editorial-member-name strong { color: #1a1a1a; font-size: 1.05rem; }
.editorial-member-affiliation { margin: 0 !important; font-size: 14px !important; }
.editorial-link-btn {
    display: inline-block;
    margin: 3px 3px 0 0;
    padding: 2px 10px;
    border: 1px solid currentColor;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    transition: all .2s ease;
}
.editorial-link-btn:hover {
    background: #f0f0f0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
}
.editorial-scopus  { color: #ff6600; }
.editorial-wos     { color: #2c3e50; }
.editorial-scholar { color: #4285f4; }
.editorial-orcid   { color: #6c8f1a; }
.editorial-sinta   { color: #212529; }

@media (max-width: 600px) {
    .editorial-member-card { flex-direction: column; align-items: center; text-align: center; }
    .editorial-featured { border-left: 0; padding-left: 0; }
    .editorial-photo { width: 120px; height: 150px; }
    .editorial-link-btn { padding: 4px 8px; }
}


/* =====================================================================
   21. IKON SOSIAL MEDIA DI FOOTER
   Pakai: <div class="social_media_list"><a class="sm-icon" ...>
   ===================================================================== */
.social_media_list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 4px;
}
.social_media_list .sm-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 2px solid var(--accent-color);
    border-radius: 50%;
    background: var(--gradient-primary);
    color: #fff !important;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none !important;
    transition: all .25s ease;
}
.social_media_list .sm-icon:hover {
    background: var(--gradient-secondary);
    border-color: var(--mint-color);
    transform: translateY(-3px);
}

.copyright-wrapper {
    padding: 14px 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, .2);
    text-align: center;
}
.copyright-wrapper,
.copyright-wrapper * {
    color: #fff !important;
    font-size: 13px;
    line-height: 1.6;
}


/* =====================================================================
   22. ARAB / RTL
   ===================================================================== */
:lang(ar), [dir="rtl"] {
    font-family: "Noto Naskh Arabic", "Amiri", "Traditional Arabic", "Segoe UI", serif;
}
body[dir="rtl"] .pkp_structure_main p { text-align: justify; }
body[dir="rtl"] .obj_article_summary { border-left: 1px solid var(--border-color); border-right: 3px solid var(--accent-color); }
body[dir="rtl"] .pkp_block.block_custom p.menu_item a:hover,
body[dir="rtl"] .governing_body_item_link:hover,
body[dir="rtl"] .submission_item_link:hover,
body[dir="rtl"] .journal_policies_item_link:hover {
    padding-left: 12px;
    padding-right: 18px;
}
body[dir="rtl"] .governing_body_item_link::before,
body[dir="rtl"] .submission_item_link::before,
body[dir="rtl"] .journal_policies_item_link::before {
    margin-right: 0;
    margin-left: 10px;
}


/* =====================================================================
   23. CETAK
   ===================================================================== */
@media print {
    html, body { background: #fff; }
    .pkp_structure_head, .pkp_structure_sidebar, .pkp_structure_footer_wrapper,
    .pkp_site_nav_toggle, .cmp_skip_to_content, .galleys_links {
        display: none !important;
    }
    .pkp_structure_page { width: 100%; max-width: none; margin: 0; box-shadow: none; border-radius: 0; }
    .pkp_structure_content { display: block; }
    .pkp_structure_main { border: 0; padding: 0; }
    .pkp_structure_main a { color: #000; text-decoration: underline; }
    .obj_article_details .row { display: block; }
    .obj_article_details .entry_details { width: 100%; border: 0; background: none; }
}


/* =====================================================================
   24. BERANDA: KARTU INFO JURNAL + ANIMASI
   Dipakai oleh HTML "Additional Content" (lihat lughawiyah-additional-content.html)
   Animasi hanya memakai transform (translateY/scale) dan opacity,
   jadi tidak pernah menimbulkan scroll samping.
   Otomatis mati bila pengguna memilih "kurangi animasi" (bagian 15).
   ===================================================================== */

/* ---- keyframes ---- */
@keyframes lw-fade-up {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: none; }
}
@keyframes lw-pop {
    from { opacity: 0; transform: scale(.7); }
    to   { opacity: 1; transform: none; }
}
@keyframes lw-float {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-7px); }
}
@keyframes lw-shine {
    0%        { left: -70%; }
    55%, 100% { left: 140%; }
}

/* ---- paragraf pengantar ---- */
.additional_content .lw-lead {
    max-width: 800px;
    margin: 0 auto 1rem;
    color: #444;
    line-height: 1.75;
    text-align: justify;
    animation: lw-fade-up .7s ease backwards;
}

/* ---- kartu info jurnal (cover + data) ---- */
.lw-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 24px;
    max-width: 800px;
    margin: 20px auto;
    padding: 24px;
    background: linear-gradient(135deg, #e6f6fa 0%, #fdf4d9 100%);
    border: 1px solid var(--border-color);
    border-left: 3px solid var(--accent-color);
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
    animation: lw-fade-up .8s ease .1s backwards;
    transition: box-shadow .3s ease;
}
.lw-hero:hover { box-shadow: 0 8px 22px rgba(7, 73, 91, .2); }

.lw-hero__cover {
    flex: 0 0 auto;
    margin: 0 auto;
}
.lw-hero__cover img {
    display: block;
    width: 200px;
    max-width: 100% !important;
    height: auto !important;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .2);
    animation: lw-float 4.5s ease-in-out infinite;
}

.lw-hero__text {
    flex: 1 1 260px;
    min-width: 0;                       /* kunci: tidak memaksa melebar di HP kecil */
    color: #444;
    font-size: 14px;
}
.lw-hero .lw-hero__title {
    margin: 0 0 8px;
    color: var(--primary-color);
    font-size: 19px;
    line-height: 1.35;
}
.lw-hero__text p {
    margin: 5px 0;
    font-size: 14px;
    line-height: 1.6;
    text-align: left;
}
.lw-hero__text p strong { color: var(--primary-color); }
.lw-hero__text img.lw-inline-logo {
    display: inline-block;
    width: auto;
    height: 12px !important;
    vertical-align: middle;
}

/* ---- tautan dengan garis bawah yang "tumbuh" saat disorot ---- */
.animated-link {
    background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 2px;
    transition: background-size .3s ease, color .2s ease;
}
.animated-link:hover,
.animated-link:focus {
    background-size: 100% 2px;
}

/* ---- tombol: kilau bergerak ---- */
.lw-btn,
.lw-btn--gold {
    position: relative;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease;
}
.lw-btn--primary::after,
.lw-btn--gold::after {
    content: "";
    position: absolute;
    top: 0;
    left: -70%;
    width: 40%;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .55), transparent);
    transform: skewX(-20deg);
    animation: lw-shine 3.6s ease-in-out infinite;
    pointer-events: none;
}
.lw-btn:hover,
.lw-btn--gold:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 14px rgba(0, 0, 0, .25);
}
.lw-btn--gold {
    display: inline-block;
    margin-top: 8px;
    padding: 9px 18px;
    background: linear-gradient(135deg, #f8d85c 0%, #e5ab12 100%);
    border-radius: 6px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .2);
    color: #263f56 !important;
    font-size: 14px;
    font-weight: 700;
}
.lw-btn--gold:hover {
    background: var(--gradient-mint);
}

/* ---- kartu: muncul bertahap + terangkat saat disorot ---- */
.lw-submission > * {
    animation: lw-fade-up .7s ease backwards;
}
.lw-submission > *:nth-child(1) { animation-delay: .20s; }
.lw-submission > *:nth-child(2) { animation-delay: .30s; }
.lw-submission > *:nth-child(3) { animation-delay: .40s; }
.lw-submission > *:nth-child(4) { animation-delay: .50s; }
.lw-submission > *:nth-child(5) { animation-delay: .60s; }
.lw-submission > *:nth-child(6) { animation-delay: .70s; }

.lw-card {
    transition: transform .3s ease, box-shadow .3s ease, border-left-color .3s ease;
}
.lw-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 18px rgba(7, 73, 91, .15);
    border-left-color: var(--secondary-color);
}
.lw-card .lw-card__title {
    margin: 0 0 12px;
    font-size: 17px;
}

/* ---- logo indexing: muncul satu per satu, naik saat disorot ---- */
.lw-indexing-grid--center { justify-content: center; }
.lw-indexing-grid a {
    animation: lw-pop .5s ease backwards;
}
.lw-indexing-grid a:nth-child(1) { animation-delay: .5s; }
.lw-indexing-grid a:nth-child(2) { animation-delay: .6s; }
.lw-indexing-grid a:nth-child(3) { animation-delay: .7s; }
.lw-indexing-grid a:nth-child(4) { animation-delay: .8s; }
.lw-indexing-grid a:nth-child(5) { animation-delay: .9s; }
.lw-indexing-grid a:nth-child(6) { animation-delay: 1.0s; }
.lw-indexing-grid a:nth-child(7) { animation-delay: 1.1s; }
.lw-indexing-grid a:nth-child(8) { animation-delay: 1.2s; }
.lw-indexing-grid a:hover { transform: translateY(-5px) scale(1.04); }

/* ---- daftar artikel: bergeser halus (hanya perangkat dengan mouse) ---- */
.cmp_article_list > li { transition: transform .35s ease; }
@media (hover: hover) and (min-width: 768px) {
    .cmp_article_list > li:hover { transform: translateX(6px); }
}

/* ---- layar kecil ---- */
@media (max-width: 480px) {
    .lw-hero { padding: 16px; gap: 16px; }
    .lw-hero .lw-hero__title { font-size: 17px; }
    .additional_content .lw-lead { text-align: start; }
}

/* ---- rapikan jarak daftar login & catatan di dalam kartu ---- */
.lw-card .lw-login-list { margin: 0 0 10px; line-height: 1.6; }
.lw-card .lw-note       { margin-top: 8px; }


/* =====================================================================
   25. SIDEBAR TANPA GARIS / BINGKAI
   Menghapus bingkai luar blok, bingkai dalam (dari HTML blok kustom),
   dan garis tepi vertikal. Garis pemisah antar-item menu tetap ada.
   ===================================================================== */
.pkp_structure_sidebar,
.pkp_structure_sidebar::before,
.pkp_structure_sidebar::after,
.pkp_structure_sidebar .pkp_block,
.pkp_structure_sidebar .pkp_block::before,
.pkp_structure_sidebar .pkp_block::after,
.pkp_structure_sidebar .pkp_block .content,
.pkp_structure_sidebar .pkp_block .content > div,
.pkp_structure_sidebar .pkp_block .content > div > div,
.pkp_structure_sidebar .pkp_block .content > section,
.pkp_structure_sidebar .pkp_block .content > figure,
.pkp_structure_sidebar .pkp_block .content > center,
.pkp_structure_sidebar .pkp_block > div {
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
}
.pkp_structure_sidebar .pkp_block .content > div,
.pkp_structure_sidebar .pkp_block .content > div > div {
    border-radius: 0 !important;
}


/* =====================================================================
   26. FOOTER RINGKAS (HTML: lughawiyah-footer.html)
   Desktop: 3 kolom (tentang | tautan | kontak + peta)
   Tablet : 2 kolom, bagian "tentang" selebar penuh
   HP     : 1 kolom
   ===================================================================== */
.lw-footer {
    font-size: 14px;
    line-height: 1.65;
    color: #fff;
}
.lw-footer a {
    color: #fff;
    text-decoration: none;
    background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 1px;
    transition: background-size .3s ease, color .2s ease;
}
.lw-footer a:hover,
.lw-footer a:focus {
    color: var(--mint-color);
    background-size: 100% 1px;
}
.lw-footer p,
.lw-footer address { margin: 0; font-style: normal; }
.lw-footer ul { margin: 0; padding: 0; list-style: none; }

.lw-footer__grid {
    display: grid;
    grid-template-columns: 1.25fr 1fr 1.45fr;
    gap: 28px 40px;
    max-width: 1100px;
    margin: 0 auto;
}
.lw-footer__grid > div { min-width: 0; }

.lw-footer .lw-footer__name {
    margin: 0 0 8px;
    color: #fff;
    font-size: 17px;
    line-height: 1.35;
}
.lw-footer__desc { color: #dcf2f8; }
.lw-footer__issn { margin-top: 10px !important; }
.lw-footer__sep { margin: 0 6px; opacity: .6; }

.lw-footer .lw-footer__title {
    display: inline-block;
    margin: 0 0 10px;
    padding-bottom: 5px;
    border-bottom: 2px solid var(--accent-color);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .6px;
    text-transform: uppercase;
}

/* tautan cepat dengan panah kecil yang bergeser */
.lw-footer__links li { margin: 0; padding: 3px 0; }
.lw-footer__links a {
    display: inline-block;
    padding-left: 14px;
    position: relative;
}
.lw-footer__links a::before {
    content: "›";
    position: absolute;
    left: 0;
    color: var(--accent-color);
    font-weight: 700;
    transition: transform .25s ease;
}
.lw-footer__links a:hover::before { transform: translateX(4px); }

/* peta */
.lw-footer__map {
    margin-top: 12px;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .3);
}
.lw-footer__map iframe {
    display: block;
    width: 100% !important;
    height: 160px;
    border: 0;
}

/* hak cipta */
.lw-footer__bottom {
    max-width: 1100px;
    margin: 26px auto 0;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, .25);
    font-size: 13px;
    text-align: center;
}
.lw-footer__bottom p { margin: 0 0 6px; color: #dcf2f8; }
.lw-footer__bottom p:first-child { color: #fff; font-size: 14px; }
.lw-footer__bottom a { text-decoration: underline; background: none; }
.lw-footer__legal { margin-top: 10px !important; }

@media (max-width: 991px) {
    .lw-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lw-footer__about { grid-column: 1 / -1; }
}
@media (max-width: 599px) {
    .lw-footer__grid { grid-template-columns: 1fr; gap: 22px; }
    .lw-footer__bottom { text-align: left; }
    .lw-footer__map iframe { height: 190px; }
}


/* =====================================================================
   27. SIDEBAR KIRI/KANAN: KARTU RAPI + ANIMASI HOVER
   Bekerja dengan markup blok kustom yang ada sekarang (termasuk blok
   yang bersarang "pkp_block di dalam pkp_block"), tanpa ubah HTML.
   Untuk menghilangkan bayangan kartu: set --side-shadow: none;
   ===================================================================== */
:root {
    --side-shadow: 0 2px 10px rgba(7, 73, 91, .12);
    --side-shadow-hover: 0 10px 24px rgba(7, 73, 91, .2);
}

/* ---- 1. Satu kartu per blok (blok bersarang diratakan) ---- */
.pkp_structure_sidebar > .pkp_block:not(.block_make_submission) {
    margin: 0 0 18px;
    padding: 0 !important;
    background: #fff;
    border-radius: 12px;
    box-shadow: var(--side-shadow) !important;   /* !important: menang atas bagian 25 */
    overflow: hidden;
    animation: lw-fade-up .6s ease backwards;
    transition: transform .3s ease, box-shadow .3s ease;
}
.pkp_structure_sidebar > .pkp_block:not(.block_make_submission):hover {
    transform: translateY(-3px);
    box-shadow: var(--side-shadow-hover) !important;
}
.pkp_structure_sidebar > .pkp_block:nth-child(1) { animation-delay: .05s; }
.pkp_structure_sidebar > .pkp_block:nth-child(2) { animation-delay: .12s; }
.pkp_structure_sidebar > .pkp_block:nth-child(3) { animation-delay: .19s; }
.pkp_structure_sidebar > .pkp_block:nth-child(4) { animation-delay: .26s; }
.pkp_structure_sidebar > .pkp_block:nth-child(5) { animation-delay: .33s; }
.pkp_structure_sidebar > .pkp_block:nth-child(6) { animation-delay: .40s; }
.pkp_structure_sidebar > .pkp_block:nth-child(7) { animation-delay: .47s; }
.pkp_structure_sidebar > .pkp_block:nth-child(n+8) { animation-delay: .54s; }

/* blok di dalam blok: tidak boleh jadi kartu lagi */
.pkp_structure_sidebar .pkp_block .pkp_block {
    margin: 0;
    padding: 0;
    background: transparent;
    border-radius: 0;
    box-shadow: none !important;
    transform: none !important;
    animation: none;
    overflow: visible;
}
.pkp_structure_sidebar .pkp_block .content {
    padding: 0 0 10px;
}
.pkp_structure_sidebar .pkp_block .content .content {
    padding: 0;
}

/* ---- 2. Judul blok: pita hijau penuh lebar, kilau saat kartu disorot ---- */
.pkp_structure_sidebar .pkp_block .content strong:has(> .title) {
    display: block;
}
.pkp_structure_sidebar .pkp_block .title:not(.pkp_screen_reader) {
    margin: 0 0 8px;
    padding: 11px 14px;
    background: linear-gradient(110deg, #07495b 0%, #0597b3 50%, #07495b 100%);
    background-size: 220% 100%;
    background-position: 0 0;
    border-bottom: 3px solid var(--accent-color);
    transition: background-position .7s ease, letter-spacing .3s ease;
}
.pkp_structure_sidebar .pkp_block:hover > .content .title:not(.pkp_screen_reader),
.pkp_structure_sidebar .pkp_block:hover > .title:not(.pkp_screen_reader) {
    background-position: 100% 0;
    letter-spacing: .9px;
}

/* ---- 3. Item menu: pil lembut, isi hijau muda meluncur, ikon bergoyang ---- */
.pkp_structure_sidebar .pkp_block .content ul:not(.tools_list) {
    margin: 0;
    padding: 0 8px;
    list-style: none;
}
.pkp_structure_sidebar .pkp_block p.menu_item {
    margin: 0 8px;
}
.pkp_structure_sidebar .pkp_block li:not(.tools_item) > a,
.pkp_structure_sidebar .pkp_block p.menu_item > a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 1px 0;
    padding: 8px 12px;
    border: 0;
    border-radius: 8px;
    color: var(--primary-color);
    font-size: 14px;
    line-height: 1.4;
    background: linear-gradient(135deg, #e3f5fa, #bfe6f0) no-repeat 0 0 / 0% 100%;
    transition: background-size .35s ease, transform .3s ease, color .2s ease, box-shadow .3s ease;
}
.pkp_structure_sidebar .pkp_block li:not(.tools_item) > a:hover,
.pkp_structure_sidebar .pkp_block li:not(.tools_item) > a:focus,
.pkp_structure_sidebar .pkp_block p.menu_item > a:hover,
.pkp_structure_sidebar .pkp_block p.menu_item > a:focus {
    background-size: 100% 100%;
    transform: translateX(4px);
    color: #07495b;
    box-shadow: inset 3px 0 0 var(--accent-color);
}
/* panah kecil muncul dari kiri */
.pkp_structure_sidebar .pkp_block li:not(.tools_item) > a::after,
.pkp_structure_sidebar .pkp_block p.menu_item > a::after {
    content: "\f105";
    position: absolute;                 /* melayang: tidak memakan ruang teks */
    top: 50%;
    right: 10px;
    font-family: FontAwesome;
    font-size: 16px;
    line-height: 1;
    color: var(--secondary-color);
    opacity: 0;
    transform: translate(-8px, -50%);
    transition: opacity .3s ease, transform .3s ease;
}
.pkp_structure_sidebar .pkp_block li:not(.tools_item) > a:hover::after,
.pkp_structure_sidebar .pkp_block li:not(.tools_item) > a:focus::after,
.pkp_structure_sidebar .pkp_block p.menu_item > a:hover::after,
.pkp_structure_sidebar .pkp_block p.menu_item > a:focus::after {
    opacity: 1;
    transform: translate(0, -50%);
}
/* ikon FontAwesome di depan teks */
.pkp_structure_sidebar .pkp_block li > a .fa,
.pkp_structure_sidebar .pkp_block p.menu_item > a .fa {
    flex: 0 0 20px;
    width: 20px;
    color: var(--secondary-color);
    font-size: 16px;
    font-style: normal;
    text-align: center;
    transition: transform .3s ease, color .2s ease;
}
.pkp_structure_sidebar .pkp_block li > a:hover .fa,
.pkp_structure_sidebar .pkp_block p.menu_item > a:hover .fa {
    transform: scale(1.25) rotate(-10deg);
    color: var(--primary-color);
}

/* ---- 4. Gambar (sertifikat, template, dsb.): rata tengah, melayang & zoom ---- */
.pkp_structure_sidebar .pkp_block a > img {
    display: block;
    margin: 12px auto;
    transition: transform .4s ease, filter .3s ease;
}
.pkp_structure_sidebar .pkp_block a:hover > img {
    transform: scale(1.06);
    filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .25));
}
.pkp_structure_sidebar .pkp_block .content > ul:not(.tools_list) img,
.pkp_structure_sidebar #customblock-akreditas a > img,
.pkp_structure_sidebar #customblock-article-template a > img {
    animation: lw-float 4.5s ease-in-out infinite;
}

/* gambar yang langsung berada di <li> atau <content> (tanpa <a>) */
.pkp_structure_sidebar .pkp_block .content ul:not(.tools_list) li > img,
.pkp_structure_sidebar .pkp_block .content > img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 12px auto;
}

/* ---- 5. Kotak logo (Tools, MoU, Member): ubin lembut yang melonjak ---- */
.pkp_structure_sidebar .tools_list {
    margin: 4px 10px 6px;
    gap: 10px;
}
.pkp_structure_sidebar .tools_item {
    background: #f2f9fb;
    border: 0;
    border-radius: 10px;
    transition: transform .3s ease, box-shadow .3s ease, background .3s ease;
}
.pkp_structure_sidebar .tools_item:hover {
    background: #fff;
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(7, 73, 91, .2);
}
.pkp_structure_sidebar .pkp_block .tools_item a > img {
    margin: 0;
    animation: none;
}
.pkp_structure_sidebar .tools_item:hover img {
    transform: scale(1.1);
}

/* ---- 6. Teks biasa & penghitung pengunjung ---- */
.pkp_structure_sidebar .pkp_block .content > p:not(.menu_item),
.pkp_structure_sidebar .pkp_block .content > div > p:not(.menu_item) {
    margin: 8px 12px;
    font-size: 13px;
    line-height: 1.5;
}
.pkp_structure_sidebar .pkp_block iframe,
.pkp_structure_sidebar .pkp_block center img {
    max-width: 100%;
    height: auto;
}

/* ---- 7. Kata kunci (Keywords) ---- */
.pkp_structure_sidebar .block_Keywordcloud .content text.keyword {
    transition: opacity .2s ease;
}

/* ---- 8. Tombol Make a Submission: berdenyut halus ---- */
@keyframes lw-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(242, 194, 48, .55); }
    60%      { box-shadow: 0 0 0 10px rgba(242, 194, 48, 0); }
}
.pkp_structure_sidebar .block_make_submission a {
    margin-bottom: 18px;
    animation: lw-pulse 2.8s ease-out infinite;
    transition: transform .25s ease, background .25s ease, color .25s ease;
}
.pkp_structure_sidebar .block_make_submission a:hover {
    transform: translateY(-3px);
    animation-play-state: paused;
}

/* ---- 9. Tablet: kartu tidak perlu jarak bawah ganda di dalam grid ---- */
@media (max-width: 991px) {
    .pkp_structure_sidebar > .pkp_block:not(.block_make_submission) { margin-bottom: 0; }
    .pkp_structure_sidebar .block_make_submission { grid-column: 1 / -1; }
    .pkp_structure_sidebar .block_make_submission a { margin-bottom: 0; }
}

/* ---- 10. Perangkat sentuh: tanpa efek hover yang "menempel" ---- */
@media (hover: none) {
    .pkp_structure_sidebar > .pkp_block:not(.block_make_submission):hover { transform: none; }
    .pkp_structure_sidebar .tools_item:hover { transform: none; }
}

/* =====================================================================
   21. KARTU TIM EDITORIAL (reviewer-grid / card / index-link)
   Tempel di AKHIR stylesheet jurnal. Ganti --rv-accent untuk ubah warna.
   ===================================================================== */
.editorial-team { max-width: none; }
.reviewer-grid {
    --rv-accent: var(--secondary-color, #0095b0);
    --rv-ink: var(--primary-color, #0a6f87);
    --rv-sub: #4a5068;
    --rv-line: #e6e8f0;
    container-type: inline-size;
    display: flex;
    flex-direction: column;
    gap: 22px;
    margin: 0 0 28px;
}
.reviewer-grid .card {
    position: relative;
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr) 250px;
    align-items: stretch;
    background: #fff;
    border: 1px solid transparent;
    border-radius: 22px;
    box-shadow: 0 8px 26px rgba(30, 40, 60, .09);
    overflow: hidden;
    transition: border-color .2s, box-shadow .2s;
}
.reviewer-grid .card::before {
    content: "";
    position: absolute; left: 0; top: 0; bottom: 0; width: 8px;
    background: var(--rv-accent);
    transform: scaleX(0); transform-origin: left;
    transition: transform .2s;
}
.reviewer-grid .card:hover { border-color: var(--border-color, #d0e5ec); box-shadow: 0 12px 32px rgba(30, 40, 60, .14); }
.reviewer-grid .card:hover::before { transform: scaleX(1); }

.reviewer-grid .profile-img-container { display: flex; align-items: center; justify-content: center; padding: 22px 0 22px 22px; }
.reviewer-grid .profile-img,
.reviewer-grid .profile-initials { width: 100px; height: 100px; border-radius: 50%; object-fit: cover; }
.reviewer-grid .profile-initials {
    display: flex; align-items: center; justify-content: center;
    background: var(--gradient-mint, #d9f1f7); color: var(--rv-ink);
    font-size: 30px; font-weight: 700;
}

.reviewer-grid .reviewer-body { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 8px; padding: 24px 22px 24px 18px; min-width: 0; }
.reviewer-grid .reviewer-name { margin: 0; padding: 0; font-size: 21px; line-height: 1.25; font-weight: 700; color: var(--rv-ink); text-align: start; }
.reviewer-grid .reviewer-meta-row { margin: 0; }
.reviewer-grid .reviewer-instansi { margin: 0; font-size: 16px; line-height: 1.35; font-weight: 600; color: var(--rv-sub); text-align: start; }
.reviewer-grid .reviewer-fields { display: flex; flex-wrap: wrap; gap: 8px; }
.reviewer-grid .field-tag { background: #f1f4f9; color: var(--rv-sub); font-size: 13px; font-weight: 600; padding: 4px 12px; border-radius: 999px; }
.reviewer-grid .reviewer-country {
    display: inline-flex; align-items: center; gap: 10px;
    background: var(--mint-color, #d9f1f7); color: var(--rv-ink);
    font-size: 14px; font-weight: 700; padding: 3px 16px 3px 3px; border-radius: 999px;
}
.reviewer-grid .reviewer-country img { width: 30px !important; height: 21px !important; border-radius: 6px; object-fit: cover; box-shadow: 0 0 0 1px rgba(0,0,0,.08); }

.reviewer-grid .indices-container {
    display: flex; flex-direction: column; justify-content: center; gap: 10px;
    margin: 22px 0; padding: 0 22px 0 24px;
    border-left: 1px solid var(--rv-line);
}
.reviewer-grid .index-link {
    display: flex; align-items: center; gap: 12px;
    padding: 5px 16px 5px 5px;
    background: #f8f9fc; border: 1px solid var(--rv-line); border-radius: 999px;
    color: var(--rv-sub); font-size: 15px; font-weight: 600; line-height: 1.2;
    text-decoration: none; transition: background .15s, transform .15s, border-color .15s;
}
.reviewer-grid .index-link:hover { background: #fff; border-color: var(--rv-accent); color: var(--rv-ink); transform: translateX(3px); text-decoration: none; }
.reviewer-grid .index-link:focus-visible { outline: 2px solid var(--rv-accent); outline-offset: 2px; }
.reviewer-grid .index-link.disabled { opacity: .45; pointer-events: none; }
.reviewer-grid .index-icon {
    flex: none; width: 36px; height: 36px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 15px; font-weight: 700;
}
.reviewer-grid .index-icon::before { display: block; }
.reviewer-grid .google .index-icon { background: linear-gradient(135deg, #4a7bd0, #4aa57a); }
.reviewer-grid .google .index-icon::before { content: ""; width: 18px; height: 18px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M12 3 2 8.5l10 5.5 8-4.4V15h2V8.5z'/%3E%3Ccircle cx='12' cy='17' r='3.2' fill='white'/%3E%3C/svg%3E") center / contain no-repeat; }
.reviewer-grid .orcid .index-icon { background: #a6ce39; }
.reviewer-grid .orcid .index-icon::before { content: "iD"; font-size: 14px; }
.reviewer-grid .scopus .index-icon { background: #2f5fa3; }
.reviewer-grid .scopus .index-icon::before { content: "SC"; }
.reviewer-grid .wos .index-icon { background: #5b3be0; }
.reviewer-grid .wos .index-icon::before { content: "W"; }
.reviewer-grid .sinta .index-icon { background: #ee8a2b; }
.reviewer-grid .sinta .index-icon::before { content: "S"; }
.reviewer-grid .email .index-icon { background: #c0392b; }
.reviewer-grid .email .index-icon::before { content: ""; width: 18px; height: 18px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M3 6h18v12H3z'/%3E%3Cpath fill='none' stroke='%23c0392b' stroke-width='1.6' d='m3.5 7 8.5 6.5L20.5 7'/%3E%3C/svg%3E") center / contain no-repeat; }

/* Menyesuaikan lebar kolom konten (bukan lebar layar) */
@container (max-width: 680px) {
    .reviewer-grid .card { grid-template-columns: 88px minmax(0, 1fr); }
    .reviewer-grid .profile-img-container { padding: 18px 0 0 16px; align-items: flex-start; }
    .reviewer-grid .profile-img, .reviewer-grid .profile-initials { width: 64px; height: 64px; font-size: 22px; }
    .reviewer-grid .reviewer-body { padding: 18px 16px 12px 14px; }
    .reviewer-grid .reviewer-name { font-size: 18px; }
    .reviewer-grid .reviewer-instansi { font-size: 14px; }
    .reviewer-grid .indices-container { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; border-left: 0; border-top: 1px solid var(--rv-line); margin: 0 16px; padding: 14px 0 16px; }
    .reviewer-grid .index-link { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .reviewer-grid .card, .reviewer-grid .card::before, .reviewer-grid .index-link { transition: none; }
}

/* =====================================================================
   28. FOOTER JSTFI: baris logo indexing (ubin putih) + info kontak
   HTML: JSTFI-footer.html (tempel di Settings > Website > Appearance >
   Setup > Footer). Memakai kelas .lw-footer dari bagian 26.
   ===================================================================== */
.lw-footer__indexing {
    max-width: 1100px;
    margin: 0 auto 26px;
    padding-bottom: 22px;
    border-bottom: 1px solid rgba(255, 255, 255, .25);
    text-align: center;
}
.lw-footer .lw-indexing-grid {
    justify-content: center;
    gap: 12px;
}
/* ubin putih agar semua logo (termasuk yang berwarna gelap) tetap jelas
   di atas latar cyan; mengalahkan garis-bawah animasi milik ".lw-footer a" */
.lw-footer .lw-indexing-grid a {
    flex: 0 0 100px;
    width: 100px;
    height: 100px;
    padding: 8px;
    background: #fff;
    border: 0;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
    text-decoration: none;
}
.lw-footer .lw-indexing-grid a:hover,
.lw-footer .lw-indexing-grid a:focus {
    background: #fff;
    box-shadow: 0 8px 16px rgba(0, 0, 0, .3);
}
.lw-footer__contact p { margin: 0 0 6px; }
.lw-footer__license img { display: inline-block; margin-bottom: 6px; }
@media (max-width: 599px) {
    .lw-footer .lw-indexing-grid a {
        flex-basis: 84px;
        width: 84px;
        height: 84px;
    }
}