.elementor-kit-1041{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-1041 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Mobile fix: baris tombol tidak boleh wrap ke kolom kedua (overflow horizontal) */
@media (max-width: 767px) {
  .pkf-btnrow .elementor-widget-wrap { flex-wrap: nowrap !important; }
  .pkf-btnrow .elementor-widget-button,
  .pkf-hero--bg .elementor-widget-button { flex: 0 0 auto !important; }
}

/* Tabel merk 2 kolom: tidak perlu min-width 640px, muat penuh di mobile (specificity lebih tinggi karena Additional CSS dimuat belakangan) */
html body .pkf-table-scroll .pkf-brands__table { min-width: 0; }

/* Menu hamburger tablet/mobile: panel harus selebar layar dan menempel tepat di bawah header.
   Aturan lama memakai left: calc(50% - 50vw) relatif ke kolom menu, hanya benar jika kolom itu tepat di tengah layar.
   Kolom menu ada di sisi kanan, jadi panel bergeser dan meluber. Solusi: kolom dan widget dibuat static
   supaya acuan posisi panel adalah section header itu sendiri (position: sticky). */
@media (max-width: 1024px) {
  html body .pkf-header--tb.pkf-drawer-open .elementor-container,
  html body .pkf-header--tb.pkf-drawer-open .elementor-column,
  html body .pkf-header--tb.pkf-drawer-open .elementor-widget-wrap,
  html body .pkf-header--tb.pkf-drawer-open .elementor-widget-nav-menu,
  html body .pkf-header--tb.pkf-drawer-open .elementor-widget-nav-menu > .elementor-widget-container {
    position: static !important;
  }
  html body .pkf-header--tb.pkf-drawer-open nav.elementor-nav-menu--main {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
    padding: 8px 24px 16px !important;
  }

  /* Sub-menu Layanan: akordeon (turun ke bawah, menjorok), bukan kolom di kanan */
  html body .pkf-header--tb.pkf-drawer-open nav.elementor-nav-menu--main .elementor-nav-menu > li.menu-item-has-children {
    flex-wrap: wrap !important;
  }
  html body .pkf-header--tb.pkf-drawer-open nav.elementor-nav-menu--main .elementor-nav-menu > li.menu-item-has-children > a {
    flex: 1 1 auto !important;
  }
  html body .pkf-header--tb.pkf-drawer-open nav.elementor-nav-menu--main .elementor-nav-menu > li.menu-item-has-children > ul.sub-menu {
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    padding-left: 16px !important;
    margin: 0 0 8px !important;
  }
}

/* Hero: jarak antara baris tombol dan baris badge di bawahnya */
html body .pkf-hero--bg .pkf-badges { margin-top: 24px; }

/* Mobile: tombol bertumpuk hanya berjarak gap 16px (sebelumnya 32px karena margin-bottom ikut menambah) */
@media (max-width: 767px) {
  html body .pkf-btnrow .elementor-widget-button { margin: 0 !important; }
}

/* Kartu artikel (bukan --flush): gambar pas selebar kartu, sudut atas ikut melengkung.
   Additional CSS memberi margin negatif (!important) untuk kartu ber-padding, padahal wrap kartu ini padding 0 sehingga gambar meluber.
   Kelas diulang supaya specificity mengalahkan aturan tersebut. */
html body .pkf-section .pkf-card.pkf-card:not(.pkf-card--flush):not(.pkf-testi) > .elementor-widget-wrap > .elementor-widget-image.elementor-widget-image {
  margin: 0 0 var(--pkf-s2) !important;
  border-radius: 12px 12px 0 0;
  overflow: hidden;
}

/* Halaman artikel: hero hanya berisi judul, tingginya cukup setengah layar (bukan 100vh seperti hero Beranda) */
html body.single-post .pkf-hero--bg {
  min-height: 50vh;
}

/* Artikel panjang: daftar isi, kotak jawaban singkat, tabel, foto, dan video di dalam kolom isi.
   Selector diberi html body supaya mengalahkan Additional CSS yang dimuat belakangan. */
html body .pkf-article-col h2 { scroll-margin-top: 110px; margin-block: var(--pkf-s5) var(--pkf-s2); }
html body .pkf-article-col h3 { margin: var(--pkf-s3) 0 var(--pkf-s1); }
html body .pkf-article-col ol { padding-left: var(--pkf-s3); margin-bottom: var(--pkf-s2); }
html body .pkf-article-col li { margin-bottom: 6px; }

html body .pkf-article-col .pkf-toc {
  background: var(--pkf-bg-alt);
  border: 1px solid var(--pkf-line);
  border-radius: var(--pkf-radius-card);
  padding: var(--pkf-s3);
  margin: var(--pkf-s3) 0;
}
html body .pkf-article-col .pkf-toc__title { font-family: var(--pkf-font-head); font-weight: 600; margin-bottom: var(--pkf-s1); }
html body .pkf-article-col .pkf-toc ol { margin: 0; padding-left: 20px; }
html body .pkf-article-col .pkf-toc a { color: var(--pkf-ink); text-decoration: underline; text-underline-offset: 3px; }

html body .pkf-article-col .pkf-callout {
  background: var(--pkf-bg-alt);
  border-left: 4px solid var(--pkf-red);
  border-radius: 0 var(--pkf-radius-card) var(--pkf-radius-card) 0;
  padding: var(--pkf-s2) var(--pkf-s3);
  margin: var(--pkf-s3) 0;
}
html body .pkf-article-col .pkf-callout p { margin-bottom: 0; }

html body .pkf-article-col .pkf-tablewrap { overflow-x: auto; margin: var(--pkf-s3) 0; -webkit-overflow-scrolling: touch; }
html body .pkf-article-col .pkf-tablewrap table { width: 100%; border-collapse: collapse; font-size: var(--pkf-small); line-height: 1.5; }
html body .pkf-article-col .pkf-tablewrap th,
html body .pkf-article-col .pkf-tablewrap td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--pkf-line); }
html body .pkf-article-col .pkf-tablewrap th { background: var(--pkf-bg-alt); color: var(--pkf-ink); font-family: var(--pkf-font-head); font-weight: 600; }

html body .pkf-article-col figure.pkf-figure { margin: var(--pkf-s4) 0; }
html body .pkf-article-col figure.pkf-figure img,
html body .pkf-article-col figure.pkf-figure video { display: block; width: 100%; height: auto; border-radius: var(--pkf-radius-card); }
html body .pkf-article-col figure.pkf-figure--portrait { max-width: 380px; margin-left: auto; margin-right: auto; }
html body .pkf-article-col figure.pkf-figure figcaption { margin-top: var(--pkf-s1); font-size: var(--pkf-small); line-height: 1.5; color: var(--pkf-muted); }

html body .pkf-article-col .pkf-sources { font-size: var(--pkf-small); color: var(--pkf-muted); }/* End custom CSS */