#yjg-foundation{
    position: relative;
    width: 100%;
    max-width: 100vw;
    font-family: 'Inter', sans-serif;
    background: var(--color-bg-light,);
    color: var(--color-text,);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* =========================
   HIDE SCROLLBAR & PREVENT OVERSCROLL
========================= */

/* Chrome, Edge, Safari */
html::-webkit-scrollbar,
body::-webkit-scrollbar {
  display: none;
}

/* KUNCI UTAMA: Kunci sumbu X di tingkat root agar halaman tidak goyang */
html, body {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE & Edge lama */
  margin: 0;
  padding: 0;
  width: 100%;
  overflow-x: hidden; /* <--- Tambahan Wajib */
}

body {
  margin: 0;
  font-family: 'Inter', sans-serif;
  background: var(--color-bg-light);
  color: var(--color-text-primary);
}


/* =========================
   FLOATRING SCROLLBAR (OVERLAY)
========================= */

html {
  /* Membuat scrollbar melayang (overlay) di browser berbasis Chromium */
  overflow-y: overlay; 
  /* Untuk Firefox */
  scrollbar-width: thin; 
  scrollbar-color: var(--color-primary) transparent;
  scroll-behavior: smooth;
  background: transparent; /* Pastikan latar belakang transparan agar tidak memotong width layar */  

}

/* Styling khusus Chrome, Edge, Safari */
::-webkit-scrollbar {
  width: 6px; /* Ukuran scrollbar dibuat tipis */
  background-color: transparent; /* Latar transparan agar tidak memotong width layar */
}

::-webkit-scrollbar-track {
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  background-color: var(--color-primary); /* Warna Navy Yayasan dengan transparansi */
  border-radius: 10px; /* Ujung scrollbar membulat */
}

::-webkit-scrollbar-thumb:hover {
  background-color: var(--color-primary);
}

/* =========================
   CONTAINER
========================= */
#yjg-foundation .container {
  max-width: 1600px; /* Diperbesar dari 1200px agar konten lebih merapat ke tepi */
  margin: 0 auto;
  padding: 0 6%; /* Menggunakan persentase agar dinamis di berbagai layar */
  width: 100%;
}

#yjg-foundation a {
  text-decoration: none;
}

  /* ===================================================
     RESET TOTAL UNTUK LANDING PAGE FULL-WIDTH
     =================================================== */
  body.yjg-fullwidth #post-wrap,
  body.yjg-fullwidth #wrapper,
  body.yjg-fullwidth #content-wrapper,
  body.yjg-fullwidth .content-wrapper,
  body.yjg-fullwidth .outer-wrapper,
  body.yjg-fullwidth #main-wrapper,
  body.yjg-fullwidth .main .widget,
  body.yjg-fullwidth .main-wrapper {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }

  body.yjg-fullwidth .post,
  body.yjg-fullwidth .post-body,
  body.yjg-fullwidth .entry-content,
  body.yjg-fullwidth .main-inner,
  body.yjg-fullwidth #main,
  body.yjg-fullwidth .article {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  body.yjg-fullwidth #footer-wrapper,
  body.yjg-fullwidth .footer-wrapper,
  body.yjg-fullwidth footer,
  body.yjg-fullwidth #footer {
    margin-top: 0 !important;
  }

  body.yjg-fullwidth #comments,
  body.yjg-fullwidth .comments,
  body.yjg-fullwidth .post-footer,
  body.yjg-fullwidth .post-share-buttons,
  body.yjg-fullwidth #blog-pager,
  body.yjg-fullwidth .breadcrumbs {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    visibility: hidden;
  }