/* ---- base ---- */
/* =====================================================================
   Bandar Gadai · main.css (dibangun dari assets/css/src: base + atoms + components)
   Token: green-900 #0B3B22, green-950 #072A18, green-700 #1B6B35, lime-500 #8CC63F,
   lime-400 #A3D65C, lime-100 #E8F4D6, lime-200 #CFE8B4, cream-50 #FBF8F1, cream-0 #FFFDF8,
   cream-100 #F7F2E7, border #E6DECB / #D9CFB8, muted #4A5B55 / #5B6B65, merah logo #D7262E (aksen kecil saja).
   Atom = satu deklarasi dari referensi desain (nama: singkatan-nilai, "n" = negatif, "x…" = hash nilai panjang).
   ===================================================================== */

:root {
  --g900:#0B3B22; --g950:#072A18; --g700:#1B6B35; --lime:#8CC63F; --lime400:#A3D65C; --lime100:#E8F4D6; --lime200:#CFE8B4;
  --cream50:#FBF8F1; --cream0:#FFFDF8; --cream100:#F7F2E7; --line:#E6DECB; --line2:#D9CFB8; --muted:#4A5B55; --muted2:#5B6B65; --red:#D7262E;
}
*, *::before, *::after { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:90px; -webkit-text-size-adjust:100%; }
body { margin:0; background:#FBF8F1; color:#0B3B22; font-family:'Plus Jakarta Sans', system-ui, sans-serif; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img, svg { max-width:100%; }
a { color:#1B6B35; text-decoration:none; }
/* :where() = spesifisitas 0, supaya warna dari kelas atom tetap menang (seperti style inline di desain). */
a:where(:hover) { color:#0B3B22; }
input[type=range] { accent-color:#1B6B35; width:100%; }
button { font:inherit; }
[hidden] { display:none !important; }
:focus-visible { outline:3px solid rgba(140,198,63,.7); outline-offset:2px; }
@keyframes bgFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-10px); } }
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }

.gd-skip { position:absolute; left:16px; top:-60px; z-index:100; background:#8CC63F; color:#0B3B22; padding:12px 18px; border-radius:999px; font-weight:700; }
.gd-skip:focus { top:12px; color:#0B3B22; }
.gd-sr { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ---- atoms ---- */
.anim-x8cd778{animation:bgFloat 6s ease-in-out infinite}
.anim-xd745c1{animation:bgFloat 7s ease-in-out infinite}
.bg-072a18{background:#072A18}
.bg-0b3b22{background:#0B3B22}
.bg-1b6b35{background:#1B6B35}
.bg-8cc63f{background:#8CC63F}
.bg-9fe3cc{background:#9FE3CC}
.bg-cfe8b4{background:#CFE8B4}
.bg-d7262e{background:#D7262E}
.bg-dce9df{background:#DCE9DF}
.bg-e8f4d6{background:#E8F4D6}
.bg-f7f2e7{background:#F7F2E7}
.bg-fffdf8{background:#FFFDF8}
.bg-ffffff{background:#FFFFFF}
.bg-none{background:none}
.bg-rgba-11-59-34-0-94{background:rgba(11,59,34,0.94)}
.bg-rgba-140-198-63-0-18{background:rgba(140,198,63,0.18)}
.bg-rgba-247-242-231-0-08{background:rgba(247,242,231,0.08)}
.bg-rgba-255-255-255-0-3{background:rgba(255,255,255,0.3)}
.bg-rgba-255-255-255-0-35{background:rgba(255,255,255,0.35)}
.bg-transparent{background:transparent}
.bg-x9fd1d9{background:radial-gradient(circle at 70% 75%, #1B6B35 0 28%, transparent 28.5%)}
.b-0{border:0}
.b-1-5px-solid-0b3b22{border:1.5px solid #0B3B22}
.b-1-5px-solid-d9cfb8{border:1.5px solid #D9CFB8}
.b-1px-solid-e6decb{border:1px solid #E6DECB}
.b-2px-solid-8cc63f{border:2px solid #8CC63F}
.b-4px-solid-fffdf8{border:4px solid #FFFDF8}
.b-6px-solid-fbf8f1{border:6px solid #FBF8F1}
.b-x490101{border:1px solid rgba(140,198,63,0.45)}
.b-xa111e7{border:1.5px solid rgba(247,242,231,0.35)}
.b-xb499e1{border:1.5px solid rgba(247,242,231,0.3)}
.b-xd51737{border:1px solid rgba(247,242,231,0.18)}
.r-10px{border-radius:10px}
.r-11px{border-radius:11px}
.r-12px{border-radius:12px}
.r-14px{border-radius:14px}
.r-16px{border-radius:16px}
.r-18px{border-radius:18px}
.r-20px{border-radius:20px}
.r-22px{border-radius:22px}
.r-24px{border-radius:24px}
.r-28px{border-radius:28px}
.r-32px{border-radius:32px}
.r-36px{border-radius:36px}
.r-50{border-radius:50%}
.r-8px{border-radius:8px}
.r-999px{border-radius:999px}
.fx-1{flex:1}
.fx-1-1-160px{flex:1 1 160px}
.fx-1-1-240px{flex:1 1 240px}
.fx-1-1-260px{flex:1 1 260px}
.fx-1-1-300px{flex:1 1 300px}
.fx-999-1-560px{flex:999 1 560px}
.inset-0{inset:0}
.m-0{margin:0}
.m-0-0-10px{margin:0 0 10px}
.m-0-auto{margin:0 auto}
.m-18px-0-0{margin:18px 0 0}
.m-n1px-auto-0{margin:-1px auto 0}
.m-n8px-0-0{margin:-8px 0 0}
.ol-none{outline:none}
.ov-auto{overflow:auto}
.ov-hidden{overflow:hidden}
.p-0-10px-10px{padding:0 10px 10px}
.p-0-24px{padding:0 24px}
.p-0-24px-96px{padding:0 24px 96px}
.p-0-50px-24px-0{padding:0 50px 24px 0}
.p-0-72px-24px-24px{padding:0 72px 24px 24px}
.p-104px-24px{padding:104px 24px}
.p-104px-24px-0{padding:104px 24px 0}
.p-104px-24px-24px{padding:104px 24px 24px}
.p-104px-24px-56px{padding:104px 24px 56px}
.p-10px{padding:10px}
.p-10px-0{padding:10px 0}
.p-10px-16px{padding:10px 16px}
.p-10px-20px{padding:10px 20px}
.p-112px-24px{padding:112px 24px}
.p-112px-24px-56px{padding:112px 24px 56px}
.p-112px-24px-96px{padding:112px 24px 96px}
.p-11px-0{padding:11px 0}
.p-11px-18px{padding:11px 18px}
.p-11px-20px{padding:11px 20px}
.p-12px-0{padding:12px 0}
.p-12px-10px-0{padding:12px 10px 0}
.p-12px-14px{padding:12px 14px}
.p-12px-18px{padding:12px 18px}
.p-12px-20px{padding:12px 20px}
.p-12px-20px-12px-12px{padding:12px 20px 12px 12px}
.p-12px-22px{padding:12px 22px}
.p-12px-32px-24px{padding:12px 32px 24px}
.p-13px-10px{padding:13px 10px}
.p-13px-22px{padding:13px 22px}
.p-14px-0{padding:14px 0}
.p-14px-16px{padding:14px 16px}
.p-14px-18px{padding:14px 18px}
.p-14px-22px{padding:14px 22px}
.p-14px-24px{padding:14px 24px}
.p-14px-32px{padding:14px 32px}
.p-15px-24px{padding:15px 24px}
.p-15px-26px{padding:15px 26px}
.p-16px{padding:16px}
.p-16px-14px{padding:16px 14px}
.p-16px-18px{padding:16px 18px}
.p-16px-22px{padding:16px 22px}
.p-16px-26px{padding:16px 26px}
.p-17px-26px{padding:17px 26px}
.p-18px-20px{padding:18px 20px}
.p-18px-24px{padding:18px 24px}
.p-18px-28px{padding:18px 28px}
.p-18px-30px{padding:18px 30px}
.p-20px{padding:20px}
.p-20px-16px{padding:20px 16px}
.p-20px-22px{padding:20px 22px}
.p-20px-28px{padding:20px 28px}
.p-22px{padding:22px}
.p-22px-0{padding:22px 0}
.p-22px-16px{padding:22px 16px}
.p-22px-24px{padding:22px 24px}
.p-22px-28px{padding:22px 28px}
.p-24px{padding:24px}
.p-24px-24px-104px{padding:24px 24px 104px}
.p-24px-26px-28px{padding:24px 26px 28px}
.p-26px{padding:26px}
.p-28px{padding:28px}
.p-30px{padding:30px}
.p-32px{padding:32px}
.p-36px{padding:36px}
.p-3px-9px{padding:3px 9px}
.p-40px-24px-104px{padding:40px 24px 104px}
.p-44px{padding:44px}
.p-48px-24px-0{padding:48px 24px 0}
.p-48px-24px-104px{padding:48px 24px 104px}
.p-56px-24px-0{padding:56px 24px 0}
.p-56px-24px-112px{padding:56px 24px 112px}
.p-56px-24px-40px{padding:56px 24px 40px}
.p-56px-24px-64px{padding:56px 24px 64px}
.p-56px-24px-72px{padding:56px 24px 72px}
.p-56px-24px-80px{padding:56px 24px 80px}
.p-56px-24px-88px{padding:56px 24px 88px}
.p-56px-24px-96px{padding:56px 24px 96px}
.p-64px-24px-104px{padding:64px 24px 104px}
.p-64px-24px-36px{padding:64px 24px 36px}
.p-64px-24px-48px{padding:64px 24px 48px}
.p-6px{padding:6px}
.p-6px-0{padding:6px 0}
.p-6px-10px{padding:6px 10px}
.p-6px-12px{padding:6px 12px}
.p-6px-14px{padding:6px 14px}
.p-72px-24px-104px{padding:72px 24px 104px}
.p-72px-24px-96px{padding:72px 24px 96px}
.p-80px-24px-104px{padding:80px 24px 104px}
.p-88px-24px-40px{padding:88px 24px 40px}
.p-88px-24px-96px{padding:88px 24px 96px}
.p-8px-0{padding:8px 0}
.p-8px-14px{padding:8px 14px}
.p-8px-24px{padding:8px 24px}
.p-8px-8px-8px-22px{padding:8px 8px 8px 22px}
.p-96px-24px{padding:96px 24px}
.p-96px-24px-48px{padding:96px 24px 48px}
.p-96px-24px-56px{padding:96px 24px 56px}
.p-9px-10px{padding:9px 10px}
.p-9px-15px{padding:9px 15px}
.p-9px-16px{padding:9px 16px}
.p-clamp-24px-3-5vw-36px{padding:clamp(24px,3.5vw,36px)}
.p-clamp-24px-3-5vw-40px{padding:clamp(24px,3.5vw,40px)}
.p-clamp-24px-4vw-44px{padding:clamp(24px,4vw,44px)}
.p-clamp-26px-3-5vw-36px{padding:clamp(26px,3.5vw,36px)}
.p-clamp-28px-4vw-40px{padding:clamp(28px,4vw,40px)}
.p-clamp-28px-4vw-44px{padding:clamp(28px,4vw,44px)}
.p-clamp-28px-4vw-48px{padding:clamp(28px,4vw,48px)}
.p-clamp-32px-5vw-56px{padding:clamp(32px,5vw,56px)}
.p-clamp-32px-5vw-64px{padding:clamp(32px,5vw,64px)}
.p-clamp-40px-6vw-72px{padding:clamp(40px,6vw,72px)}
.td-underline{text-decoration:underline}
.acc-1b6b35{accent-color:#1B6B35}
.ai-baseline{align-items:baseline}
.ai-center{align-items:center}
.ai-end{align-items:end}
.ai-flex-start{align-items:flex-start}
.ai-start{align-items:start}
.as-flex-start{align-self:flex-start}
.animation-delay-n3s{animation-delay:-3s}
.ar-1-1{aspect-ratio:1/1}
.ar-4-3{aspect-ratio:4/3}
.ar-4-5{aspect-ratio:4/5}
.bf-blur-10px{backdrop-filter:blur(10px)}
.bb-1px-solid-d9cfb8{border-bottom:1px solid #D9CFB8}
.bb-2px-solid-8cc63f{border-bottom:2px solid #8CC63F}
.bb-x92c7ee{border-bottom:1px solid rgba(247,242,231,0.08)}
.bl-xddff09{border-left:1px solid rgba(247,242,231,0.14)}
.bt-1px-solid-d9cfb8{border-top:1px solid #D9CFB8}
.bt-1px-solid-e6decb{border-top:1px solid #E6DECB}
.bt-1px-solid-efe8d8{border-top:1px solid #EFE8D8}
.bt-3px-solid-1b6b35{border-top:3px solid #1B6B35}
.bt-3px-solid-8cc63f{border-top:3px solid #8CC63F}
.bt-x3a1ffb{border-top:1px solid rgba(247,242,231,0.12)}
.bt-x7b9233{border-top:1px solid rgba(247,242,231,0.1)}
.bt-xddff09{border-top:1px solid rgba(247,242,231,0.14)}
.bot-24px{bottom:24px}
.bot-28px{bottom:28px}
.bot-n140px{bottom:-140px}
.bot-n160px{bottom:-160px}
.bot-n220px{bottom:-220px}
.bot-n260px{bottom:-260px}
.bot-n28px{bottom:-28px}
.bot-n300px{bottom:-300px}
.bot-n90px{bottom:-90px}
.sh-x5bc0e4{box-shadow:0 14px 30px -12px rgba(0,0,0,0.5)}
.sh-x6a6b1b{box-shadow:0 40px 80px -30px rgba(0,0,0,0.55)}
.sh-x7fe0a6{box-shadow:0 24px 48px -24px rgba(11,59,34,0.5)}
.sh-x9a27ab{box-shadow:0 20px 40px -20px rgba(0,0,0,0.5)}
.sh-xf0aaef{box-shadow:0 30px 60px -20px rgba(0,0,0,0.45)}
.c-0b3b22{color:#0B3B22}
.c-1b6b35{color:#1B6B35}
.c-2c3f38{color:#2C3F38}
.c-4a5b55{color:#4A5B55}
.c-5b6b65{color:#5B6B65}
.c-8cc63f{color:#8CC63F}
.c-b5e07a{color:#B5E07A}
.c-d7262e{color:#D7262E}
.c-f7f2e7{color:#F7F2E7}
.c-fffdf8{color:#FFFDF8}
.c-ffffff{color:#FFFFFF}
.c-rgba-247-242-231-0-65{color:rgba(247,242,231,0.65)}
.c-rgba-247-242-231-0-7{color:rgba(247,242,231,0.7)}
.c-rgba-247-242-231-0-75{color:rgba(247,242,231,0.75)}
.c-rgba-247-242-231-0-78{color:rgba(247,242,231,0.78)}
.c-rgba-247-242-231-0-8{color:rgba(247,242,231,0.8)}
.c-rgba-247-242-231-0-85{color:rgba(247,242,231,0.85)}
.cur-pointer{cursor:pointer}
.d-block{display:block}
.d-flex{display:flex}
.d-grid{display:grid}
.fd-column{flex-direction:column}
.fxs-0{flex-shrink:0}
.fxw-nowrap{flex-wrap:nowrap}
.fxw-wrap{flex-wrap:wrap}
.ff-archivo-sans-serif{font-family:'Archivo',sans-serif}
.ff-bricolage-grotesque{font-family:'Bricolage Grotesque'}
.ff-inherit{font-family:inherit}
.ff-plus-jakarta-sans{font-family:'Plus Jakarta Sans'}
.fs-12-5px{font-size:12.5px}
.fs-13-5px{font-size:13.5px}
.fs-13px{font-size:13px}
.fs-14-5px{font-size:14.5px}
.fs-14px{font-size:14px}
.fs-15-5px{font-size:15.5px}
.fs-15px{font-size:15px}
.fs-16-5px{font-size:16.5px}
.fs-16px{font-size:16px}
.fs-17-5px{font-size:17.5px}
.fs-17px{font-size:17px}
.fs-18px{font-size:18px}
.fs-19px{font-size:19px}
.fs-20px{font-size:20px}
.fs-21px{font-size:21px}
.fs-22px{font-size:22px}
.fs-24px{font-size:24px}
.fs-26px{font-size:26px}
.fs-28px{font-size:28px}
.fs-44px{font-size:44px}
.fs-64px{font-size:64px}
.fs-9-5px{font-size:9.5px}
.fs-clamp-17px-1-5vw-20px{font-size:clamp(17px,1.5vw,20px)}
.fs-clamp-17px-1-6vw-20px{font-size:clamp(17px,1.6vw,20px)}
.fs-clamp-20px-2-2vw-28px{font-size:clamp(20px,2.2vw,28px)}
.fs-clamp-20px-2-4vw-26px{font-size:clamp(20px,2.4vw,26px)}
.fs-clamp-22px-2-2vw-28px{font-size:clamp(22px,2.2vw,28px)}
.fs-clamp-26px-2-8vw-34px{font-size:clamp(26px,2.8vw,34px)}
.fs-clamp-28px-3-2vw-40px{font-size:clamp(28px,3.2vw,40px)}
.fs-clamp-28px-3-4vw-44px{font-size:clamp(28px,3.4vw,44px)}
.fs-clamp-28px-3vw-38px{font-size:clamp(28px,3vw,38px)}
.fs-clamp-30px-3-4vw-40px{font-size:clamp(30px,3.4vw,40px)}
.fs-clamp-30px-3-6vw-44px{font-size:clamp(30px,3.6vw,44px)}
.fs-clamp-32px-3-8vw-48px{font-size:clamp(32px,3.8vw,48px)}
.fs-clamp-34px-4-4vw-56px{font-size:clamp(34px,4.4vw,56px)}
.fs-clamp-34px-4-6vw-60px{font-size:clamp(34px,4.6vw,60px)}
.fs-clamp-36px-4-6vw-58px{font-size:clamp(36px,4.6vw,58px)}
.fs-clamp-36px-4-6vw-60px{font-size:clamp(36px,4.6vw,60px)}
.fs-clamp-36px-5vw-64px{font-size:clamp(36px,5vw,64px)}
.fs-clamp-38px-4-4vw-54px{font-size:clamp(38px,4.4vw,54px)}
.fs-clamp-42px-6vw-76px{font-size:clamp(42px,6vw,76px)}
.fs-clamp-42px-6vw-80px{font-size:clamp(42px,6vw,80px)}
.fs-clamp-44px-6-4vw-84px{font-size:clamp(44px,6.4vw,84px)}
.fs-clamp-48px-5vw-64px{font-size:clamp(48px,5vw,64px)}
.fst-104{font-stretch:104%}
.fvn-tabular-nums{font-variant-numeric:tabular-nums}
.fw-500{font-weight:500}
.fw-600{font-weight:600}
.fw-700{font-weight:700}
.fw-800{font-weight:800}
.fw-900{font-weight:900}
.g-0{gap:0}
.g-10px{gap:10px}
.g-10px-34px{gap:10px 34px}
.g-12px{gap:12px}
.g-12px-28px{gap:12px 28px}
.g-14px{gap:14px}
.g-14px-16px{gap:14px 16px}
.g-16px{gap:16px}
.g-18px{gap:18px}
.g-20px{gap:20px}
.g-20px-40px{gap:20px 40px}
.g-22px{gap:22px}
.g-24px{gap:24px}
.g-26px{gap:26px}
.g-28px{gap:28px}
.g-28px-32px{gap:28px 32px}
.g-2px{gap:2px}
.g-2px-16px{gap:2px 16px}
.g-32px{gap:32px}
.g-36px{gap:36px}
.g-3px{gap:3px}
.g-40px{gap:40px}
.g-44px{gap:44px}
.g-48px{gap:48px}
.g-4px{gap:4px}
.g-56px{gap:56px}
.g-5px{gap:5px}
.g-64px{gap:64px}
.g-6px{gap:6px}
.g-6px-20px{gap:6px 20px}
.g-6px-8px{gap:6px 8px}
.g-8px{gap:8px}
.gc-1-1{grid-column:1/-1}
.gc-span-1{grid-column:span 1}
.gtc-1fr-auto{grid-template-columns:1fr auto}
.gtc-repeat-2-1fr{grid-template-columns:repeat(2,1fr)}
.gtc-repeat-2-minmax-0-1fr{grid-template-columns:repeat(2,minmax(0,1fr))}
.gtc-repeat-3-minmax-0-1fr{grid-template-columns:repeat(3,minmax(0,1fr))}
.gtc-repeat-4-minmax-0-1fr{grid-template-columns:repeat(4,minmax(0,1fr))}
.gtc-repeat-5-minmax-0-1fr{grid-template-columns:repeat(5,minmax(0,1fr))}
.gtc-x009f0f{grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr))}
.gtc-x13ba7b{grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr))}
.gtc-x282c8c{grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr))}
.gtc-x2b4de1{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.gtc-x4a70e0{grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr))}
.gtc-x5c5698{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.gtc-x62177f{grid-template-columns:minmax(220px,1.4fr) repeat(4,1fr)}
.gtc-x6937ee{grid-template-columns:1.3fr repeat(4,minmax(0,1fr))}
.gtc-x70da47{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.gtc-x717d8f{grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr))}
.gtc-x8b2172{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
.gtc-x8cc996{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.gtc-xa4e25e{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.gtc-xd67959{grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr))}
.gtc-xd9760d{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.gtc-xde5966{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.gtc-xe2bcb8{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.gtc-xe72dc4{grid-template-columns:minmax(200px,1.2fr) minmax(0,1fr) minmax(0,1.6fr)}
.gtc-xf30db0{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.gtc-xf7954f{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}
.h-100{height:100%}
.h-12px{height:12px}
.h-150px{height:150px}
.h-200px{height:200px}
.h-220px{height:220px}
.h-22px{height:22px}
.h-240px{height:240px}
.h-26px{height:26px}
.h-2px{height:2px}
.h-340px{height:340px}
.h-34px{height:34px}
.h-36px{height:36px}
.h-380px{height:380px}
.h-3px{height:3px}
.h-40px{height:40px}
.h-420px{height:420px}
.h-42px{height:42px}
.h-44px{height:44px}
.h-46px{height:46px}
.h-4px{height:4px}
.h-560px{height:560px}
.h-620px{height:620px}
.h-72{height:72%}
.h-84px{height:84px}
.h-8px{height:8px}
.h-auto{height:auto}
.h-clamp-220px-34vw-380px{height:clamp(220px,34vw,380px)}
.jc-center{justify-content:center}
.jc-space-between{justify-content:space-between}
.left-20px{left:20px}
.left-24px{left:24px}
.left-50{left:50%}
.left-n120px{left:-120px}
.left-n18px{left:-18px}
.left-n90px{left:-90px}
.ls-04em{letter-spacing:.04em}
.ls-06em{letter-spacing:.06em}
.ls-16em{letter-spacing:.16em}
.ls-2em{letter-spacing:.2em}
.ls-n0-015em{letter-spacing:-0.015em}
.ls-n0-01em{letter-spacing:-0.01em}
.ls-n0-025em{letter-spacing:-0.025em}
.ls-n0-02em{letter-spacing:-0.02em}
.ls-n0-035em{letter-spacing:-0.035em}
.ls-n0-03em{letter-spacing:-0.03em}
.lh-1{line-height:1}
.lh-1-02{line-height:1.02}
.lh-1-05{line-height:1.05}
.lh-1-1{line-height:1.1}
.lh-1-2{line-height:1.2}
.lh-1-5{line-height:1.5}
.lh-1-55{line-height:1.55}
.lh-1-6{line-height:1.6}
.lh-1-65{line-height:1.65}
.lh-1-7{line-height:1.7}
.lh-1-75{line-height:1.75}
.lh-8{line-height:.8}
.lh-85{line-height:.85}
.lh-9{line-height:.9}
.lh-98{line-height:.98}
.mb-4px{margin-bottom:4px}
.ml-6px{margin-left:6px}
.mt-12px{margin-top:12px}
.mt-18px{margin-top:18px}
.mt-2px{margin-top:2px}
.mt-40px{margin-top:40px}
.mt-6px{margin-top:6px}
.mt-8px{margin-top:8px}
.mt-9px{margin-top:9px}
.mt-auto{margin-top:auto}
.mt-n1px{margin-top:-1px}
.mh-560px{max-height:560px}
.mh-75vh{max-height:75vh}
.mw-100{max-width:100%}
.mw-1040px{max-width:1040px}
.mw-1240px{max-width:1240px}
.mw-1280px{max-width:1280px}
.mw-1320px{max-width:1320px}
.mw-280px{max-width:280px}
.mw-380px{max-width:380px}
.mw-400px{max-width:400px}
.mw-420px{max-width:420px}
.mw-460px{max-width:460px}
.mw-520px{max-width:520px}
.mw-560px{max-width:560px}
.mw-600px{max-width:600px}
.mw-620px{max-width:620px}
.mw-640px{max-width:640px}
.mw-680px{max-width:680px}
.mw-700px{max-width:700px}
.mw-720px{max-width:720px}
.mw-880px{max-width:880px}
.mw-900px{max-width:900px}
.mih-320px{min-height:320px}
.mih-340px{min-height:340px}
.mih-480px{min-height:480px}
.miw-0{min-width:0}
.miw-290px{min-width:290px}
.miw-560px{min-width:560px}
.miw-640px{min-width:640px}
.miw-720px{min-width:720px}
.miw-760px{min-width:760px}
.of-cover{object-fit:cover}
.op-07{opacity:.07}
.op-14{opacity:.14}
.op-45{opacity:.45}
.op-7{opacity:.7}
.op-75{opacity:.75}
.op-85{opacity:.85}
.op-9{opacity:.9}
.ovx-auto{overflow-x:auto}
.ovy-auto{overflow-y:auto}
.pb-22px{padding-bottom:22px}
.pb-3px{padding-bottom:3px}
.pb-4px{padding-bottom:4px}
.pl-28px{padding-left:28px}
.pl-32px{padding-left:32px}
.pr-20px{padding-right:20px}
.pt-10px{padding-top:10px}
.pt-12px{padding-top:12px}
.pt-14px{padding-top:14px}
.pt-18px{padding-top:18px}
.pt-20px{padding-top:20px}
.pt-24px{padding-top:24px}
.pt-6px{padding-top:6px}
.pt-8px{padding-top:8px}
.pe-none{pointer-events:none}
.pos-absolute{position:absolute}
.pos-relative{position:relative}
.pos-sticky{position:sticky}
.rsz-vertical{resize:vertical}
.right-120px{right:120px}
.right-36px{right:36px}
.right-n120px{right:-120px}
.right-n12px{right:-12px}
.right-n140px{right:-140px}
.right-n14px{right:-14px}
.right-n160px{right:-160px}
.right-n40px{right:-40px}
.right-n60px{right:-60px}
.right-n70px{right:-70px}
.right-n80px{right:-80px}
.right-n90px{right:-90px}
.smt-100px{scroll-margin-top:100px}
.smt-70px{scroll-margin-top:70px}
.smt-90px{scroll-margin-top:90px}
.smt-96px{scroll-margin-top:96px}
.sbw-none{scrollbar-width:none}
.ta-center{text-align:center}
.ta-left{text-align:left}
.ta-right{text-align:right}
.tt-uppercase{text-transform:uppercase}
.tw-balance{text-wrap:balance}
.tw-pretty{text-wrap:pretty}
.top-0{top:0}
.top-100{top:100%}
.top-20px{top:20px}
.top-50{top:50%}
.top-96px{top:96px}
.top-n130px{top:-130px}
.top-n160px{top:-160px}
.top-n200px{top:-200px}
.top-n22px{top:-22px}
.top-n60px{top:-60px}
.top-n62px{top:-62px}
.top-n70px{top:-70px}
.tf-rotate-n6deg{transform:rotate(-6deg)}
.tf-translate-n50-100{transform:translate(-50%,-100%)}
.ws-normal{white-space:normal}
.ws-nowrap{white-space:nowrap}
.w-100{width:100%}
.w-12px{width:12px}
.w-220px{width:220px}
.w-22px{width:22px}
.w-240px{width:240px}
.w-26px{width:26px}
.w-340px{width:340px}
.w-34px{width:34px}
.w-36px{width:36px}
.w-380px{width:380px}
.w-40px{width:40px}
.w-420px{width:420px}
.w-42px{width:42px}
.w-44{width:44%}
.w-44px{width:44px}
.w-46px{width:46px}
.w-4px{width:4px}
.w-560px{width:560px}
.w-60px{width:60px}
.w-620px{width:620px}
.w-72{width:72%}
.w-84px{width:84px}
.w-8px{width:8px}
.w-auto{width:auto}
.z-2{z-index:2}
.z-20{z-index:20}
.z-3{z-index:3}
.z-40{z-index:40}
.fc-bc-1b6b35:focus,.fc-bc-1b6b35:focus-within{border-color:#1B6B35}
.hv-bg-0b3b22:hover{background:#0B3B22}
.hv-bg-1b6b35:hover{background:#1B6B35}
.hv-bg-a3d65c:hover{background:#A3D65C}
.hv-bg-e8f4d6:hover{background:#E8F4D6}
.hv-bg-f2ecdd:hover{background:#F2ECDD}
.hv-bg-rgba-255-255-255-0-35:hover{background:rgba(255,255,255,0.35)}
.hv-bc-1b6b35:hover{border-color:#1B6B35}
.hv-bc-8cc63f:hover{border-color:#8CC63F}
.hv-bc-f7f2e7:hover{border-color:#F7F2E7}
.hv-sh-xccfe59:hover{box-shadow:0 24px 40px -24px rgba(11,59,34,0.35)}
.hv-sh-xe82984:hover{box-shadow:0 30px 60px -30px rgba(11,59,34,0.35)}
.hv-c-0b3b22:hover{color:#0B3B22}
.hv-c-8cc63f:hover{color:#8CC63F}
.hv-c-f7f2e7:hover{color:#F7F2E7}
.hv-c-fffdf8:hover{color:#FFFDF8}
.hv-tf-translatey-n3px:hover{transform:translateY(-3px)}
.hv-tf-translatey-n4px:hover{transform:translateY(-4px)}

/* ---- components ---- */
/* =====================================================================
   Komponen & state (pengganti nilai dinamis {{ }} di referensi desain)
   ===================================================================== */

/* Header: nav penuh >= 1280px, hamburger di bawahnya; teks tombol WA hilang < 560px */
.gd-burger, .gd-burger-spacer { display:none !important; }
.gd-burger-close { display:none; }
.gd-burger[aria-expanded="true"] .gd-burger-open { display:none; }
.gd-burger[aria-expanded="true"] .gd-burger-close { display:inline; }
@media (max-width:1279.98px) {
  .gd-nav { display:none !important; }
  .gd-burger { display:flex !important; }
  .gd-burger-spacer { display:block !important; }
}
@media (min-width:1280px) { #bg-mobile { display:none !important; } }
@media (max-width:559.98px) {
  .gd-wa-text { display:none; }
  /* Layar sempit: header dirapatkan agar logo, menu, dan tombol WA muat tanpa geser ke samping. */
  .gd-header > div:first-child { padding:12px 16px; gap:10px; }
  .gd-wa-btn { padding:11px 13px; }
}

/* Chip pilihan (kategori, kadar, berat, outlet): aktif = hijau tua */
.gd-chip { border:1.5px solid #D9CFB8; background:#FFFDF8; color:#0B3B22; transition:background-color .15s, border-color .15s, color .15s; }
.gd-chip:hover { border-color:#1B6B35; }
.gd-chip.is-on { border-color:#0B3B22; background:#0B3B22; color:#F7F2E7; }
/* Varian lime (tenor, topik, kategori pengaduan) */
.gd-chip--lime.is-on { border-color:#8CC63F; background:#8CC63F; color:#0B3B22; }

/* Tab berbentuk pil (Produk, Kontak, Artikel) */
.gd-tab { background:transparent; color:#0B3B22; }
.gd-tab:hover { color:#1B6B35; }
.gd-tab.is-on, .gd-tab.is-on:hover { background:#0B3B22; color:#F7F2E7; }

/* Pil produk di hero Produk Gadai */
.gd-heropill { background:#0B3B22; color:#F7F2E7; border:1.5px solid rgba(247,242,231,0.35); }
.gd-heropill:hover { color:#F7F2E7; }
.gd-heropill.is-on, .gd-heropill.is-on:hover { background:#F7F2E7; color:#0B3B22; border-color:#F7F2E7; }

/* Kartu yang naik saat hover */
.gd-lift { transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }

/* FAQ */
.gd-faq-ic { background:#E8F4D6; color:#0B3B22; transition:background-color .15s, color .15s; }
.gd-faq-q[aria-expanded="true"] .gd-faq-ic { background:#0B3B22; color:#8CC63F; }
.gd-faq-ic--home { background:#F2ECDD; }
.gd-faq-q[aria-expanded="true"] .gd-faq-ic--home { color:#E3B04B; }
.gd-faq-item { border:1px solid #E6DECB; }
.gd-faq-item.is-open { border-color:#1B6B35; }
.gd-cat { border:1px solid #E6DECB; background:#FFFDF8; color:#0B3B22; }
.gd-cat.is-on { border-color:#0B3B22; background:#0B3B22; color:#F7F2E7; }
.gd-cat-badge { background:#E8F4D6; color:#0B3B22; }
.gd-cat.is-on .gd-cat-badge { background:#8CC63F; }

/* Kolom samping lengket hanya >= 900px */
.gd-sticky900 { position:static; }
@media (min-width:900px) { .gd-sticky900 { position:sticky; } }

/* Hasil simulasi */
.gd-row-v { font-weight:700; color:#F7F2E7; font-size:15.5px; }
.gd-row-v--total { font-weight:800; color:#8CC63F; font-size:18px; }

/* Tabel (perbandingan, tarif, tebus, angsuran BPKB) */
.gd-tbl { border-collapse:collapse; border-spacing:0; }
.gd-tbl--fixed { table-layout:fixed; }
:where(.gd-tbl) th { text-align:left; font-weight:inherit; vertical-align:top; }
:where(.gd-tbl) td { vertical-align:top; }
.gd-tbl tr.is-on > * { background:#F4FAEC; }
.gd-fid td, .gd-fid tbody th { background:#FFFDF8; transition:background-color .12s; }
.gd-fid-h { background:#0B3B22; color:#F7F2E7; }
.gd-fid-h.is-on { background:#8CC63F; color:#0B3B22; }
.gd-fid tr.is-row > *, .gd-fid td.is-col { background:#E8F4D6; }
.gd-fid tr.is-row td.is-col { background:#8CC63F; font-weight:800; }
.gd-fid-btn { background:transparent; }
.gd-fid-btn:hover { color:#1B6B35; }
.d-contents { display:contents; }

/* Garis waktu Cara Gadai */
.gd-ring-1b6b35 { box-shadow:0 0 0 2px #1B6B35; }
.gd-ring-0b3b22 { box-shadow:0 0 0 2px #0B3B22; }
.gd-ring-d7262e { box-shadow:0 0 0 2px #D7262E; }
.b-1px-solid-0b3b22 { border:1px solid #0B3B22; }
.lst-none { list-style:none; }
.bg-f3cf7a { background:#F3CF7A; }
.h-72 { height:72%; }

/* Isi artikel (Detail Artikel) */
.gd-prose > * { margin:0; }
.gd-prose p { font-size:18px; line-height:1.75; color:#2C3F38; text-wrap:pretty; }
.gd-prose h2 { margin:18px 0 0; font-family:'Bricolage Grotesque', sans-serif; font-weight:800; font-size:clamp(26px,2.8vw,34px); line-height:1.1; letter-spacing:-0.02em; color:#0B3B22; }
.gd-prose h3 { margin:8px 0 0; font-family:'Bricolage Grotesque', sans-serif; font-weight:700; font-size:22px; color:#0B3B22; }
.gd-prose > p a, .gd-prose li a { font-weight:700; color:#1B6B35; text-decoration:underline; }
.gd-prose ol { list-style:none; padding:0; display:flex; flex-direction:column; gap:12px; counter-reset:gd; }
.gd-prose ol li { counter-increment:gd; display:flex; gap:14px; align-items:flex-start; font-size:17.5px; line-height:1.65; color:#2C3F38; }
.gd-prose ol li::before { content:counter(gd); flex:none; width:26px; height:26px; border-radius:50%; background:#8CC63F; color:#0B3B22; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; margin-top:2px; }
.gd-prose ul { list-style:none; padding:0; display:flex; flex-direction:column; gap:10px; }
.gd-prose ul li { position:relative; padding-left:22px; font-size:17.5px; line-height:1.65; color:#2C3F38; }
.gd-prose ul li::before { content:""; position:absolute; left:0; top:11px; width:8px; height:8px; border-radius:50%; background:#1B6B35; }
.gd-prose blockquote, .gd-prose .gd-tips { background:#E8F4D6; border-radius:22px; padding:22px 24px; display:flex; flex-direction:column; gap:6px; }
.gd-prose blockquote::before, .gd-prose .gd-tips::before { content:"Tips"; font-size:13px; font-weight:700; color:#1B6B35; text-transform:uppercase; letter-spacing:.06em; }
.gd-prose blockquote p, .gd-prose .gd-tips p { margin:0; font-size:17px; line-height:1.65; color:#0B3B22; }
.gd-prose img { height:auto; border-radius:22px; }

/* Isi halaman legal */
.gd-legal > p { margin:0; font-size:16.5px; line-height:1.7; color:#4A5B55; text-wrap:pretty; }
.gd-legal ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.gd-legal ul li { display:flex; gap:12px; align-items:flex-start; font-size:16px; line-height:1.6; }
.gd-legal ul li::before { content:""; flex:none; width:8px; height:8px; border-radius:50%; background:#1B6B35; margin-top:9px; }

/* Paginasi artikel */
.gd-pager .page-numbers { min-width:44px; height:44px; padding:0 16px; border-radius:999px; border:1.5px solid #D9CFB8; background:#FFFDF8; color:#0B3B22; display:inline-flex; align-items:center; justify-content:center; font-weight:700; }
.gd-pager .page-numbers.current { background:#0B3B22; border-color:#0B3B22; color:#F7F2E7; }
.gd-pager a.page-numbers:hover { border-color:#1B6B35; color:#1B6B35; }
.p-0 { padding:0; }

/* Kartu kalkulator Beranda di layar sempit: label persentase turun ke baris sendiri agar angka tidak terpotong. */
@media (max-width:479.98px) {
  [data-calc-home] .gtc-1fr-auto { grid-template-columns:minmax(0,1fr); }
  [data-calc-home] .gtc-1fr-auto > span { justify-self:start; }
}

/* Layar <= 420px: wordmark sedikit diperkecil agar logo, menu, dan tombol WA muat dalam 360px. */
@media (max-width:420px) {
  .gd-wordmark { font-size:18px; }
  .gd-wordsub { font-size:8.5px; letter-spacing:.08em; }
}