/* =======================================================
   1. PENGATURAN HEADER & LOGO (SYNTAX NAVY-TEAL THEME)
   ======================================================= */


.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 { display: inline-block; margin: 0; padding: 0; }
.pkp_site_name .is_img img { max-height: 300px !important; margin: 0; }
.pkp_head_wrapper, .has_site_logo .pkp_head_wrapper { position: relative; padding-top: 10px; background: transparent; }
.pkp_site_name_wrapper { padding-left: 0; padding-right: 0; }


/* =======================================================
   2. TOP NAV BAR & STICKY MENU ATAS
   ======================================================= */
.pkp_navigation_user_wrapper {
    background-color: #009F8C; /* Teal Syntax */
    top: 0; right: 0; padding: 5px 15px; 
}
.pkp_navigation_user > li > a { color: #ffffff !important; font-weight: 600; font-size: 0.85rem; }
.pkp_navigation_user > li > a:hover { color: #F4B324 !important; } /* Highlight Kuning */

.pkp_navigation_primary_wrapper {
    position: sticky !important;
    top: 0;
    z-index: 9999;
    background: rgba(255, 255, 255, 0.98); 
    backdrop-filter: blur(10px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    border-bottom: 2px solid #009F8C;
}
.pkp_navigation_primary_row { padding-left: 2.143rem; padding-right: 2.143rem; }
#navigationPrimary > li > a {
    padding-bottom: 8px; padding-top: 8px; border-bottom: 3px solid transparent; transition: all 0.3s ease !important; font-weight: 600; color: #475569; 
}
@media (min-width: 992px) { #navigationPrimary a { color: #0D223B; } }
#navigationPrimary > li > a:hover {
    color: #009F8C !important; border-bottom-color: #009F8C; background-color: transparent;
}

/* =======================================================
   3. PENCARIAN
   ======================================================= */
.pkp_navigation_search_wrapper a { padding-bottom: 6px; border-bottom: 3px solid transparent; color: #ffffff; transition: all 0.3s ease; }
.pkp_navigation_search_wrapper a:hover { color: #F4B324; border-bottom-color: #F4B324; }

/* =======================================================
   4. TAMPILAN HALAMAN & ARTIKEL
   ======================================================= */
body { font-family: 'Montserrat', sans-serif; background-color: #f8fafc; } 
a { color: #009F8C; transition: color 0.2s ease; }
a:hover { color: #0D223B; text-decoration: none; }
.pkp_structure_page { margin-top: 0px !important; margin-bottom: 0 !important; padding-bottom: 0 !important; }
.pkp_block { padding: 20px; }
.pkp_page_index .current_issue h2 { display: inline-block; padding-bottom: 0.5em; border-bottom: 3px solid #009F8C; text-transform: uppercase; font-weight: 800; color: #0D223B; letter-spacing: 0.5px; }

.cmp_article_list > li {
    margin-bottom: 1.8rem; background-color: #ffffff; padding: 22px 25px; border-radius: 10px; border: 1px solid #e2e8f0; border-left: 5px solid transparent; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.03); transition: all 0.3s ease;
}
.cmp_article_list > li:hover {
    transform: translateY(-4px); border-left: 5px solid #009F8C; box-shadow: 0 10px 20px rgba(0, 159, 140, 0.1);
}

/* =======================================================
   5. QUICK MENU SIDEBAR 
   ======================================================= */


/* Container Utama Sidebar */
.custom-quick-menu {
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
  box-sizing: border-box;
}

/* Judul Quick Menu */
.quick-menu-title {
  font-weight: 700;
  font-size: 15px;
  color: #102463; /* Warna Biru Utama Syntax */
  padding: 4px 6px 12px 6px;
  margin-bottom: 12px;
  border-bottom: 2px solid #e2e8f0;
}

/* Layout List Menu */
.quick-menu-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Tombol Menu (Dasar Biru) */
.quick-menu-item {
  display: block;
  background-color: #041e43; /* Biru syntax */
  color: #ffffff !important;
  font-weight: 600;
  font-size: 13.5px;
  padding: 11px 16px;
  border-radius: 8px;
  text-decoration: none !important;
  box-sizing: border-box;
  /* Transisi Halus untuk Efek Hover */
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Efek Mouse Over / Active State */
.quick-menu-item:hover,
.quick-menu-item.active {
  background-color: #075e62; /* Berubah menjadi hijau Dark */
  color: #ffffff !important;
  transform: translateX(6px); /* Bergeser 6px ke kanan */
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.25); /* Efek bayangan mengambang */
}


/* =======================================================
   6. CUSTOM FOOTER FULL WIDTH
   ======================================================= */   
.pkp_structure_footer { padding: 0 !important; margin: 0 !important; width: 100% !important; max-width: 100% !important; }
.syntax-footer-wrapper {
    width: 100vw; margin-left: calc(50% - 50vw); background: linear-gradient(135deg, #0D223B 0%, #091728 100%); color: #e2e8f0; font-family: 'Montserrat', sans-serif; padding: 60px 0 0 0; border-top: 5px solid #009F8C; overflow: hidden;
}
.syntax-footer-container { display: flex; flex-wrap: wrap; gap: 50px; justify-content: space-between; max-width: 1200px; margin: 0 auto; padding: 0 40px; }
.syntax-footer-col { flex: 1; min-width: 250px; }
.syntax-footer-col h4 {
    color: #ffffff; font-size: 1.15rem; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; margin-top: 0; margin-bottom: 25px; position: relative; padding-bottom: 12px;
}
.syntax-footer-col h4::after { content: ''; position: absolute; bottom: 0; left: 0; width: 40px; height: 3px; background-color: #009F8C; border-radius: 2px; }
.syntax-footer-links { list-style: none; padding: 0; margin: 0; }
.syntax-footer-links li { margin-bottom: 15px; }
.syntax-footer-links a { color: #cbd5e1; text-decoration: none; font-size: 0.95rem; transition: all 0.3s ease; display: inline-flex; align-items: center; }
.syntax-footer-links a::before { content: '❯'; margin-right: 12px; font-size: 0.75rem; color: #009F8C; transition: transform 0.3s ease; }
.syntax-footer-links a:hover { color: #F4B324; transform: translateX(6px); }

/* =======================================================
   7. HALAMAN DETAIL ARTIKEL (ABSTRAK, PENULIS, PDF)
   ======================================================= */
.obj_article_details .authors {
    background: #ffffff; padding: 20px 25px; border-radius: 8px; border-left: 5px solid #009F8C; margin-bottom: 30px; box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.obj_article_details .authors .name { font-weight: 800; color: #0D223B; font-size: 1.2rem; margin-bottom: 5px; }
.obj_article_details .item.galleys .obj_galley_link {
    background-color: #009F8C !important; color: #ffffff !important; border: none !important; border-radius: 6px !important; padding: 12px 25px !important; font-weight: 700 !important; text-transform: uppercase; box-shadow: 0 4px 10px rgba(0, 159, 140, 0.3) !important; transition: all 0.3s ease !important;
}
.obj_article_details .item.galleys .obj_galley_link:hover {
    background-color: #0D223B !important; box-shadow: 0 6px 15px rgba(13, 34, 59, 0.4) !important; transform: translateY(-2px);
}

/* =======================================================
   8. INPUT FORM & KOTAK PENCARIAN
   ======================================================= */
input[type="text"]:focus, input[type="search"]:focus, textarea:focus {
    border-color: #009F8C !important; box-shadow: 0 0 0 3px rgba(0, 159, 140, 0.15) !important; outline: none !important;
}

/* =======================================================
   9. DESAIN SIDEBAR MODERN SYNTAX
   ======================================================= */
.syntax-sb-block {
    background: #ffffff; border-radius: 12px; border: 1px solid #e2e8f0; padding: 22px; margin-bottom: 25px; box-shadow: 0 4px 15px rgba(13, 34, 59, 0.04); transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.syntax-sb-title {
    font-size: 0.95rem; font-weight: 700; color: #0D223B; text-transform: uppercase; margin-bottom: 18px; padding-bottom: 10px; border-bottom: 2px solid #f1f5f9; position: relative;
}
.syntax-sb-title::after { content: ''; position: absolute; bottom: -2px; left: 0; width: 45px; height: 2px; background: #009F8C; }
.syntax-btn-template {
    display: block; background: linear-gradient(135deg, #009F8C 0%, #0D223B 100%); color: #ffffff !important; text-align: center; padding: 14px 10px; border-radius: 8px; font-weight: 700; text-decoration: none !important; transition: all 0.3s ease; margin-bottom: 8px;
}

//tambahan sidebar
/* Container Tiap Blok Sidebar */
.syntax-sb-block {
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 16px;
  margin-top: 16px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
  box-sizing: border-box;
}

/* Judul Blok Sidebar */
.syntax-sb-title {
  font-weight: 700;
  font-size: 15px;
  color: #1e40af; /* Biru Syntax */
  margin: 0 0 12px 0;
  padding-bottom: 8px;
  border-bottom: 2px solid #e2e8f0;
}

/* Base Image Wrapper & Gambar Template/Logo */
.syntax-img-btn {
  display: block;
  margin-bottom: 10px;
  border-radius: 10px;
  overflow: hidden;
  text-decoration: none;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.syntax-img-btn:last-child {
  margin-bottom: 0;
}

.syntax-img-btn img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
  transition: transform 0.3s ease, filter 0.3s ease;
}

/* Efek Hover Logo & Template (Mengambang & Glow Soft) */
.syntax-img-btn:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 18px rgba(30, 64, 175, 0.18);
}

.syntax-img-btn:hover img {
  filter: brightness(1.05);
}

/* Block Chat Card */
.syntax-chat-card {
  text-align: center;
  padding: 4px 0;
}

.syntax-chat-text {
  font-size: 13px;
  color: #475569;
  line-height: 1.5;
  margin: 0 0 12px 0;
}

/* Tombol WhatsApp */
.syntax-btn-wa {
  display: inline-block;
  width: 100%;
  background-color: #25d366;
  color: #ffffff !important;
  font-weight: 700;
  font-size: 13.5px;
  padding: 10px 14px;
  border-radius: 8px;
  text-decoration: none !important;
  box-sizing: border-box;
  transition: all 0.25s ease;
}

/* Efek Hover Tombol WA */
.syntax-btn-wa:hover {
  background-color: #1eb954;
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(37, 211, 102, 0.3);
}

/* Block Visitor Statistics */
.syntax-stat-box {
  text-align: center;
  padding: 6px 0;
  transition: transform 0.3s ease;
}

.syntax-stat-box img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  transition: opacity 0.2s ease;
}

.syntax-stat-box:hover {
  transform: scale(1.02);
}


/* =======================================================
   10. HALAMAN ABOUT THE JOURNAL
   ======================================================= */
.syntax-about-wrapper { font-family: 'Montserrat', sans-serif; color: #334155; }
.syntax-focus-section h3 {
    color: #0D223B; font-size: 1.4rem; font-weight: 800; border-bottom: 3px solid #009F8C; padding-bottom: 10px; margin-bottom: 20px; display: inline-block;
}
.focus-card {
    background-color: #ffffff; border: 1px solid #e2e8f0; border-left: 5px solid #009F8C; padding: 20px; border-radius: 8px; transition: all 0.3s ease;
}
.focus-card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0, 159, 140, 0.1); border-left-color: #0D223B; }

/* =======================================================
   11. ADDITIONAL CONTENT (CALL FOR PAPER)
   ======================================================= */
.syntax-cfp-image::before {
    content: ''; position: absolute; top: 15px; left: -15px; width: 100%; height: 100%; border: 4px solid #009F8C; border-radius: 8px; z-index: -1; transition: all 0.3s ease;
}
.syntax-cfp-image:hover::before { top: 20px; left: -20px; border-color: #F4B324; }

/* =======================================================
   12. HALAMAN STATIS: FOCUS AND SCOPE
   ======================================================= */
.fs-intro-box { background-color: #f8fafc; border-left: 5px solid #009F8C; padding: 20px 25px; border-radius: 4px; margin-bottom: 35px; }
.fs-item:hover {
    background-color: #009F8C; color: #ffffff; transform: translateY(-3px); box-shadow: 0 8px 15px rgba(0, 159, 140, 0.3); border-color: #009F8C;
}

/* =======================================================
   13. PROFIL EDITORIAL TEAM & REVIEWERS
   ======================================================= */
.team-card { border-top: 4px solid #009F8C; transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; }
.team-card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0, 159, 140, 0.15); border-color: #009F8C; }
.team-name { color: #0D223B; }
.team-role { color: #009F8C; }

/* =======================================================
   14. PUBLICATION ETHICS
   ======================================================= */
.ethics-number {
    background: #009F8C; color: #ffffff; font-size: 1.25rem; font-weight: 800; min-width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; border-radius: 50%; margin-right: 20px; box-shadow: 0 4px 10px rgba(0, 159, 140, 0.3);
}

/* =======================================================
   15. AUTHOR GUIDELINES
   ======================================================= */
.ag-bordered-box-title { color: #0D223B; border-bottom: 1px solid #cbd5e1; }

/* =======================================================
   16. PEER REVIEW PROCESS 
   ======================================================= */
.pr-card { border-left: 4px solid #009F8C; }
.pr-number { background: #0D223B; color: #ffffff; }

/* =======================================================
   17. OPEN ACCESS POLICY
   ======================================================= */
.oap-intro { border-left: 4px solid #009F8C; }
.oap-heading { color: #0D223B; border-bottom: 2px solid #cbd5e1; }

/* =======================================================
   18. PLAGIARISM CHECK 
   ======================================================= */
.pc-intro-box { border-left: 5px solid #009F8C; }
.pc-highlight-box { background: linear-gradient(135deg, #0D223B, #009F8C); }

/* =======================================================
   19. COPYRIGHT NOTICE
   ======================================================= */
.cn-intro-box { border-left: 4px solid #009F8C; }
.cn-heading { color: #0D223B; }

/* =======================================================
   20. ARTICLE PUBLICATION CHARGE (APC)
   ======================================================= */
.apc-intro-box { border-left: 4px solid #009F8C; }
.apc-banner { background: linear-gradient(135deg, #0D223B, #009F8C); }

/* =======================================================
   21. INDEXING PAGE
   ======================================================= */
.idx-intro-box { border-left: 4px solid #009F8C; }
.idx-btn { background-color: #0D223B; }
.idx-btn:hover { background-color: #009F8C; }

/* =======================================================
   22. CONTACT PAGE
   ======================================================= */
.ct-intro-box { border-left: 4px solid #009F8C; }
.ct-heading { color: #0D223B; }

/* ===================================================
   SYNTAX JOURNAL CUSTOM STYLES
   =================================================== */

/* 1. TOMBOL SUBMIT & LOGIN (ABOUT THE JOURNAL) */
.syntax-btn-template {
  display: block;
  width: 100%;
  padding: 12px 20px;
  margin-bottom: 12px;
  color: #ffffff !important;
  text-align: center;
  text-decoration: none !important;
  font-weight: 700;
  font-size: 0.95rem;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  box-sizing: border-box;
}

.syntax-btn-template.btn-submit {
  background: linear-gradient(135deg, #009f8c 0%, #0d223b 100%);
}

.syntax-btn-template.btn-login {
  background: linear-gradient(135deg, #008172 0%, #08182b 100%);
}

/* Efek Mouse Over Tombol Submit & Login */
.syntax-btn-template:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 8px 20px rgba(0, 159, 140, 0.35);
  filter: brightness(1.1);
}

/* 2. FOCUS & SCOPE CARDS */
.syntax-focus-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.syntax-focus-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-top: 4px solid #009f8c;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
  transition: all 0.3s ease;
}

.syntax-focus-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.syntax-focus-card h4 {
  color: #0d223b;
  margin-top: 0;
  margin-bottom: 8px;
  font-weight: 700;
}

/* 3. CALL FOR PAPER & KARTU STATUS (META LIST) */
.syntax-divider {
  background-color: #0d223b;
  color: #ffffff;
  padding: 12px 20px;
  text-align: center;
  font-weight: 700;
  border-radius: 6px;
  margin: 40px 0 30px 0;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-left: 5px solid #009f8c;
}

.syntax-cfp-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  align-items: flex-start;
  margin-bottom: 50px;
}

.syntax-cfp-image-container {
  flex: 1;
  min-width: 300px;
  position: relative;
  padding: 0 15px 15px 0;
}

.syntax-cfp-image-container .offset-border {
  position: absolute;
  top: 15px;
  left: 15px;
  right: 0;
  bottom: 0;
  border: 3px solid #009f8c;
  border-radius: 8px;
  z-index: 0;
}

.syntax-cfp-image-container img {
  width: 100%;
  border-radius: 8px;
  position: relative;
  z-index: 1;
  box-shadow: 0 4px 15px rgba(13, 34, 59, 0.15);
  display: block;
}

.syntax-cfp-info {
  flex: 1.5;
  min-width: 300px;
  padding-top: 10px;
}

.syntax-meta-list {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* Efek Mouse Over Kotak Status / Meta Cards */
.syntax-meta-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-left: 6px solid #009f8c;
  padding: 15px 25px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.syntax-meta-item:hover {
  transform: translateX(8px);
  box-shadow: 0 6px 18px rgba(0, 159, 140, 0.18);
  border-left-color: #0d223b;
}

.syntax-meta-item .meta-title {
  font-weight: 700;
  color: #0d223b;
  font-size: 1.05rem;
}

.syntax-meta-item .meta-badge {
  background-color: #009f8c;
  color: #ffffff;
  padding: 6px 18px;
  border-radius: 30px;
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 0.5px;
  transition: background-color 0.3s ease;
}

.syntax-meta-item:hover .meta-badge {
  background-color: #0d223b;
}

/* 4. LOGO INDEXING */
.syntax-indexing-box {
  text-align: center;
  margin-top: 20px;
  padding: 40px 20px;
  background-color: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(13, 34, 59, 0.05);
  border: 1px solid #e2e8f0;
}

.syntax-indexing-box h3 {
  color: #0d223b;
  font-weight: 800;
  border-bottom: 3px solid #009f8c;
  display: inline-block;
  padding-bottom: 10px;
  margin-top: 0;
  margin-bottom: 35px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.syntax-indexing-logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 35px;
  align-items: center;
}

/* Efek Mouse Over Logo Indexing */
.syntax-logo-hover {
  height: 45px;
  width: auto;
  max-width: 150px;
  object-fit: contain;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), filter 0.3s ease;
  cursor: pointer;
}

.syntax-logo-hover:hover {
  transform: translateY(-6px) scale(1.08);
  filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.12));
}

/*TAMBAHAN FOOTER */
/* Container Utama Footer (Penguncian Warna Gelap) */
.syntax-main-footer {
  background-color: #0f172a !important;
  background: #0f172a !important;
  color: #cbd5e1 !important;
  font-family: inherit;
  margin-top: 40px;
  position: relative;
  box-sizing: border-box;
  border-radius: 8px;
  overflow: hidden;
}

/* Sembunyikan Logo Bawaan OJS/PKP di Bagian Paling Bawah */
.pkp_brand_footer, 
a.pkp_brand_footer,
.pkp_footer_content .pkp_brand_footer {
  display: none !important;
}

/* Garis Akses Atas */
.syntax-footer-accent {
  height: 4px;
  width: 100%;
  background: linear-gradient(90deg, #1e40af 0%, #38bdf8 50%, #1e40af 100%);
}

/* Grid Layout 4 Kolom */
.syntax-footer-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 24px 32px 24px;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: 28px;
  box-sizing: border-box;
}

/* Judul Kolom */
.syntax-footer-title {
  color: #ffffff !important;
  font-size: 15px;
  font-weight: 700;
  margin: 0 0 16px 0;
  position: relative;
  padding-bottom: 8px;
  letter-spacing: 0.5px;
}

.syntax-footer-title::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 28px;
  height: 2px;
  background-color: #38bdf8;
}

/* Kolom Brand */
.syntax-logo-text {
  font-size: 22px;
  font-weight: 800;
  color: #ffffff !important;
  letter-spacing: 1px;
  display: inline-block;
}

.syntax-journal-tag {
  background-color: #1e40af;
  color: #ffffff !important;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  margin-left: 8px;
  vertical-align: middle;
}

.syntax-footer-about {
  font-size: 13px;
  line-height: 1.6;
  margin: 14px 0 18px 0;
  color: #cbd5e1 !important;
}

.syntax-issn-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.syntax-issn-badge {
  background-color: #1e293b;
  border: 1px solid #334155;
  color: #94a3b8 !important;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
}

/* Link Navigasi */
.syntax-footer-links {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.syntax-footer-links li {
  margin-bottom: 10px;
}

.syntax-footer-links a {
  color: #cbd5e1 !important;
  text-decoration: none !important;
  font-size: 13.5px;
  transition: all 0.25s ease;
  display: inline-block;
}

.syntax-footer-links a:hover {
  color: #38bdf8 !important;
  transform: translateX(6px);
}

/* Informasi Penerbit & Kontak */
.syntax-publisher {
  color: #ffffff !important;
  font-size: 14px;
  margin: 0 0 4px 0;
}

.syntax-address {
  font-size: 13px;
  line-height: 1.5;
  margin-bottom: 16px;
  color: #cbd5e1 !important;
}

.syntax-contact-info {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.syntax-contact-item {
  color: #cbd5e1 !important;
  text-decoration: none !important;
  font-size: 13px;
  transition: color 0.2s ease;
}

.syntax-contact-item:hover {
  color: #38bdf8 !important;
}

.syntax-wa-link {
  color: #4ade80 !important;
  font-weight: 600;
}

.syntax-wa-link:hover {
  color: #22c55e !important;
}

/* Bottom Bar Copyright */
.syntax-footer-bottom {
  border-top: 1px solid #1e293b;
  background-color: #090d16 !important;
  padding: 16px 24px;
}

.syntax-footer-bottom-container {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
  font-size: 12.5px;
  color: #64748b !important;
}

.syntax-copyright strong {
  color: #cbd5e1 !important;
}

/* Responsive */
@media (max-width: 900px) {
  .syntax-footer-container {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }
}

@media (max-width: 550px) {
  .syntax-footer-container {
    grid-template-columns: 1fr;
  }
}