/* Multi-color theme + per-page distinct layouts (11 unique templates) */

:root {
  --c-cyan: #06b6d4;
  --c-cyan-d: #0891b2;
  --c-violet: #8b5cf6;
  --c-amber: #f59e0b;
  --c-rose: #f43f5e;
  --c-emerald: #10b981;
  --c-ink: #0f172a;
  --c-muted: #475569;
  --c-surface: #ffffff;
  --c-bg: #f8fafc;
  --header-h: 3.75rem;
  --header-h-mobile: 3.75rem;
  --shell: 1280px;
  --card-r: 1rem;
}

body {
  background:
    radial-gradient(ellipse 100% 60% at 0% 0%, rgb(6 182 212 / 0.07), transparent 50%),
    radial-gradient(ellipse 80% 50% at 100% 0%, rgb(139 92 246 / 0.06), transparent 45%),
    radial-gradient(ellipse 70% 40% at 50% 100%, rgb(16 185 129 / 0.05), transparent 40%),
    var(--c-bg) !important;
  color: var(--c-ink);
}

/* —— Header (strong visual change) —— */
header.gallery_basic_816e,
header#siteHeader {
  background: linear-gradient(120deg, #0c1222 0%, #1e1b4b 42%, #134e4a 100%) !important;
  border-bottom: none !important;
  box-shadow: 0 4px 24px rgb(15 23 42 / 0.35) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

header.gallery_basic_816e::after,
header#siteHeader::after {
  content: "";
  display: block;
  height: 3px;
  background: linear-gradient(
    90deg,
    var(--c-cyan),
    var(--c-violet),
    var(--c-amber),
    var(--c-emerald)
  );
}

header .pro_5598 {
  max-width: var(--shell) !important;
  padding: 0.65rem 1.25rem !important;
  gap: 1rem !important;
}

header .wrapper-16cf {
  color: #f8fafc !important;
  font-size: 1.125rem !important;
}

header .wrapper-16cf:hover {
  color: #a5f3fc !important;
}

header .wrapper-16cf img {
  width: 36px !important;
  height: 36px !important;
  box-shadow: 0 0 0 2px rgb(255 255 255 / 0.25);
}

header .icon_22df {
  gap: 0.35rem 0.5rem !important;
  flex-wrap: wrap;
  justify-content: center;
}

header .icon_22df li a {
  color: #cbd5e1 !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  padding: 0.35rem 0.65rem !important;
  border-radius: 999px;
  transition: background 0.2s, color 0.2s;
}

header .icon_22df li a:hover {
  color: #fff !important;
  background: rgb(255 255 255 / 0.1);
}

header .icon_22df li a.fn-active-38ec {
  color: #fff !important;
  background: linear-gradient(135deg, var(--c-cyan-d), var(--c-violet)) !important;
  box-shadow: 0 2px 10px rgb(6 182 212 / 0.35);
}

header .icon_22df li a.fn-active-38ec::after {
  display: none !important;
}

header .thick_e412 {
  background: linear-gradient(135deg, var(--c-emerald), var(--c-cyan-d)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 0.5rem 1rem !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 14px rgb(16 185 129 / 0.35) !important;
}

header .thick_e412 span {
  color: #fff !important;
}

@media (min-width: 769px) {
  header .hovered_4f84 {
    flex: 1;
    justify-content: center;
  }
}

@media (max-width: 768px) {
  header.gallery_basic_816e,
  header#siteHeader {
    background: linear-gradient(120deg, #0c1222, #1e1b4b) !important;
  }

  header .text_static_0959 {
    color: #e2e8f0 !important;
  }

  header .hovered_4f84 {
    background: #1e293b !important;
    border-color: #334155 !important;
  }

  header .hovered_4f84 .icon_22df li a {
    color: #e2e8f0 !important;
    border-bottom-color: #334155 !important;
  }
}

/* —— Hero (compact — override page 4rem/6rem padding) —— */
.clean_45ac,
.red-139d {
  border-bottom: 1px solid #e2e8f0 !important;
  padding: 1.1rem 1.15rem 1.25rem !important;
}

body:has(nav a[href="/"].fn-active-38ec) .clean_45ac,
body:has(nav a[href="instal.html"].fn-active-38ec) .clean_45ac,
body:has(nav a[href="faq.html"].fn-active-38ec) .clean_45ac {
  background: linear-gradient(165deg, #fff 0%, #ecfeff 35%, #faf5ff 70%, #fff7ed 100%) !important;
}

@media (min-width: 769px) {
  .clean_45ac,
  .red-139d {
    padding: 1.35rem 1.75rem 1.5rem !important;
  }
}

.clean_45ac .paper_aa0e,
.red-139d .paper_aa0e {
  max-width: var(--shell) !important;
}

.clean_45ac .module_013b,
.red-139d .module_013b {
  margin-bottom: 0.5rem !important;
  font-size: 0.8125rem !important;
}

.clean_45ac .tooltip-static-8908 {
  margin-bottom: 0.45rem !important;
  padding: 0.35rem 0.75rem !important;
  font-size: 0.8125rem !important;
}

.clean_45ac .panel-6e48,
.clean_45ac h1,
.red-139d h1 {
  margin-bottom: 0.55rem !important;
  font-size: clamp(1.5rem, 3.8vw, 2.15rem) !important;
  line-height: 1.2 !important;
}

.clean_45ac .surface_focused_a445,
.red-139d .surface_focused_a445,
.clean_45ac .huge_9701,
.red-139d p {
  margin-bottom: 0.75rem !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
}

.clean_45ac .upper_a867 {
  max-width: none !important;
}

.clean_45ac img.down-62e5,
.clean_45ac img[width="280"][height="280"],
.red-139d img[width="280"][height="280"] {
  width: 100px !important;
  height: 100px !important;
  max-width: 100px !important;
  margin: 0 auto 0.5rem !important;
  object-fit: cover;
}

@media (min-width: 769px) {
  .clean_45ac img.down-62e5,
  .clean_45ac img[width="280"][height="280"],
  .red-139d img[width="280"][height="280"] {
    width: 120px !important;
    height: 120px !important;
    max-width: 120px !important;
  }
}

.clean_45ac .tag_a1f7 {
  padding: 0.65rem 0 0.35rem !important;
  gap: 0.5rem 0.75rem !important;
  border-top-width: 1px !important;
  border-bottom-width: 1px !important;
  margin-top: 0.35rem !important;
  margin-bottom: 0.65rem !important;
}

.clean_45ac .tag_a1f7 .box_8fc3 {
  width: 36px !important;
  height: 36px !important;
  font-size: 1.1rem !important;
}

.clean_45ac .item_4e0a .rough_8a3a,
.clean_45ac .item_4e0a .wood-b9b5 {
  padding: 0.65rem 1.15rem !important;
}

.clean_45ac .info_glass_a7b8 {
  padding: 0.5rem 0.65rem !important;
}

.clean_45ac .item_4e0a {
  margin-top: 0.5rem !important;
  gap: 0.5rem !important;
}

.clean_45ac .north_8a97,
.red-139d .north_8a97 {
  margin-bottom: 0.65rem !important;
}

.caption_1a13 {
  padding: 0.65rem 1rem !important;
}

.logo-lite-81e0 {
  gap: 0.5rem 0.85rem !important;
}

.logo-lite-81e0 .rough-b8a4 {
  width: 44px !important;
  height: 44px !important;
  font-size: 1.35rem !important;
  margin-bottom: 0.25rem !important;
}

body > section:nth-of-type(2):has(> div > div > strong) {
  margin-top: 0 !important;
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.clean_45ac::before,
.red-139d::before {
  opacity: 0.5;
}

body:has(nav a[href="/"].fn-active-38ec) .clean_45ac h1,
body:has(nav a[href="/"].fn-active-38ec) .clean_45ac .panel-6e48,
body:has(nav a[href="instal.html"].fn-active-38ec) .clean_45ac h1,
body:has(nav a[href="faq.html"].fn-active-38ec) .clean_45ac h1 {
  color: var(--c-ink) !important;
}

/* Vivid hero pages — keep inline gradient, white copy */
body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac,
body:has(nav a[href="resmi.html"].fn-active-38ec) .clean_45ac,
body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac,
body:has(nav a[href="pembaruan.html"].fn-active-38ec) .clean_45ac,
body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac,
body:has(nav a[href="aplikasi.html"].fn-active-38ec) .clean_45ac,
body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac {
  color: #f8fafc !important;
  border-bottom-color: rgb(255 255 255 / 0.15) !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac h1,
body:has(nav a[href="resmi.html"].fn-active-38ec) .clean_45ac h1,
body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac h1,
body:has(nav a[href="pembaruan.html"].fn-active-38ec) .clean_45ac h1,
body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac h1,
body:has(nav a[href="aplikasi.html"].fn-active-38ec) .clean_45ac h1,
body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac h1,
body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .panel-6e48,
body:has(nav a[href="resmi.html"].fn-active-38ec) .clean_45ac .panel-6e48,
body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .panel-6e48,
body:has(nav a[href="pembaruan.html"].fn-active-38ec) .clean_45ac .panel-6e48,
body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac .panel-6e48,
body:has(nav a[href="aplikasi.html"].fn-active-38ec) .clean_45ac .panel-6e48,
body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .panel-6e48 {
  color: #fff !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="resmi.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="pembaruan.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="aplikasi.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .module_013b a,
body:has(nav a[href="resmi.html"].fn-active-38ec) .clean_45ac .module_013b a,
body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .module_013b a,
body:has(nav a[href="pembaruan.html"].fn-active-38ec) .clean_45ac .module_013b a,
body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac .module_013b a,
body:has(nav a[href="aplikasi.html"].fn-active-38ec) .clean_45ac .module_013b a,
body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .module_013b a,
body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .surface_focused_a445,
body:has(nav a[href="resmi.html"].fn-active-38ec) .clean_45ac .surface_focused_a445,
body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .surface_focused_a445,
body:has(nav a[href="pembaruan.html"].fn-active-38ec) .clean_45ac .surface_focused_a445,
body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac .surface_focused_a445,
body:has(nav a[href="aplikasi.html"].fn-active-38ec) .clean_45ac .surface_focused_a445,
body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .surface_focused_a445 {
  color: rgb(255 255 255 / 0.88) !important;
}

h1 .outline-1529,
h1 span.outline-1529 {
  background: linear-gradient(135deg, var(--c-cyan-d), var(--c-violet));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
}

.clean_45ac .tooltip-static-8908 {
  background: #fef3c7 !important;
  color: #92400e !important;
  border: 1px solid #fcd34d !important;
}

.clean_45ac .info_glass_a7b8 {
  border-radius: var(--radius-lg, 0.75rem);
  border-width: 1px !important;
}

.clean_45ac .info_glass_a7b8:nth-child(1) {
  background: #ecfeff !important;
  border-color: #67e8f9 !important;
}

.clean_45ac .info_glass_a7b8:nth-child(2) {
  background: #fff7ed !important;
  border-color: #fdba74 !important;
}

.clean_45ac .info_glass_a7b8:nth-child(3) {
  background: #f5f3ff !important;
  border-color: #c4b5fd !important;
}

.clean_45ac .info_glass_a7b8:nth-child(4) {
  background: #ecfdf5 !important;
  border-color: #6ee7b7 !important;
}

/* Trust strip */
body > section:nth-of-type(2):has(> div > div > strong) > div > div {
  border-radius: var(--radius-lg, 0.75rem);
  box-shadow: 0 2px 8px rgb(15 23 42 / 0.06);
}

body > section:nth-of-type(2):has(> div > div > strong) > div > div:nth-child(1) {
  background: #cffafe !important;
  border: 1px solid #22d3ee;
}

body > section:nth-of-type(2):has(> div > div > strong) > div > div:nth-child(2) {
  background: #ffedd5 !important;
  border: 1px solid #fb923c;
}

body > section:nth-of-type(2):has(> div > div > strong) > div > div:nth-child(3) {
  background: #ede9fe !important;
  border: 1px solid #a78bfa;
}

body > section:nth-of-type(2):has(> div > div > strong) > div > div:nth-child(4) {
  background: #d1fae5 !important;
  border: 1px solid #34d399;
}

/* —— Base shell —— */
.popup_2509 {
  max-width: var(--shell) !important;
  padding: 1.15rem 1.15rem 2.25rem !important;
  gap: 1.35rem !important;
  display: grid !important;
  align-items: start !important;
}

@media (min-width: 769px) {
  .popup_2509 {
    padding: 1.35rem 1.5rem 2.5rem !important;
    gap: 1.5rem !important;
  }
}

.component-f660 {
  top: calc(var(--header-h) + 0.75rem) !important;
}

.carousel-c090,
.component-f660 > * {
  min-width: 0;
}

.popup_2509 .static-a070 {
  font-size: clamp(1.35rem, 2.5vw, 1.875rem) !important;
  color: var(--c-ink) !important;
}

.popup_2509 .huge_9701 {
  color: var(--c-muted) !important;
  line-height: 1.65 !important;
}

.popup_2509 .lite_a262 {
  font-weight: 700 !important;
}

/* —— All pages: section rhythm —— */
.popup_2509 .north_8a97 {
  margin-bottom: 1rem !important;
  max-width: none !important;
}

.popup_2509 .slider_6eb2 {
  margin-bottom: 0 !important;
}

.popup_2509 .filter-d5bc {
  padding: 1.35rem 1.15rem !important;
  margin: 0 !important;
  border-radius: var(--card-r) !important;
}

.popup_2509 .menu-static-f65d {
  margin-bottom: 1rem !important;
}

.popup_2509 .hover-dynamic-f320 {
  gap: 0.65rem !important;
}

/* ========== 1. INDEX — wide article + sticky RIGHT tools ========== */
body:has(nav a[href="/"].fn-active-38ec) .clean_45ac .upper_a867 {
  text-align: center !important;
  max-width: 920px;
  margin: 0 auto;
}

body:has(nav a[href="/"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="/"].fn-active-38ec) .clean_45ac .tooltip-static-8908 {
  justify-content: center;
}

body:has(nav a[href="/"].fn-active-38ec) .clean_45ac .tag_a1f7 {
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

body:has(nav a[href="/"].fn-active-38ec) .popup_2509 {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 320px) !important;
  max-width: 1180px !important;
  gap: 1.2rem !important;
}

body:has(nav a[href="/"].fn-active-38ec) .popup_2509 > .carousel-c090 {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

body:has(nav a[href="/"].fn-active-38ec) .popup_2509 > .component-f660 {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

body:has(nav a[href="/"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  border-radius: var(--card-r) !important;
  border: 1px solid #e2e8f0 !important;
  border-top: 4px solid var(--c-cyan-d) !important;
  border-left: none !important;
  box-shadow: 0 2px 14px rgb(15 23 42 / 0.05) !important;
  padding: 1.2rem 1.15rem !important;
}

body:has(nav a[href="/"].fn-active-38ec) .popup_2509 .component-f660 .last-9c29 {
  padding: 0.85rem 0.95rem !important;
}

body:has(nav a[href="/"].fn-active-38ec) .caption_1a13 {
  margin-top: 0 !important;
}

body:has(nav a[href="/"].fn-active-38ec) .popup_2509 .north_8a97 {
  text-align: left !important;
}

body:has(nav a[href="/"].fn-active-38ec) .popup_2509 .message_437e {
  display: grid;
  gap: 0.75rem;
}

@media (min-width: 900px) {
  body:has(nav a[href="/"].fn-active-38ec) .popup_2509 .message_437e {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ========== 2. INSTAL — sticky LEFT rail + timeline main ========== */
body:has(nav a[href="instal.html"].fn-active-38ec) .clean_45ac .upper_a867 {
  text-align: left !important;
  max-width: 720px;
}

body:has(nav a[href="instal.html"].fn-active-38ec) .clean_45ac .tooltip-static-8908 {
  align-self: flex-start;
}

body:has(nav a[href="instal.html"].fn-active-38ec) .popup_2509 {
  grid-template-columns: minmax(240px, 280px) minmax(0, 1fr) !important;
  max-width: 1100px !important;
  gap: 1.15rem !important;
}

body:has(nav a[href="instal.html"].fn-active-38ec) .popup_2509 > .carousel-c090 {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: 1.35rem;
  border-left: 3px dashed #cbd5e1;
  padding-left: 1.75rem;
}

body:has(nav a[href="instal.html"].fn-active-38ec) .popup_2509 > .component-f660 {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

body:has(nav a[href="instal.html"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  border: 1px solid #e2e8f0 !important;
  border-top: 4px solid var(--c-amber) !important;
  border-radius: var(--card-r) !important;
  background: var(--c-surface) !important;
  box-shadow: 0 2px 12px rgb(15 23 42 / 0.04) !important;
  padding: 1.15rem 1.1rem !important;
}

body:has(nav a[href="instal.html"].fn-active-38ec) .popup_2509 .chip_hard_a0f4 {
  padding: 1rem 1.05rem !important;
  margin-bottom: 0.65rem !important;
  border-radius: 0.75rem !important;
}

body:has(nav a[href="instal.html"].fn-active-38ec) .popup_2509 .component-f660 .last-9c29 {
  padding: 0.85rem 0.95rem !important;
}

body:has(nav a[href="instal.html"].fn-active-38ec) .popup_2509 > .carousel-c090 > .modal_fixed_c7be {
  background: var(--c-surface) !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: var(--card-r) !important;
  padding: 1rem 1.15rem !important;
  border-left: 6px solid var(--c-violet) !important;
}

/* ========== 3. FAQ — filters RIGHT, Q&A full left ========== */
body:has(nav a[href="faq.html"].fn-active-38ec) .clean_45ac .north_8a97,
body:has(nav a[href="faq.html"].fn-active-38ec) .clean_45ac h1 {
  text-align: center !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .clean_45ac .paper_aa0e {
  text-align: center;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 {
  grid-template-columns: minmax(0, 1fr) minmax(240px, 280px) !important;
  max-width: 980px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 1.15rem !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 > .carousel-c090 {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 > .component-f660 {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  border: 1px solid #e2e8f0 !important;
  border-top: 4px solid var(--c-violet) !important;
  border-radius: var(--card-r) !important;
  background: var(--c-surface) !important;
  padding: 0 !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 .menu-static-f65d {
  padding: 1rem 1.05rem !important;
  margin-bottom: 1rem !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 .preview-pressed-4e6b {
  margin-bottom: 0.5rem !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 .smooth_ccbe {
  margin-bottom: 1rem !important;
  padding-bottom: 0.75rem !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 .title_7883 {
  border-top: 4px solid var(--c-cyan-d) !important;
  border-radius: var(--card-r) !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 .north_8a97 {
  text-align: left !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .copper-21b1 {
  max-width: 100% !important;
  width: 100%;
  margin: 0.65rem 0 0 !important;
  box-sizing: border-box;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .outer-c198 {
  max-width: 100%;
  box-sizing: border-box;
  font-size: 1rem !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .smooth_ccbe {
  flex-wrap: wrap;
  gap: 0.75rem;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .center-42f0 {
  font-size: clamp(1.2rem, 4.5vw, 1.75rem) !important;
  min-width: 0;
  line-height: 1.25;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .menu-static-f65d {
  margin-bottom: 1.5rem !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 .caption-copper-1442 {
  width: 100% !important;
  max-width: 100% !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 .caption-copper-1442 li button {
  width: 100%;
  box-sizing: border-box;
}

body:has(nav a[href="faq.html"].fn-active-38ec) [data-faq-item][data-open="true"] .text-e47e,
body:has(nav a[href="faq.html"].fn-active-38ec) [data-faq-item][data-open="true"] [data-faq-answer] {
  overflow: visible !important;
}

body:has(nav a[href="faq.html"].fn-active-38ec) .outline_dim_cdc6 {
  padding: 0 1rem 1rem !important;
}

@media (max-width: 768px) {
  body:has(nav a[href="faq.html"].fn-active-38ec) .outer-c198 {
    padding: 0.85rem 1rem 0.85rem 2.75rem !important;
    font-size: 0.9375rem !important;
  }

  body:has(nav a[href="faq.html"].fn-active-38ec) .component-f660 {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.75rem !important;
  }

  body:has(nav a[href="faq.html"].fn-active-38ec) .link_yellow_a270 {
    padding: 1rem 0.85rem !important;
    font-size: 0.9375rem !important;
  }
}

/* ========== 4. APK — 12-col bento, no sidebar ========== */
body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .paper_aa0e {
  display: flex !important;
  flex-direction: column;
  align-items: stretch;
  gap: 0.35rem;
  text-align: left !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .upper_a867 {
  max-width: none !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .tooltip-static-8908 {
  align-self: flex-start;
  margin-bottom: 0.35rem !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .surface_focused_a445 {
  margin-bottom: 0.85rem !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .notice-huge-1895 {
  padding: 0.85rem 1rem !important;
  gap: 0.85rem 1.25rem !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .item-c0e3 {
  font-size: 1.5rem !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .complex-3c13 {
  padding: 0.65rem 1.15rem !important;
  font-size: 0.9375rem !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .popup_2509 {
  display: flex !important;
  flex-direction: column !important;
  max-width: 920px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 1.15rem !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .popup_2509 > .hovered_fc77,
body:has(nav a[href="apk.html"].fn-active-38ec) .popup_2509 > section.slider_6eb2 {
  width: 100%;
  min-width: 0;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  border: 1px solid #e2e8f0 !important;
  border-top: 4px solid var(--c-cyan-d) !important;
  border-radius: var(--card-r) !important;
  background: var(--c-surface) !important;
  box-shadow: 0 2px 12px rgb(15 23 42 / 0.04) !important;
  padding: 1.15rem 1.1rem !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(3n + 1) {
  border-top-color: var(--c-cyan-d) !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(3n + 2) {
  border-top-color: var(--c-violet) !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(3n) {
  border-top-color: var(--c-amber) !important;
}

body:has(nav a[href="apk.html"].fn-active-38ec) .popup_2509 .north_8a97 {
  text-align: left !important;
  margin-bottom: 1rem !important;
}

/* ========== 5. APLIKASI — stacked feature cards ========== */
body:has(nav a[href="aplikasi.html"].fn-active-38ec) .clean_45ac .paper_aa0e {
  text-align: center;
}

body:has(nav a[href="aplikasi.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="aplikasi.html"].fn-active-38ec) .clean_45ac .tooltip-static-8908 {
  justify-content: center;
}

body:has(nav a[href="aplikasi.html"].fn-active-38ec) .popup_2509 {
  display: flex !important;
  flex-direction: column !important;
  max-width: 920px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 1.15rem !important;
}

body:has(nav a[href="aplikasi.html"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  border: 1px solid #e2e8f0 !important;
  border-top: 4px solid #14b8a6 !important;
  background: var(--c-surface) !important;
  outline: none !important;
  border-radius: var(--card-r) !important;
  padding: 1.15rem 1.1rem !important;
  box-shadow: 0 2px 12px rgb(15 23 42 / 0.04) !important;
}

body:has(nav a[href="aplikasi.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(4n + 2) {
  border-top-color: var(--c-violet) !important;
}

body:has(nav a[href="aplikasi.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(4n + 3) {
  border-top-color: var(--c-amber) !important;
}

body:has(nav a[href="aplikasi.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(4n) {
  border-top-color: var(--c-rose) !important;
}

body:has(nav a[href="aplikasi.html"].fn-active-38ec) .popup_2509 .north_8a97 {
  text-align: left !important;
}

/* ========== 6. APK-DOWNLOAD — narrow funnel + card grid ========== */
body:has(nav a[href="apk-download.html"].fn-active-38ec) .red-139d {
  background: linear-gradient(135deg, #0f172a, #134e4a) !important;
  color: #f8fafc !important;
  padding: 1.15rem 1.15rem 1.25rem !important;
}

body:has(nav a[href="apk-download.html"].fn-active-38ec) .red-139d h1,
body:has(nav a[href="apk-download.html"].fn-active-38ec) .red-139d p {
  color: #f1f5f9 !important;
}

body:has(nav a[href="apk-download.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="apk-download.html"].fn-active-38ec) .clean_45ac .tooltip-static-8908 {
  justify-content: center;
}

body:has(nav a[href="apk-download.html"].fn-active-38ec) .popup_2509 {
  display: flex !important;
  flex-direction: column !important;
  max-width: 880px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 1.15rem !important;
}

body:has(nav a[href="apk-download.html"].fn-active-38ec) .popup_2509 > section#download-main {
  order: 1;
}

body:has(nav a[href="apk-download.html"].fn-active-38ec) .popup_2509 > .tooltip-8e9c {
  order: 2;
}

body:has(nav a[href="apk-download.html"].fn-active-38ec) .popup_2509 .badge-c8ca {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 1rem !important;
}

@media (min-width: 700px) {
  body:has(nav a[href="apk-download.html"].fn-active-38ec) .popup_2509 .badge-c8ca {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

body:has(nav a[href="apk-download.html"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  border: 1px solid #99f6e4 !important;
  border-top: 4px solid #0d9488 !important;
  border-radius: var(--card-r) !important;
  background: var(--c-surface) !important;
  box-shadow: 0 2px 14px rgb(13 148 136 / 0.08) !important;
  text-align: center;
  padding: 1.2rem 1.1rem !important;
}

body:has(nav a[href="apk-download.html"].fn-active-38ec) .popup_2509 .north_8a97 {
  text-align: left !important;
  max-width: none !important;
}

body:has(nav a[href="apk-download.html"].fn-active-38ec) .popup_2509 .filter-d5bc {
  text-align: left;
}

/* ========== 7. PROFILE — data sheet / KPI dashboard ========== */
body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac .paper_aa0e {
  text-align: center;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac .upper_a867 {
  max-width: 640px;
  margin: 0 auto;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac .tooltip-static-8908 {
  justify-content: center;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .clean_45ac .hard_5830 {
  margin: 0.5rem auto 0 !important;
  padding: 0.65rem 1rem !important;
  font-size: 0.875rem !important;
  max-width: 100%;
  box-sizing: border-box;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 {
  display: flex !important;
  flex-direction: column !important;
  max-width: 920px !important;
  gap: 1.15rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .north_8a97 {
  text-align: left !important;
  margin-bottom: 1rem !important;
  max-width: none !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .west-5478 {
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  gap: 1rem 1.15rem !important;
  padding: 1.15rem 1.1rem !important;
  margin-bottom: 0 !important;
  border-radius: var(--card-r) !important;
  border: 1px solid #bae6fd !important;
  border-left: 5px solid var(--c-cyan-d) !important;
  background: linear-gradient(135deg, #ecfeff 0%, #eff6ff 100%) !important;
  align-items: center;
  text-align: left;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .middle-1e83 {
  width: 112px !important;
  height: 112px !important;
  margin: 0 auto;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .middle-1e83 img {
  width: 80px !important;
  height: 80px !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .basic_bdcb h2 {
  font-size: clamp(1.35rem, 4vw, 1.75rem) !important;
  margin-bottom: 0.35rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .steel-ccdd {
  font-size: 0.9375rem !important;
  margin-bottom: 0.65rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .feature_4d55 {
  gap: 0.45rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .cool-9343 {
  padding: 0.35rem 0.65rem !important;
  font-size: 0.75rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .basic_bdcb > p[style] {
  margin-top: 0.75rem !important;
  font-size: 0.875rem !important;
  line-height: 1.55 !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  margin-bottom: 0 !important;
  padding: 1.2rem 1.1rem 1.25rem !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: var(--card-r) !important;
  background: var(--c-surface) !important;
  box-shadow: 0 2px 14px rgb(15 23 42 / 0.04) !important;
  min-height: auto !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(1) {
  border-top: 4px solid var(--c-cyan-d) !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(2) {
  border-top: 4px solid var(--c-emerald) !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(3) {
  border-top: 4px solid var(--c-violet) !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(4) {
  border-top: 4px solid var(--c-amber) !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(5) {
  border-top: 4px solid var(--c-rose) !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(6) {
  border-top: 4px solid var(--c-cyan) !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .border-947f {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .status-soft-de1f {
  padding: 1rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .active_right_2751 {
  margin-bottom: 0.65rem !important;
  padding-bottom: 0.55rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .tooltip-5152 {
  width: 40px !important;
  height: 40px !important;
  font-size: 1.15rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .status-soft-de1f h3 {
  font-size: 1rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .image_27bc {
  flex-wrap: wrap;
  gap: 0.25rem 0.5rem;
  padding: 0.45rem 0 !important;
  font-size: 0.8125rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .accent_easy_ffcd {
  text-align: right;
  max-width: 58%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .next-8ea3 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .content-31cf {
  padding: 1rem 0.9rem !important;
  text-align: left !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .photo-yellow-2a79 {
  width: 48px !important;
  height: 48px !important;
  font-size: 1.35rem !important;
  margin: 0 0 0.65rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .content-31cf h4 {
  font-size: 0.9875rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .content-31cf p {
  font-size: 0.8125rem !important;
  line-height: 1.5 !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .alert_warm_bb9e {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.65rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .west-1ed9 {
  padding: 1rem 0.85rem !important;
  text-align: left !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .overlay_medium_09cd {
  font-size: clamp(1.5rem, 5vw, 2rem) !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .column-a201 {
  font-size: 0.8125rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .info-2f9b {
  gap: 0.65rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .bright-557e {
  padding: 0.85rem 1rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .bright-557e:hover {
  transform: none !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .panel-a58b {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0.5rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .short-1f62 {
  padding: 0.65rem 0.35rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .label_smooth_421a {
  font-size: 0.75rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .hover-dynamic-f320 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.65rem !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .filter-d5bc {
  margin: 0 !important;
  padding: 1.35rem 1.15rem !important;
  border-radius: var(--card-r) !important;
}

body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .slider_6eb2 > div[style*="info-50"] {
  margin-top: 1rem !important;
  padding: 1rem !important;
  text-align: left !important;
  font-size: 0.875rem !important;
}

@media (max-width: 768px) {
  body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .west-5478 {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }

  body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .border-947f,
  body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .next-8ea3,
  body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .alert_warm_bb9e,
  body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .panel-a58b,
  body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .hover-dynamic-f320 {
    grid-template-columns: 1fr !important;
  }

  body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .accent_easy_ffcd {
    max-width: 100%;
    text-align: left;
  }

  body:has(nav a[href="profile.html"].fn-active-38ec) .popup_2509 .image_27bc {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ========== 8. PEMBARUAN — centered changelog rail ========== */
body:has(nav a[href="pembaruan.html"].fn-active-38ec) .clean_45ac .paper_aa0e {
  text-align: center;
}

body:has(nav a[href="pembaruan.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="pembaruan.html"].fn-active-38ec) .clean_45ac .tooltip-static-8908 {
  justify-content: center;
}

body:has(nav a[href="pembaruan.html"].fn-active-38ec) .popup_2509 {
  display: flex !important;
  flex-direction: column !important;
  max-width: 820px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 1.1rem !important;
  border-left: 4px solid var(--c-amber);
  padding-left: 1.35rem !important;
}

body:has(nav a[href="pembaruan.html"].fn-active-38ec) .popup_2509 .north_8a97 {
  text-align: left !important;
}

body:has(nav a[href="pembaruan.html"].fn-active-38ec) .popup_2509 .filter-d5bc {
  border: 1px solid #fde68a !important;
  background: #fffbeb !important;
}

body:has(nav a[href="pembaruan.html"].fn-active-38ec) .popup_2509 .badge_fc55,
body:has(nav a[href="pembaruan.html"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  border: 1px solid #e2e8f0 !important;
  background: var(--c-surface) !important;
  box-shadow: 0 2px 10px rgb(15 23 42 / 0.04) !important;
  border-radius: 0 0.75rem 0.75rem 0 !important;
  padding: 1rem 1.05rem 1.1rem !important;
  position: relative;
}

body:has(nav a[href="pembaruan.html"].fn-active-38ec) .popup_2509 .slider_6eb2::before {
  content: "";
  position: absolute;
  left: -1.65rem;
  top: 1.5rem;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--c-amber);
  box-shadow: 0 0 0 4px #fff7ed;
}

/* ========== 9. TENTANG KAMI — editorial story layout ========== */
body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .paper_aa0e {
  text-align: center;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .upper_a867 {
  max-width: 680px;
  margin: 0 auto;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .tooltip-static-8908 {
  justify-content: center;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .grid_767e {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0.55rem !important;
  margin: 0.85rem auto 0 !important;
  max-width: 36rem;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .overlay-pressed-2865 {
  padding: 0.65rem 0.45rem !important;
  border-radius: 0.75rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .bottom_86dd {
  font-size: 1.35rem !important;
  margin-bottom: 0.2rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .highlight-short-fb65 {
  font-size: 0.75rem !important;
  line-height: 1.25;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 {
  display: flex !important;
  flex-direction: column !important;
  max-width: 920px !important;
  gap: 1.15rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .north_8a97 {
  text-align: left !important;
  margin-bottom: 1rem !important;
  max-width: none !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .module-orange-cba2 {
  border-radius: 1.1rem !important;
  padding: 1.35rem 1.25rem !important;
  margin-bottom: 0 !important;
  border: 1px solid #e9d5ff !important;
  border-left: 5px solid var(--c-violet) !important;
  background: linear-gradient(135deg, #fdf4ff 0%, #ecfeff 100%) !important;
  box-shadow: 0 4px 18px rgb(139 92 246 / 0.08);
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .pink-62e5 h3 {
  font-size: clamp(1.25rem, 3.5vw, 1.5rem) !important;
  margin-bottom: 1rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .pink-62e5 p {
  font-size: 0.9875rem !important;
  line-height: 1.65 !important;
  margin-bottom: 0.85rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  margin-bottom: 0 !important;
  padding: 1.2rem 1.15rem 1.25rem !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: var(--card-r) !important;
  background: var(--c-surface) !important;
  box-shadow: 0 2px 14px rgb(15 23 42 / 0.04) !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(1) {
  border-top: 4px solid var(--c-violet) !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(2) {
  border-top: 4px solid var(--c-cyan-d) !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(3) {
  border-top: 4px solid var(--c-amber) !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(4) {
  border-top: 4px solid var(--c-emerald) !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(5) {
  border-top: 4px solid var(--c-rose) !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .about-mission-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.85rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .about-mission-card {
  border-radius: 0.85rem !important;
  padding: 1.15rem 1.1rem !important;
  border: 1px solid #e2e8f0 !important;
  min-width: 0;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .about-mission-card--vision {
  background: linear-gradient(160deg, #eff6ff, #ecfeff) !important;
  border-color: #93c5fd !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .about-mission-card--mission {
  background: linear-gradient(160deg, #faf5ff, #fff7ed) !important;
  border-color: #c4b5fd !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .about-mission-card h3 {
  font-size: 1.15rem !important;
  margin-bottom: 0.65rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .about-mission-card p,
body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .about-mission-card ul {
  font-size: 0.9375rem !important;
  line-height: 1.6 !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .about-mission-card > div:first-child {
  font-size: 2rem !important;
  margin-bottom: 0.5rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .pattern_dynamic_dccb {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .hovered-ab4e {
  padding: 1.1rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .accordion_north_9598 {
  width: 48px !important;
  height: 48px !important;
  font-size: 1.35rem !important;
  margin-bottom: 0.75rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .hovered-ab4e h3 {
  font-size: 1.05rem !important;
  margin-bottom: 0.45rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .hovered-ab4e p {
  font-size: 0.875rem !important;
  line-height: 1.55 !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .thumbnail-fast-bea8 {
  padding-left: 1.5rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .basic-acb3 {
  padding: 1rem 1.05rem !important;
  margin-bottom: 0.75rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .basic-acb3::before {
  left: -1.28rem;
  top: 1.15rem;
  width: 14px;
  height: 14px;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .basic-acb3:hover {
  transform: none !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .dropdown-red-1eff {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .overlay-iron-f2b5 {
  padding: 1.1rem !important;
  text-align: left !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .summary_6097 {
  width: 56px !important;
  height: 56px !important;
  font-size: 1.5rem !important;
  margin: 0 0 0.75rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .surface-static-78a0 {
  margin: 0 !important;
  padding: 1.25rem 1rem !important;
  border-radius: var(--card-r) !important;
  background: linear-gradient(135deg, #0c1222, #1e1b4b) !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .medium_4211 {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0.65rem 0.5rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .center-69bd h3 {
  font-size: clamp(1.35rem, 4vw, 1.75rem) !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .center-69bd p {
  font-size: 0.8125rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .soft-cace {
  padding: 1.35rem 1.15rem !important;
  margin: 0 !important;
  border-radius: var(--card-r) !important;
  border: 1px solid #bae6fd;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .soft-cace h3 {
  font-size: clamp(1.25rem, 4vw, 1.5rem) !important;
  margin-bottom: 0.65rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider-green-db07 {
  gap: 0.65rem !important;
  justify-content: stretch !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .filter_4965 {
  flex: 1 1 100%;
  justify-content: center;
  padding: 0.75rem 1rem !important;
  font-size: 0.875rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .hover-dynamic-f320 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.65rem !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .filter-d5bc {
  margin: 0 !important;
  padding: 1.35rem 1.15rem !important;
  border-radius: var(--card-r) !important;
}

body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider_6eb2 > div[style*="success-50"] {
  margin-top: 1rem !important;
  padding: 1rem !important;
  text-align: left !important;
}

@media (max-width: 768px) {
  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .clean_45ac .grid_767e {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-width: 100%;
  }

  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .about-mission-grid,
  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .pattern_dynamic_dccb,
  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .dropdown-red-1eff,
  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .medium_4211,
  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .hover-dynamic-f320 {
    grid-template-columns: 1fr !important;
  }

  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .thumbnail-fast-bea8 {
    padding-left: 1.15rem !important;
  }

  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .basic-acb3::before {
    left: -1.05rem;
  }
}

/* ========== 10. RESMI — stacked trust blocks ========== */
body:has(nav a[href="resmi.html"].fn-active-38ec) .clean_45ac .paper_aa0e {
  text-align: center;
}

body:has(nav a[href="resmi.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="resmi.html"].fn-active-38ec) .clean_45ac .tooltip-static-8908 {
  justify-content: center;
}

body:has(nav a[href="resmi.html"].fn-active-38ec) .popup_2509 {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.15rem !important;
  max-width: 920px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body:has(nav a[href="resmi.html"].fn-active-38ec) .popup_2509 > .row_pro_7ae9 {
  width: 100%;
  border: 1px solid #bbf7d0 !important;
  border-top: 4px solid var(--c-emerald) !important;
  background: #f0fdf4 !important;
  padding: 1.2rem 1.15rem !important;
  border-radius: var(--card-r) !important;
  box-sizing: border-box;
}

body:has(nav a[href="resmi.html"].fn-active-38ec) .popup_2509 > .slider_6eb2:first-of-type {
  width: 100%;
}

body:has(nav a[href="resmi.html"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  border: 1px solid #e2e8f0 !important;
  border-top: 4px solid var(--c-emerald) !important;
  border-radius: var(--card-r) !important;
  background: var(--c-surface) !important;
  padding: 1.15rem 1.1rem !important;
  box-shadow: 0 2px 12px rgb(15 23 42 / 0.04) !important;
}

body:has(nav a[href="resmi.html"].fn-active-38ec) .popup_2509 .north_8a97 {
  text-align: left !important;
}

/* ========== 11. ULASAN — review feed layout ========== */
body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .paper_aa0e {
  text-align: center;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .module_013b,
body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .tooltip-static-8908 {
  justify-content: center;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .upper_a867 {
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .surface_focused_a445 {
  font-size: clamp(1rem, 2.5vw, 1.125rem) !important;
  margin-bottom: 1.35rem !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .menu_7036 {
  max-width: 100%;
  margin: 0 auto;
  padding: 1.25rem 1.15rem !important;
  grid-template-columns: minmax(6.5rem, auto) minmax(0, 1fr);
  gap: 1rem 1.25rem !important;
  text-align: left;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .carousel_d926 {
  font-size: clamp(2.35rem, 7vw, 3.25rem) !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .tiny-ea59 {
  font-size: 1.15rem !important;
  margin: 0.35rem 0 !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .row_light_3c9d {
  grid-template-columns: 2.25rem minmax(0, 1fr) 2.75rem;
  gap: 0.5rem;
  font-size: 0.8125rem;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .button-51e9 {
  font-size: 0.75rem;
  font-variant-numeric: tabular-nums;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 {
  display: flex !important;
  flex-direction: column !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 1rem !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 > .basic_e6f2 {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  width: 100%;
  min-width: 0;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .component_0aa8 {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0.65rem !important;
  margin-bottom: 0 !important;
  border-radius: var(--card-r) !important;
  padding: 0.85rem 0.95rem !important;
  max-width: 100%;
  min-width: 0;
  border: 1px solid #fecdd3 !important;
  background: #fff1f2 !important;
  box-shadow: 0 2px 12px rgb(244 63 94 / 0.06) !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .box_old_27aa {
  justify-content: flex-start;
  gap: 0.45rem !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .border_complex_c6d1 {
  padding: 0.4rem 0.8rem !important;
  font-size: 0.8125rem !important;
  border-width: 1px !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .list-6c9a {
  font-size: 0.8125rem !important;
  text-align: left;
  padding-top: 0.15rem;
  border-top: 1px solid rgb(244 63 94 / 0.15);
}

@media (min-width: 640px) {
  body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .component_0aa8 {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .list-6c9a {
    border-top: none;
    padding-top: 0;
    margin-left: auto;
    text-align: right;
  }
}

@media (min-width: 769px) {
  body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .component_0aa8 {
    position: sticky;
    top: calc(var(--header-h) + 0.5rem);
    z-index: 5;
  }
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .accordion_dynamic_665e {
  border: 1px solid #e2e8f0 !important;
  border-left: 4px solid var(--c-rose) !important;
  border-radius: var(--card-r) !important;
  background: var(--c-surface) !important;
  box-shadow: 0 2px 10px rgb(244 63 94 / 0.06) !important;
  padding: 1rem 1rem 0.85rem !important;
  margin: 0 !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .accordion_dynamic_665e:hover {
  border-color: #fda4af !important;
  box-shadow: 0 4px 16px rgb(244 63 94 / 0.1) !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .panel-large-1f64 {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  margin-bottom: 0.5rem !important;
  padding: 0 !important;
  align-items: flex-start !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .sort-67d2 {
  width: 42px !important;
  height: 42px !important;
  font-size: 0.9375rem !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .easy-70c4 {
  gap: 0.75rem !important;
  min-width: 0;
  flex: 1;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .copper_0751 {
  min-width: 0;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .copper_0751 h4 {
  font-size: 0.9375rem !important;
  line-height: 1.3;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .status_e76b {
  flex-wrap: wrap;
  row-gap: 0.2rem;
  font-size: 0.75rem !important;
  line-height: 1.4;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .pagination_focused_52ee {
  font-size: 0.9375rem !important;
  letter-spacing: -0.02em;
  white-space: nowrap;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .tooltip_285a {
  font-size: 0.9375rem !important;
  line-height: 1.65 !important;
  margin-bottom: 0.65rem !important;
  color: var(--c-ink) !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .row-paper-aac4 {
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  padding-top: 0.65rem !important;
  font-size: 0.75rem !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .background-stone-c11f {
  flex-wrap: wrap;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .hidden_huge_0937 {
  padding: 0.3rem 0.55rem !important;
  font-size: 0.75rem !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .ulasan-more-wrap {
  margin-top: 0.25rem !important;
  text-align: center;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .ulasan-more-btn {
  padding: 0.75rem 1.35rem !important;
  font-size: 0.9375rem !important;
  border-radius: var(--card-r) !important;
  width: 100%;
  max-width: 20rem;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .surface-static-78a0 {
  margin: 0.5rem 0 !important;
  padding: 1.25rem 1rem !important;
  border-radius: var(--card-r) !important;
  border: 1px solid #f5d0fe;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .surface-static-78a0 > h3[style] {
  font-size: 1.25rem !important;
  margin-bottom: 1rem !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .alert_warm_bb9e {
  gap: 0.75rem !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .yellow-9366 h3 {
  font-size: 1.5rem !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .yellow-9366 p {
  font-size: 0.8125rem !important;
  line-height: 1.35;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .slider_6eb2 {
  width: 100%;
  border: 1px solid #e2e8f0 !important;
  border-top: 4px solid var(--c-rose) !important;
  border-radius: var(--card-r) !important;
  padding: 1.15rem 1.05rem !important;
  box-shadow: 0 2px 12px rgb(15 23 42 / 0.04) !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .north_8a97 {
  text-align: left !important;
  margin-bottom: 0.85rem !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .hover-dynamic-f320 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .title-5293 {
  border-radius: 0.65rem !important;
  box-shadow: 0 2px 10px rgb(15 23 42 / 0.08) !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .title-5293:hover {
  transform: translateY(-3px);
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .filter-d5bc {
  margin: 0.35rem 0 0 !important;
  padding: 1.5rem 1.15rem !important;
  border-radius: var(--card-r) !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .menu_green_837b {
  font-size: clamp(1.25rem, 4vw, 1.5rem) !important;
}

body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .mask_hot_830d {
  font-size: 0.9375rem !important;
  margin-bottom: 1.25rem !important;
}

@media (min-width: 520px) {
  body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .alert_warm_bb9e {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 480px) {
  body:has(nav a[href="ulasan.html"].fn-active-38ec) .clean_45ac .menu_7036 {
    grid-template-columns: 1fr !important;
    text-align: center;
  }

  body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .panel-large-1f64 {
    flex-direction: column !important;
    gap: 0.35rem !important;
  }

  body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .pagination_focused_52ee {
    align-self: flex-start;
  }

  body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .row-paper-aac4 {
    flex-direction: column;
    align-items: flex-start !important;
  }

  body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .hover-dynamic-f320 {
    grid-template-columns: 1fr !important;
  }

  body:has(nav a[href="ulasan.html"].fn-active-38ec) .popup_2509 .status_e76b span:nth-child(2n) {
    display: none;
  }
}

/* Shared card base (overridden above per page) */
.popup_2509 .last-9c29,
.popup_2509 .title_7883,
.popup_2509 .menu-static-f65d {
  background: var(--c-surface) !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: var(--card-r) !important;
  box-shadow: 0 2px 12px rgb(15 23 42 / 0.05) !important;
}

/* Feature tiles */
.popup_2509 .brown_27e7,
.popup_2509 .message_437e > div {
  border-radius: 0.75rem;
}

.popup_2509 .brown_27e7:nth-child(4n + 1) {
  background: #ecfeff !important;
  border: 1px solid #a5f3fc;
}

.popup_2509 .brown_27e7:nth-child(4n + 2) {
  background: #fff7ed !important;
  border: 1px solid #fed7aa;
}

.popup_2509 .brown_27e7:nth-child(4n + 3) {
  background: #f5f3ff !important;
  border: 1px solid #ddd6fe;
}

.popup_2509 .brown_27e7:nth-child(4n) {
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0;
}

/* Sidebar widgets */
.popup_2509 .component-f660 .last-9c29,
.popup_2509 .component-f660 .title_7883 {
  border-top: 4px solid var(--c-emerald) !important;
}

.popup_2509 .component-f660 .last-9c29:nth-child(2) {
  border-top-color: var(--c-violet) !important;
}

.popup_2509 .search-c86c,
.popup_2509 .frame-top-a249 {
  color: var(--c-ink) !important;
  border-bottom: 2px dashed #e2e8f0;
  padding-bottom: 0.5rem;
  margin-bottom: 0.65rem;
}

/* Download box — readable */
aside .last-9c29:has(a[href*="1003.html"]),
.popup_2509 .last-9c29:has(a[href*="1003.html"]),
aside div:has(> a[href*="1003.html"]) {
  background: linear-gradient(160deg, #ecfdf5, #ecfeff) !important;
  border: 2px solid #5eead4 !important;
}

aside .last-9c29:has(a[href*="1003.html"]) *,
.popup_2509 .last-9c29:has(a[href*="1003.html"]) * {
  color: var(--c-ink) !important;
}

aside a[href*="1003.html"],
.popup_2509 a[href*="1003.html"].wood_e342,
.popup_2509 a.footer_0c6b[href*="1003.html"] {
  background: linear-gradient(135deg, var(--c-cyan-d), var(--c-emerald)) !important;
  color: #fff !important;
  border-radius: 0.65rem !important;
  font-weight: 700 !important;
}

#download code {
  background: rgb(8 145 178 / 0.12) !important;
  color: var(--c-ink) !important;
}

#download div[style*="border-top"] {
  border-top-color: #cbd5e1 !important;
  opacity: 1 !important;
}

/* APK stats bar */
.popup_2509 .hovered_fc77 {
  background: linear-gradient(90deg, #ecfeff, #f5f3ff, #fff7ed) !important;
  border: 1px solid #e2e8f0 !important;
  padding: 1rem 1.15rem !important;
}

.popup_2509 .pagination-f645 {
  background: rgb(255 255 255 / 0.9) !important;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  color: var(--c-ink);
}

/* FAQ filters */
.popup_2509 .title_7883 button[aria-pressed="true"],
.popup_2509 .caption-copper-1442 button[aria-pressed="true"] {
  background: linear-gradient(135deg, var(--c-cyan-d), var(--c-violet)) !important;
  color: #fff !important;
}

/* Reviews filter bar */
.popup_2509 .component_0aa8 .border_complex_c6d1.fn-active-38ec {
  background: linear-gradient(135deg, var(--c-amber), var(--c-rose)) !important;
  color: #fff !important;
  border-color: transparent !important;
}

/* Screenshots */
div:has(> div > img[height="500"]) {
  gap: 0.75rem !important;
}

img[height="500"] {
  border-radius: 0.75rem !important;
  border: 2px solid #e2e8f0;
  object-fit: cover;
}

/* ========== Overflow & clip safety (all 11 pages) ========== */
html {
  overflow-x: clip;
  scroll-padding-top: calc(var(--header-h) + 0.65rem);
}

body {
  overflow-x: clip;
}

.popup_2509,
.paper_aa0e,
.slider_6eb2,
.clean_45ac,
.red-139d,
.caption_1a13,
footer,
.smooth_85d0 {
  min-width: 0;
  max-width: 100%;
}

.popup_2509 img,
.popup_2509 video,
.popup_2509 iframe,
.popup_2509 svg,
.clean_45ac img {
  max-width: 100%;
  height: auto;
}

.popup_2509 p,
.popup_2509 li,
.popup_2509 .huge_9701,
.popup_2509 .surface_focused_a445,
.popup_2509 .link_yellow_a270 span:first-child {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.popup_2509 .link_yellow_a270 {
  align-items: flex-start !important;
}

.popup_2509 .link_yellow_a270 span:first-child {
  flex: 1 1 auto;
  min-width: 0;
}

.popup_2509 .tag-cc17 {
  flex-shrink: 0;
}

/* Horizontal scroll for wide tables */
.popup_2509 :is(
  div.hard-abbf,
  .message_11f4,
  .prev-d910,
  .outline_dim_cdc6,
  .text-e47e
) {
  overflow-x: auto !important;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

.popup_2509 :is(div.hard-abbf, .message_11f4, .prev-d910) table,
.popup_2509 .outline_dim_cdc6 table,
.popup_2509 .text-e47e table,
.popup_2509 table.fast_b017 {
  min-width: 32rem;
  width: max-content;
  max-width: none;
}

.popup_2509 table.hard-abbf {
  display: table;
}

/* Spec / definition rows: stack before content clips */
@media (max-width: 900px) {
  .popup_2509 .hero-last-e6a9 {
    grid-template-columns: 1fr !important;
  }

  .popup_2509 .link_over_9006 {
    border-right: none !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding: 0.65rem 0.85rem !important;
  }

  .popup_2509 .upper-71e9 {
    padding: 0.65rem 0.85rem !important;
  }

  .popup_2509 .west-5478 {
    grid-template-columns: 1fr !important;
    padding: 1.25rem !important;
    gap: 1.25rem !important;
    text-align: center;
  }

  .popup_2509 .middle-1e83 {
    margin-left: auto;
    margin-right: auto;
  }
}

/* Filter / chip bars — scroll instead of clipping */
.popup_2509 :is(.component_0aa8, .title_7883, .caption-copper-1442) {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.popup_2509 .box_old_27aa,
.popup_2509 .caption-copper-1442 {
  flex-wrap: nowrap;
  width: max-content;
  max-width: none;
}

@media (max-width: 768px) {
  html {
    scroll-padding-top: calc(var(--header-h-mobile) + 0.5rem);
  }

  .popup_2509 .box_old_27aa,
  .popup_2509 .caption-copper-1442 {
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
  }

  .popup_2509 .component_0aa8 {
    overflow-x: auto;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    padding: 0.85rem 1rem !important;
  }
}

footer {
  background: #0c1222 !important;
  max-width: 100%;
  overflow-x: clip;
}

footer > div {
  min-width: 0;
  max-width: 100%;
}

footer h1, footer h2, footer h3, footer h4, footer h5, footer h6 {
  color: #f1f5f9 !important;
}

footer img[width="40"] {
  width: 40px !important;
  height: 40px !important;
}

/* Tablet — collapse multi-column shells */
@media (max-width: 1024px) {
  .popup_2509 {
    grid-template-columns: 1fr !important;
  }

  .popup_2509 > * {
    grid-column: 1 / -1 !important;
    min-width: 0 !important;
  }

  body:has(nav a[href="instal.html"].fn-active-38ec) .popup_2509 > .carousel-c090 {
    border-left: none !important;
    padding-left: 0 !important;
  }

  body:has(nav a[href="aplikasi.html"].fn-active-38ec) .popup_2509 {
    column-count: 1 !important;
  }

  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(odd),
  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(even) {
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
  }

  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .slider_6eb2:nth-of-type(even) .north_8a97 {
    text-align: left !important;
  }

  body:has(nav a[href="resmi.html"].fn-active-38ec) .popup_2509 {
    grid-template-columns: 1fr !important;
  }
}

/* ========== Mobile layout system (overrides per-page embedded CSS) ========== */
@media (max-width: 768px) {
  html {
    overflow-x: hidden;
  }

  body {
    padding-top: var(--header-h-mobile) !important;
    overflow-x: hidden;
  }

  /* Fixed dark header + drawer nav */
  header.gallery_basic_816e,
  header#siteHeader {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 1000 !important;
    overflow: visible !important;
    background: linear-gradient(120deg, #0c1222 0%, #1e1b4b 42%, #134e4a 100%) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: 0 4px 20px rgb(15 23 42 / 0.45) !important;
  }

  header .pro_5598 {
    padding: 0.5rem 0.75rem !important;
    gap: 0.45rem !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    min-height: var(--header-h-mobile);
    position: relative;
  }

  header .wrapper-16cf {
    font-size: 0.9375rem !important;
    min-width: 0;
    flex: 0 1 auto;
    max-width: 42vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  header .text_static_0959 {
    display: flex !important;
    margin-left: auto !important;
    flex-shrink: 0;
  }

  header .thick_e412 {
    padding: 0.4rem 0.65rem !important;
    font-size: 0.6875rem !important;
    min-height: 2rem;
    line-height: 1.2;
  }

  header .button_tall_e188 {
    display: flex !important;
    flex-shrink: 0;
  }

  header .hovered_4f84,
  header #headerNav {
    display: none;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    margin: 0 !important;
    padding: 0.5rem 0.65rem 0.75rem !important;
    background: #1e293b !important;
    border-bottom: 1px solid #334155 !important;
    box-shadow: 0 14px 36px rgb(0 0 0 / 0.35) !important;
    max-height: min(72vh, 520px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    z-index: 1001 !important;
    -webkit-overflow-scrolling: touch;
  }

  header .hovered_4f84#headerNav[data-open="true"],
  header .hovered_4f84.image_30f4,
  header #headerNav[data-open="true"] {
    display: block !important;
  }

  header .hovered_4f84 .icon_22df,
  header #headerNav .icon_22df {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0.15rem !important;
    width: 100%;
  }

  header .hovered_4f84 .icon_22df li a,
  header #headerNav .icon_22df li a {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
    border-radius: 0.5rem !important;
    padding: 0.7rem 0.75rem !important;
    margin: 0 !important;
    font-size: 0.9375rem !important;
    color: #e2e8f0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border-bottom: 1px solid rgb(255 255 255 / 0.06) !important;
  }

  header .hovered_4f84 .icon_22df li a.fn-active-38ec,
  header #headerNav .icon_22df li a.fn-active-38ec {
    background: linear-gradient(135deg, var(--c-cyan-d), var(--c-violet)) !important;
    color: #fff !important;
    border-bottom-color: transparent !important;
  }

  header .hovered_4f84 .icon_22df li a::after,
  header #headerNav .icon_22df li a::after {
    display: none !important;
  }

  .feature_glass_6593[data-open="true"],
  .feature_glass_6593.image_30f4 {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 999 !important;
  }

  /* Hero */
  .clean_45ac,
  .red-139d {
    padding: 0.85rem 0.85rem 1rem !important;
  }

  .clean_45ac .panel-6e48,
  .clean_45ac h1 {
    font-size: clamp(1.35rem, 6vw, 1.85rem) !important;
  }

  .clean_45ac .tag_a1f7 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.45rem !important;
    padding: 0.65rem 0 0.5rem !important;
  }

  .clean_45ac .item_4e0a {
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100%;
  }

  .clean_45ac .item_4e0a .rough_8a3a,
  .clean_45ac .item_4e0a .wood-b9b5,
  .clean_45ac .complex-3c13 {
    width: 100% !important;
    justify-content: center;
    box-sizing: border-box;
  }

  body:has(nav a[href="apk.html"].fn-active-38ec) .clean_45ac .notice-huge-1895 {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .caption_1a13 {
    padding: 0.55rem 0.75rem !important;
  }

  .logo-lite-81e0 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
  }

  /* Main: single column feed */
  .popup_2509 {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0.85rem 0.85rem 1.5rem !important;
    gap: 0.85rem !important;
    box-sizing: border-box;
  }

  .popup_2509 > * {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .popup_2509 .north_8a97 {
    margin-bottom: 0.75rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
    text-align: left !important;
  }

  .popup_2509 .static-a070 {
    font-size: clamp(1.2rem, 5.2vw, 1.55rem) !important;
    line-height: 1.25 !important;
  }

  .popup_2509 .huge_9701 {
    font-size: 0.9375rem !important;
  }

  .popup_2509 .slider_6eb2 {
    padding: 1rem 0.9rem 1.1rem !important;
    margin-bottom: 0 !important;
  }

  .component-f660,
  .modal_fixed_c7be,
  .popup_2509 .component_0aa8 {
    position: static !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Sidebar / tools order */
  body:has(nav a[href="/"].fn-active-38ec) .popup_2509 > .component-f660,
  body:has(nav a[href="faq.html"].fn-active-38ec) .popup_2509 > .component-f660 {
    order: -1;
  }

  body:has(nav a[href="instal.html"].fn-active-38ec) .popup_2509 > .carousel-c090 {
    order: 1;
  }

  body:has(nav a[href="instal.html"].fn-active-38ec) .popup_2509 > .component-f660 {
    order: 2;
  }

  /* Grids → stack */
  .popup_2509 .message_437e,
  .popup_2509 .hover-dynamic-f320 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }

  .popup_2509 .row_d7db {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.45rem !important;
  }

  .popup_2509 .hovered_fc77 {
    padding: 0.75rem 0.65rem !important;
  }

  .popup_2509 .pagination-f645 {
    padding: 0.45rem 0.5rem !important;
    font-size: 0.8125rem !important;
  }

  /* Tables & long strings (mobile) */
  .popup_2509 :is(div.hard-abbf, .message_11f4, .prev-d910, .outline_dim_cdc6, .text-e47e) {
    width: 100%;
    max-width: 100%;
  }

  .popup_2509 :is(div.hard-abbf, .message_11f4, .prev-d910) table,
  .popup_2509 .outline_dim_cdc6 table,
  .popup_2509 .text-e47e table {
    min-width: 28rem;
    font-size: 0.8125rem !important;
  }

  .popup_2509 .hard-abbf th,
  .popup_2509 .hard-abbf td,
  .popup_2509 .fast_b017 th,
  .popup_2509 .fast_b017 td {
    padding: 0.5rem 0.55rem !important;
  }

  .popup_2509 .upper-71e9,
  .popup_2509 .hero-last-e6a9 .upper-71e9,
  .popup_2509 code,
  .popup_2509 pre {
    word-break: break-word;
    overflow-wrap: anywhere;
    font-size: 0.8125rem !important;
    white-space: pre-wrap;
  }

  /* Inline grids with large minmax() — force single column */
  .popup_2509 div[style*="minmax(350px"],
  .popup_2509 div[style*="minmax(300px"],
  .popup_2509 div[style*="minmax(280px"],
  .popup_2509 div[style*="minmax(250px"],
  footer div[style*="minmax(250px"],
  footer div[style*="minmax(200px"] {
    grid-template-columns: 1fr !important;
  }

  .popup_2509 div[style*="display: flex"][style*="space-between"] {
    flex-wrap: wrap !important;
    gap: 0.75rem !important;
  }

  /* Pembaruan timeline rail */
  body:has(nav a[href="pembaruan.html"].fn-active-38ec) .popup_2509 {
    padding-left: 0.85rem !important;
    border-left-width: 3px !important;
  }

  body:has(nav a[href="pembaruan.html"].fn-active-38ec) .popup_2509 .slider_6eb2::before {
    left: -0.72rem;
    width: 10px;
    height: 10px;
  }

  body:has(nav a[href="tentang-kami.html"].fn-active-38ec) .popup_2509 .module-orange-cba2 {
    padding: 1.15rem !important;
  }

  /* Inline padded cards inside sections */
  .popup_2509 div[style*="padding: 3rem"],
  .popup_2509 div[style*="padding: 2.5rem"] {
    padding: 1.1rem !important;
  }

  img[height="500"] {
    height: 150px !important;
    width: 100% !important;
    object-fit: cover;
  }

  footer .pro_5598,
  footer > div > div[style*="display: flex"] {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0.75rem !important;
  }
}

@media (max-width: 480px) {
  header .wrapper-16cf {
    max-width: 38vw;
    font-size: 0.875rem !important;
  }

  .clean_45ac .tag_a1f7,
  .popup_2509 .row_d7db {
    grid-template-columns: 1fr !important;
  }

  .logo-lite-81e0 {
    grid-template-columns: 1fr !important;
  }

  .popup_2509 {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
  }
}