:root{--ink:#132d43;--blue:#1866a5;--muted:#627588;--yellow:#f4c544}html{scroll-behavior:smooth;scroll-padding-top:100px}body{color:var(--ink);font-family:'Plus Jakarta Sans',Arial,sans-serif;background:#fff;margin:0}a{color:inherit;text-decoration:none}button,select,a,summary{touch-action:manipulation}a:focus-visible,summary:focus-visible,select:focus-visible{outline:3px solid #d69d00;outline-offset:5px}.skip{position:absolute;top:-100px;background:#fff;padding:15px;z-index:99}.skip:focus{top:0}.gov{padding:10px 5%;display:flex;justify-content:space-between;background:#143c5b;color:#fff;font-size:10px;letter-spacing:1.2px}.portal-header{max-width:1320px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:20px 5%;gap:25px}.identity{display:flex;align-items:center;gap:9px}.identity img{object-fit:contain}.identity b{font-size:27px;letter-spacing:-1px}.dot{color:#dca920}.identity small{display:block;font-size:8px;letter-spacing:2px;margin-top:4px}.portal-header nav{display:flex;gap:30px;font-size:12px;font-weight:600}.portal-header nav a:hover,.text-link:hover{color:var(--blue)}.btn{display:inline-flex;align-items:center;gap:25px;padding:17px 22px;background:var(--blue);color:white;border-radius:7px;font-size:13px;font-weight:700;box-shadow:0 5px 12px #1866a515}.btn:hover{background:#124e81}.btn.small{font-size:11px;padding:13px 18px}.hero{max-width:1320px;margin:auto;padding:65px 5% 70px;display:grid;grid-template-columns:1.04fr 1fr;gap:42px;align-items:center;background:radial-gradient(ellipse at 80% 45%,#edf5fc,transparent 60%)}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px;color:var(--blue)}.hero .eyebrow{display:flex;gap:9px;align-items:center}.hero .eyebrow span{width:7px;height:7px;background:#dba92b;border-radius:50%}h1{font-size:clamp(34px,4.2vw,60px);letter-spacing:-2.6px;line-height:1.15;margin:25px 0}h1 em{font-style:normal;color:var(--blue)}.hero-copy>p{color:var(--muted);font-size:14px;line-height:1.9;max-width:460px}.actions{display:flex;align-items:center;gap:24px;margin:30px 0}.text-link{font-size:12px;font-weight:700}.hero-note{display:flex;gap:10px;align-items:center;color:#627588;font-size:10px}.hero-note i{width:6px;height:6px;background:#328d73;border-radius:50%}.hero-visual{border:1px solid #d7e5ef;border-radius:16px;background:#f6faff;box-shadow:0 22px 60px #143c5b10;overflow:hidden;transform:rotate(-1deg)}.visual-top,.visual-bottom{display:flex;justify-content:space-between;padding:17px 20px;font-size:9px;letter-spacing:1px;background:#fff}.live{color:#317c67;letter-spacing:0}.hero-visual>img{display:block;width:100%;aspect-ratio:1.25;object-fit:contain;mix-blend-mode:multiply}.visual-bottom a{color:var(--blue);font-weight:bold;letter-spacing:0}.trust{display:flex;align-items:center;gap:15px;padding:24px 5%;border-top:1px solid #e9eef2;border-bottom:1px solid #e9eef2}.trust>span{font-size:8px;letter-spacing:1px;color:var(--muted);margin-right:15px}.trust img{width:27px;height:30px;object-fit:contain}.trust b{font-size:11px}.trust p{font-size:11px;color:var(--muted);margin-left:auto}.wrap{max-width:1190px;margin:auto;padding:65px 30px}.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:30px}.section-title h2{max-width:490px}h2{font-size:31px;line-height:1.3;letter-spacing:-1px;margin:13px 0}p{line-height:1.8}.section-title>p{font-size:12px;color:var(--muted)}.module-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.module{border:1px solid #dbe5ec;border-radius:12px;padding:28px 30px;background:linear-gradient(135deg,#f7fbff,#fff)}.module.upcoming{background:#fafcfc}.module-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.module-icon{display:grid;place-items:center;width:46px;height:46px;background:#e6effb;color:var(--blue);font-size:30px;border-radius:10px}.module-icon.water{background:#e6f3ef;color:#288675}.badge{font-size:9px;border-radius:30px;padding:7px 11px;background:#e4f3ed;color:#2b775c}.badge.neutral{background:#eef1f3;color:#667780}.module-no{font-size:9px;letter-spacing:1.7px;color:var(--muted)}.module h3{font-size:27px;margin:12px 0}.module p{color:var(--muted);font-size:12px;max-width:460px}.tags{display:flex;flex-wrap:wrap;gap:7px;margin:20px 0 30px}.tags span{font-size:9px;background:#fff;border:1px solid #e0e8ed;border-radius:4px;padding:6px 8px}.module>a{display:flex;justify-content:space-between;border-top:1px solid #dfe8ef;padding-top:19px;color:var(--blue);font-size:12px;font-weight:700}.gs-stats{background:#f3f7fa!important;padding:60px 30px!important}.gs-stats-container{max-width:1130px!important}.gs-stats h2{font-size:25px}.guide{display:grid;grid-template-columns:1fr 1.15fr;gap:80px}.guide h2{font-size:37px;margin-bottom:26px}.guide ol{list-style:none;margin:0;padding:0}.guide li{display:flex;gap:25px;padding:20px 0;border-bottom:1px solid #e6edf2}.guide li>span{font-size:11px;color:#2871a6;margin-top:6px}.guide h3{font-size:16px;margin:0 0 6px}.guide p{font-size:12px;color:var(--muted);margin:0}.about{display:grid;grid-template-columns:1fr 1.15fr;gap:80px;border-top:1px solid #e6edf2}.about p{font-size:13px;color:var(--muted)}details{border-bottom:1px solid #dbe5eb;padding:17px 0;scroll-margin-top:30px}summary{cursor:pointer;font-size:12px;font-weight:bold;line-height:1.8}.closing{max-width:1130px;box-sizing:border-box;background:#123c5b;color:#fff;border-radius:13px;display:flex;align-items:center;justify-content:space-between;padding:40px;margin:15px auto 25px;gap:25px}.closing .eyebrow{color:#9ac5e3}.closing h2{font-size:34px}.closing p{color:#b9cedd;font-size:12px;margin-bottom:0}.yellow{background:var(--yellow);color:#183349;box-shadow:none}.yellow:hover{background:#eab932}.portal-footer{display:flex;justify-content:space-between;gap:30px;padding-top:40px;padding-bottom:35px}.portal-footer b{font-size:23px}.portal-footer p,.portal-footer small{font-size:10px;color:var(--muted);line-height:1.9}.portal-footer>div:nth-child(2){display:flex;gap:25px;align-items:center;font-size:11px}@media(min-width:1450px){.trust{padding-left:calc((100vw - 1190px)/2);padding-right:calc((100vw - 1190px)/2)}}@media(max-width:850px){.portal-header nav{gap:15px}.hero{gap:20px;padding-top:40px}.actions{align-items:start;flex-direction:column;gap:15px}.hero-note{font-size:9px;flex-wrap:wrap}.trust p{display:none}.guide,.about{gap:35px}.closing{margin:15px 25px}.module{padding:24px}.portal-footer>div:nth-child(2){flex-direction:column;align-items:start;gap:12px}}@media(max-width:600px){.gov{font-size:8px}.gov span+span{display:none}.portal-header{flex-wrap:wrap;padding:16px 6%;gap:18px}.identity b{font-size:23px}.portal-header nav{order:3;width:100%;justify-content:space-between;border-top:1px solid #edf1f4;padding-top:15px}.btn.small{padding:11px}.hero{grid-template-columns:1fr;padding:32px 6% 40px;gap:28px}h1{font-size:43px;letter-spacing:-1.8px}.hero-copy>p{font-size:13px}.actions{flex-direction:row;align-items:center;gap:18px}.actions .btn{font-size:11px;padding:15px}.actions .text-link{font-size:10px}.hero-visual{transform:none}.hero-visual>img{aspect-ratio:1.65}.hero-note{font-size:9px}.trust{gap:10px;padding:20px 6%;flex-wrap:wrap}.trust>span{width:100%;font-size:8px}.wrap{padding:42px 6%}.section-title{display:block}.section-title>p br{display:none}h2{font-size:27px}.module-grid,.guide,.about{grid-template-columns:1fr}.module{padding:25px}.guide,.about{gap:20px}.guide h2{font-size:30px}.guide h2 br{display:none}.gs-stats{padding:40px 6%!important}.closing{display:block;margin:10px 6% 20px;padding:28px 24px}.closing .btn{margin-top:20px}.closing h2{font-size:29px}.portal-footer{flex-wrap:wrap}.portal-footer small{width:100%;border-top:1px solid #e5edf2;padding-top:15px}.portal-footer>div:nth-child(2){gap:15px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Requested landing-page refinements */
.portal-header-actions { display:flex; align-items:center; gap:18px; }
.portal-agency-logos { display:flex; align-items:center; gap:12px; padding-left:18px; border-left:1px solid #dfe7ee; }
.portal-agency-logos img { object-fit:contain; flex-shrink:0; }
#modul .module-no { font-size:9.9px; }
#modul .badge { font-size:9.45px; }
#modul .module.active { background:linear-gradient(125deg,#fff2ad 0%,#ffd16b 55%,#ffb15e 100%); border-color:#edbd67; }
#modul .module.active .module-no,
#modul .module.active p { color:#59451e; }
#modul .module.active h3 { color:#26384a; }
#modul .module.active .module-icon { background:#fff8db; color:#72500b; }
#modul .module.active .tags span { background:#fff9e5; border-color:#e3bd73; color:#59451e; }
#modul .module.active > a { border-color:#b8752540; color:#193d60; }
@media(max-width:1000px) {
 .portal-header { gap:18px; }
 .portal-header nav { gap:18px; }
 .portal-header-actions { gap:12px; }
 .portal-agency-logos { gap:8px; padding-left:12px; }
}
@media(max-width:600px) {
 .portal-header { column-gap:10px; }
 .portal-header-actions { margin-left:auto; gap:10px; }
 .portal-header-actions .btn.small { display:none; }
 .portal-agency-logos { border:0; padding-left:0; gap:8px; }
 .portal-agency-logos img { width:27px; height:30px; }
 .portal-header nav { justify-content:flex-start; gap:25px; }
}

/* Navy and gold palette requested for the landing page. */
.hero h1 em { color:#073b77; }
.hero .actions > .btn,
.portal-header-actions > .btn { background:#073b77; }
.hero .actions > .btn:hover,
.portal-header-actions > .btn:hover { background:#23295d; }
#modul { padding-bottom:77px; }
#modul .module.active { background:#e6d300; border-color:#ad9012; }
#modul .module.active .module-no,
#modul .module.active p { color:#000; }
#modul .module.active .module-icon { color:#000; }
#modul .module.active .tags span { background:#073b77; border-color:#073b77; color:#fff; }
#modul .module.upcoming { background:#073b77; border-color:#073b77; color:#fff; }
#modul .module.upcoming .module-no,
#modul .module.upcoming h3,
#modul .module.upcoming p,
#modul .module.upcoming > a { color:#fff; }
#modul .module.upcoming > a { border-top-color:#ffffff35; }
#modul .module.upcoming .module-icon { background:#ffffff18; color:#fff; }
#modul .module.upcoming .badge { background:#ffffff18; color:#fff; border:1px solid #ffffff35; }
#modul .module.upcoming .tags span { background:#e6d300; border-color:#e6d300; color:#000; }
@media(max-width:600px) { #modul { padding-bottom:54px; } }

/* Full-width backgrounds preserve the existing centered content geometry. */
.gov { background:#073b77; }
.portal-header-band { border-bottom:1px solid #dfe7ef; background:#fff; }
.hero-band { width:100%; background:radial-gradient(ellipse at 80% 45%,#edf5fc,transparent 60%),#fff; }
.hero-band .hero { background:transparent; }
#modul.modules-reference { margin-top:14px; margin-bottom:14px; }
@media(max-width:600px) { #modul.modules-reference { margin-top:10px; margin-bottom:10px; } }
/* Decorative full-bleed layers must not create horizontal scrolling. */
#utama { overflow-x:clip; }

.portal-footer-band { width:100%; background:#073b77; color:#fff; }
.portal-footer-band .portal-footer,
.portal-footer-band .portal-footer b,
.portal-footer-band .portal-footer p,
.portal-footer-band .portal-footer small,
.portal-footer-band .portal-footer a { color:#fff; }
.portal-footer-band .portal-footer a:hover { text-decoration:underline; }
.portal-footer-band .portal-footer a:focus-visible { outline:2px solid #fff; outline-offset:4px; }
.portal-footer-band .portal-footer small { border-color:#ffffff40; }
/* About and footer have clear, solid section boundaries. */
.about-band { background:#fff; border-top:1px solid #e5eaf0; }
.about-band #tentang.about { border-top:0; background:transparent; }
/* Fade the existing purple glows at their shared boundary with About. */
#statistik-singkat.gs-stats::before,#statistik-singkat.gs-stats::after {
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 25%,#000 65%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 25%,#000 65%,transparent 100%);
}
