:root{--color-primary:#0b3a5b;--color-primary-dark:#06263d;--color-primary-rgb:11, 58, 91;--color-secondary:#22b8cf;--color-secondary-dark:#0b7285;--color-secondary-rgb:34, 184, 207;--color-background:#f4fafc;--color-surface:#fff;--color-surface-muted:#eef7fa;--color-border:#d9eaf2;--color-border-strong:#b8d4e3;--color-text-primary:#102a43;--color-text-secondary:#486581;--color-text-muted:#829ab1;--color-success:#2f9e44;--color-success-soft:#e6f4ea;--color-warning:#f59f00;--color-warning-soft:#fff4d6;--color-risk-high:#f76707;--color-risk-high-soft:#fff0e2;--color-danger:#e03131;--color-danger-soft:#ffe3e3;--font-heading:"Plus Jakarta Sans", Inter, system-ui, -apple-system, sans-serif;--font-body:Inter, system-ui, -apple-system, sans-serif;--text-xs:11px;--text-sm:13px;--text-base:15px;--text-md:17px;--text-lg:20px;--text-xl:24px;--text-2xl:30px;--text-3xl:38px;--text-4xl:clamp(32px, 5vw, 46px);--text-5xl:clamp(42px, 7vw, 78px);--font-weight-regular:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--radius-button:12px;--radius-card:20px;--radius-modal:24px;--radius-badge:999px;--shadow-card:0 8px 24px rgba(var(--color-primary-rgb), .08);--shadow-floating:0 16px 40px rgba(var(--color-primary-rgb), .12);--shadow-button:0 8px 16px rgba(var(--color-primary-rgb), .16);--shadow-map:0 24px 70px #041c2f4d;--motion-fast:.15s;--motion-base:.25s;--motion-slow:.4s;--motion-page:.6s;--ease-standard:cubic-bezier(.2, 0, 0, 1);--ease-out:cubic-bezier(0, 0, .2, 1);--ease-water:cubic-bezier(.22, 1, .36, 1);--container:1180px;--container-pad:clamp(16px, 4vw, 48px);--header-height:72px;color:var(--color-text-primary);background:var(--color-background);font-family:var(--font-body);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + 20px)}body{min-width:320px;min-height:100svh;color:var(--color-text-primary);background:radial-gradient(circle at top left, rgba(var(--color-secondary-rgb), .12), transparent 32rem), var(--color-background);margin:0;overflow-x:hidden}body.drawer-lock{overflow:hidden}button,input,textarea,select{font:inherit}button{border:0}a{color:inherit;text-decoration:none}img,svg,canvas{max-width:100%;display:block}h1,h2,h3,p{margin:0}h1,h2,h3{color:var(--color-text-primary);font-family:var(--font-heading);letter-spacing:0}p{color:var(--color-text-secondary);line-height:1.7}button,a{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid rgba(var(--color-secondary-rgb), .5);outline-offset:3px;border-radius:10px}::selection{background:rgba(var(--color-secondary-rgb), .22);color:var(--color-text-primary)}#root{min-height:100svh}.container{width:min(100%, calc(var(--container) + (var(--container-pad) * 2)));padding-inline:var(--container-pad);margin-inline:auto}.section{padding-block:clamp(72px,10vw,116px);overflow-x:clip}.surface-section{background:var(--color-surface)}.mist-section{background:linear-gradient(180deg, #eef7fabf, #f4fafcf2), var(--color-background)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.site-header{z-index:50;color:#ffffffe6;width:min(100% - 28px,1180px);min-height:58px;transition:color var(--motion-base) var(--ease-standard), background var(--motion-base) var(--ease-standard), border-color var(--motion-base) var(--ease-standard), box-shadow var(--motion-base) var(--ease-standard);background:#06263dd1;border:1px solid #ffffff29;border-radius:18px;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;padding:10px 12px 10px 16px;display:grid;position:fixed;top:14px;left:50%;transform:translate(-50%);box-shadow:0 14px 32px #0317262e}.site-header.is-scrolled{color:var(--color-text-primary);border-color:rgba(var(--color-primary-rgb), .12);box-shadow:var(--shadow-floating);background:#fffffffa}.brand{color:inherit;font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--font-weight-bold);align-items:center;gap:10px;display:inline-flex}.brand-mark{color:#fff;background:linear-gradient(145deg, var(--color-secondary), var(--color-secondary-dark));width:38px;height:38px;box-shadow:0 10px 22px rgba(var(--color-secondary-rgb), .24);border-radius:12px;place-items:center;display:grid}.desktop-nav{justify-content:center;gap:4px;display:flex}.desktop-nav a,.btn{min-height:44px}.desktop-nav a{color:currentColor;font-size:var(--text-sm);font-weight:var(--font-weight-semibold);opacity:.82;transition:opacity var(--motion-fast) var(--ease-standard), background var(--motion-fast) var(--ease-standard);border-radius:12px;align-items:center;padding:9px 13px;display:inline-flex}.desktop-nav a:hover{opacity:1;background:rgba(var(--color-secondary-rgb), .13)}.desktop-actions{align-items:center;gap:10px;display:flex}.btn{width:fit-content;min-width:0;max-width:100%;color:var(--color-primary);border-radius:var(--radius-button);font-size:var(--text-sm);text-align:center;white-space:normal;overflow-wrap:anywhere;cursor:pointer;transition:transform var(--motion-fast) var(--ease-standard), color var(--motion-fast) var(--ease-standard), box-shadow var(--motion-fast) var(--ease-standard), background var(--motion-fast) var(--ease-standard), border-color var(--motion-fast) var(--ease-standard);background:#fff;border:1px solid #0000;justify-content:center;align-items:center;gap:9px;padding:10px 16px;font-weight:700;line-height:1;display:inline-flex}.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(0)scale(.98)}.btn-primary{color:#fff;border-color:var(--color-primary);background:var(--color-primary);box-shadow:0 10px 22px rgba(var(--color-primary-rgb), .22)}.btn-primary:hover{background:var(--color-primary-dark);box-shadow:var(--shadow-button)}.site-header:not(.is-scrolled) .btn-primary,.hero-actions .btn-primary,.cta-actions .btn-primary{color:var(--color-primary-dark);background:linear-gradient(135deg,#fff 0%,#dffaff 100%);border-color:#ffffffe0;box-shadow:0 14px 30px #22b8cf38,inset 0 0 0 1px #ffffff8c}.site-header:not(.is-scrolled) .btn-primary:hover,.hero-actions .btn-primary:hover,.cta-actions .btn-primary:hover{color:var(--color-primary-dark);background:linear-gradient(135deg,#dffaff 0%,#fff 100%);border-color:#94ecf8;box-shadow:0 16px 34px #22b8cf57,inset 0 0 0 1px #22b8cf47}.btn-on-dark{color:#fff;background:#ffffff24;border-color:#ffffff61}.btn-on-dark:hover{background:#ffffff2e;border-color:#ffffffb3}.btn-on-light{color:var(--color-primary-dark);background:rgba(var(--color-primary-rgb), .14);border-color:#22b8cf57}.btn-on-light:hover{border-color:rgba(var(--color-primary-rgb), .7);background:#ffffff2e}.btn-outline{color:var(--color-primary);border-color:var(--color-border-strong);background:var(--color-surface)}.btn-outline:hover{border-color:var(--color-primary);box-shadow:var(--shadow-card)}.btn-ghost{color:currentColor;background:0 0}.site-header.is-scrolled .btn-ghost{color:var(--color-primary)}.btn-ghost:hover{background:rgba(var(--color-secondary-rgb), .12)}.btn-large{min-height:52px;font-size:var(--text-base);border-radius:14px;padding-inline:22px}.menu-button{width:44px;height:44px;color:inherit;background:#ffffff14;border-radius:12px;place-items:center;display:none}.drawer-shell{z-index:80;visibility:hidden;pointer-events:none;position:fixed;inset:0;overflow:hidden}.drawer-shell.is-open{visibility:visible;pointer-events:auto}.drawer-backdrop{opacity:0;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:opacity var(--motion-base) var(--ease-standard);background:#0515247a;position:absolute;inset:0}.drawer-shell.is-open .drawer-backdrop{opacity:1}.mobile-drawer{border-left:1px solid var(--color-border);background:var(--color-surface);width:min(360px,88vw);height:100%;box-shadow:var(--shadow-floating);transition:transform var(--motion-slow) var(--ease-water);flex-direction:column;gap:22px;padding:22px;display:flex;position:absolute;top:0;right:0;transform:translate(100%)}.drawer-shell.is-open .mobile-drawer{transform:translate(0)}.drawer-head{justify-content:space-between;align-items:center;display:flex}.drawer-title{font-family:var(--font-heading);font-size:var(--text-md);font-weight:var(--font-weight-bold)}.drawer-head button{width:44px;height:44px;color:var(--color-primary);background:var(--color-surface-muted);border-radius:12px;place-items:center;display:grid}.drawer-links{gap:8px;display:grid}.drawer-links a{min-height:48px;color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:14px;justify-content:space-between;align-items:center;padding:11px 13px;font-weight:700;display:flex}.drawer-actions{gap:10px;margin-top:auto;display:grid}.drawer-login{color:var(--color-primary)}.hero-section{contain:paint;color:#fff;isolation:isolate;background:radial-gradient(circle at 76% 28%, rgba(var(--color-secondary-rgb), .23), transparent 30rem), radial-gradient(circle at 22% 80%, #0b728538, transparent 28rem), linear-gradient(145deg, var(--color-primary-dark), #082d47 52%, #041c2f);min-height:calc(100svh - 30px);padding-block:112px 70px;position:relative;overflow:hidden}.hero-background{pointer-events:none;position:absolute;inset:0}.wave-canvas{opacity:.88;width:100%;height:170px;position:absolute;bottom:0;left:0;right:0}.signal-line{border:1px solid #22b8cf1f;border-radius:999px;width:540px;height:540px;position:absolute}.signal-line-one{top:12%;right:-180px}.signal-line-two{bottom:-240px;left:-170px}.hero-noise{opacity:.08;background-image:linear-gradient(#ffffff0d 1px,#0000 1px),linear-gradient(90deg,#ffffff0d 1px,#0000 1px);background-size:72px 72px;position:absolute;inset:0}.hero-grid{z-index:1;grid-template-columns:minmax(0,1fr) minmax(420px,.92fr);align-items:center;gap:clamp(32px,6vw,78px);display:grid;position:relative}.hero-copy{gap:24px;max-width:650px;display:grid}.hero-eyebrow{color:#92f0ff;border:1px solid rgba(var(--color-secondary-rgb), .34);border-radius:var(--radius-badge);background:rgba(var(--color-secondary-rgb), .12);width:fit-content;font-size:var(--text-sm);font-weight:var(--font-weight-bold);align-items:center;gap:9px;padding:7px 13px;display:inline-flex}.hero-eyebrow>span{background:var(--color-secondary);width:7px;height:7px;box-shadow:0 0 0 7px rgba(var(--color-secondary-rgb), .16);border-radius:999px}.hero-copy h1,.hero-headline{color:#fff;max-width:12ch;font-size:clamp(42px,7vw,78px);font-weight:var(--font-weight-bold);line-height:.98}.hero-actions{flex-wrap:wrap;gap:12px;display:flex}.hero-stat-row{flex-wrap:wrap;gap:18px;padding-top:8px;display:flex}.hero-stat-row div{background:#ffffff0f;border:1px solid #ffffff21;border-radius:16px;min-width:132px;padding:14px 16px}.hero-stat-row strong,.hero-stat-row span{display:block}.hero-stat-row strong{color:#fff;font-size:var(--text-xl);line-height:1}.hero-stat-row span{color:#ffffffad;font-size:var(--text-xs);margin-top:5px;font-weight:700}.hero-visual{perspective:1400px;min-width:0;position:relative}.hero-visual .risk-map-card{transform:rotateX(3deg)rotateY(-4deg)}.floating-card{z-index:2;color:#fff;background:#081e37e6;border:1px solid #ffffff2e;border-radius:16px;align-items:center;gap:12px;min-width:190px;padding:13px 14px;transition:box-shadow .3s,transform .3s;display:flex;position:absolute;box-shadow:0 14px 30px #0000003d,0 0 0 1px #ffffff0f,inset 0 1px #ffffff1a}.floating-card:hover{box-shadow:0 24px 56px #0000005c,0 0 32px #22b8cf26,inset 0 1px #ffffff24}.floating-card-top{top:22px;right:-18px}.floating-card-bottom{bottom:28px;left:-26px}.floating-icon{border-radius:12px;place-items:center;width:40px;height:40px;display:grid}.danger-soft{color:var(--color-danger);background:var(--color-danger-soft)}.success-soft{color:var(--color-success);background:var(--color-success-soft)}.floating-card span:not(.floating-icon){color:#ffffffa3;font-size:var(--text-xs);font-weight:700;display:block}.floating-card strong{color:#fff;font-size:var(--text-base);margin-top:2px;display:block}.hero-bottom-wave{height:88px;color:var(--color-surface);position:absolute;bottom:-1px;left:0;right:0}.hero-bottom-wave svg{width:100%;height:100%}.hero-bottom-wave path{fill:currentColor}.hero-headline-em{background:linear-gradient(135deg,#22b8cf 0%,#92f0ff 40%,#22b8cf 80%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-style:normal}.map-viewport{background:linear-gradient(#0c4164d1,#06263ded),#0b3a5b;height:360px;position:relative;overflow:hidden}.map-viewport:after{content:"";z-index:4;pointer-events:none;background:linear-gradient(90deg,#0000,#22b8cfd9,#0000);height:2px;animation:3s linear infinite mapScan;position:absolute;left:0;right:0}@keyframes mapScan{0%{opacity:0;top:-2px}5%{opacity:1}95%{opacity:.7}to{opacity:0;top:100%}}.section-intro{gap:14px;max-width:680px;display:grid}.section-intro-center{text-align:center;justify-items:center;margin-inline:auto}.section-label{width:fit-content;color:var(--color-secondary-dark);font-size:var(--text-xs);font-weight:var(--font-weight-bold);letter-spacing:.08em;text-transform:uppercase;align-items:center;gap:9px;display:inline-flex}.section-label:before{content:"";background:var(--color-secondary);border-radius:999px;width:22px;height:2px}.section-intro h2{max-width:16ch;font-size:clamp(28px,4vw,46px);font-weight:var(--font-weight-bold);line-height:1.08}.section-intro-center h2{max-width:18ch}.section-intro p{max-width:62ch;font-size:var(--text-base)}.card-grid{gap:18px;margin-top:42px;display:grid}.card-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.info-card,.solution-card,.workflow-card,.mini-feature,.impact-card,.dashboard-preview,.score-panel,.risk-map-card{border:1px solid var(--color-border);background:var(--color-surface);box-shadow:var(--shadow-card)}.info-card,.workflow-card,.mini-feature,.impact-card{border-radius:var(--radius-card)}.info-card{transition:transform var(--motion-base) var(--ease-water), box-shadow var(--motion-base) var(--ease-water);gap:15px;padding:24px;display:grid}.info-card:hover,.mini-feature:hover,.impact-card:hover{box-shadow:var(--shadow-floating);transform:translateY(-4px)}.card-icon{border-radius:15px;place-items:center;width:52px;height:52px;display:grid}.card-icon.danger{color:var(--color-danger);background:var(--color-danger-soft)}.card-icon.warning{color:#9a6400;background:var(--color-warning-soft)}.card-icon.neutral{color:var(--color-primary);background:var(--color-surface-muted)}.info-card h3,.solution-card h3,.workflow-card h3,.mini-feature h3,.impact-card h3{font-size:var(--text-md);line-height:1.24}.info-card p,.solution-card p,.workflow-card p,.mini-feature p,.impact-card p{font-size:var(--text-sm)}.split-section,.risk-layout,.priority-layout{align-items:center;gap:clamp(34px,6vw,72px);display:grid}.split-section{grid-template-columns:.86fr 1.14fr}.solution-stack{gap:14px;display:grid}.solution-card{border-radius:18px;grid-template-columns:auto 1fr;gap:16px;padding:20px;display:grid}.solution-card>span{width:48px;height:48px;color:var(--color-secondary-dark);background:rgba(var(--color-secondary-rgb), .12);border-radius:14px;place-items:center;display:grid}.solution-card p{margin-top:6px}.workflow-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:46px;display:grid;position:relative}.workflow-grid:before{content:"";background:linear-gradient(90deg, var(--color-secondary), var(--color-primary));opacity:.25;height:2px;position:absolute;top:55px;left:16%;right:16%}.workflow-card{text-align:center;justify-items:center;gap:12px;padding:24px;display:grid;position:relative}.step-number{color:var(--color-text-muted);font-size:var(--text-xs);font-weight:var(--font-weight-bold);position:absolute;top:16px;left:18px}.workflow-icon{width:70px;height:70px;color:var(--color-secondary-dark);border:1px solid var(--color-border);background:radial-gradient(circle at 30% 20%, rgba(var(--color-secondary-rgb), .18), transparent 52%), var(--color-surface);box-shadow:var(--shadow-card);border-radius:20px;place-items:center;display:grid}.workflow-card small{color:var(--color-secondary-dark);font-size:var(--text-xs);font-weight:var(--font-weight-bold);text-transform:uppercase}.risk-section{color:#fff;background:radial-gradient(circle at 20% 20%, rgba(var(--color-secondary-rgb), .18), transparent 26rem), linear-gradient(140deg, var(--color-primary-dark), #092f4d 58%, #041c2f)}.risk-section .section-intro h2,.risk-section .score-copy h3{color:#fff}.risk-section .section-intro p,.risk-section .score-copy p{color:#ffffffb8}.risk-layout{grid-template-columns:minmax(0,.88fr) minmax(420px,1.12fr)}.score-panel{color:#fff;border-radius:var(--radius-card);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffff14;border-color:#ffffff1f;grid-template-columns:auto 1fr;align-items:center;gap:20px;margin-top:34px;padding:20px;display:grid;box-shadow:0 18px 44px #0000002e}.score-ring{border:10px solid #ffffff21;border-top-color:var(--color-danger);border-right-color:var(--color-risk-high);border-radius:999px;place-items:center;width:116px;height:116px;display:grid}.score-ring span,.score-ring small{grid-area:1/1}.score-ring span{color:#fff;font-size:var(--text-3xl);font-weight:var(--font-weight-bold);align-self:center;line-height:1}.score-ring small{color:#ffffffa8;font-size:var(--text-xs);font-weight:var(--font-weight-bold);align-self:end;margin-bottom:22px}.score-copy{gap:8px;display:grid}.score-copy h3{font-size:19px}.pipeline{flex-wrap:wrap;gap:9px;margin-top:20px;display:flex}.pipeline span{color:#ffffffb8;min-height:36px;font-size:var(--text-xs);background:#ffffff12;border:1px solid #ffffff21;border-radius:999px;align-items:center;gap:7px;padding:8px 12px;font-weight:700;display:inline-flex}.pipeline span:before{content:"";background:currentColor;border-radius:999px;width:7px;height:7px}.pipeline .is-done{color:#a7f3d0}.risk-map-card{border-color:rgba(var(--color-primary-rgb), .1);box-shadow:var(--shadow-map);background:#ffffffed;border-radius:24px;overflow:hidden}.risk-map-card.is-compact{background:#ffffff1f;border-color:#ffffff29}.map-card-head{color:var(--color-text-primary);border-bottom:1px solid rgba(var(--color-primary-rgb), .08);justify-content:space-between;align-items:center;gap:14px;padding:16px 18px;display:flex}.is-compact .map-card-head{color:#fff;border-bottom-color:#ffffff1a}.map-card-head div{gap:3px;display:grid}.micro-label{color:var(--color-secondary-dark);font-size:var(--text-xs);font-weight:var(--font-weight-bold);letter-spacing:.08em;text-transform:uppercase}.is-compact .micro-label{color:#92f0ff}.map-card-head strong{font-family:var(--font-heading);font-size:var(--text-base)}.live-pill{min-height:30px;color:var(--color-secondary-dark);border-radius:var(--radius-badge);background:rgba(var(--color-secondary-rgb), .12);font-size:var(--text-xs);font-weight:var(--font-weight-bold);align-items:center;gap:8px;padding:6px 10px;display:inline-flex}.live-pill span{background:var(--color-secondary);width:7px;height:7px;animation:dotPulse 2.1s var(--ease-water) infinite;border-radius:999px}.risk-map-card.is-compact .live-pill span,.risk-map-card.is-compact .marker-pulse{animation:none}.risk-map-card.is-compact .marker-pulse{opacity:.2}.risk-map-card.is-compact .map-popup{box-shadow:0 14px 32px rgba(var(--color-primary-rgb), .18);-webkit-backdrop-filter:none;backdrop-filter:none}.risk-map-card.is-compact .map-viewport:after{display:none}.is-compact .map-viewport{height:430px}.map-grid{opacity:.24;background-image:linear-gradient(#ffffff24 1px,#0000 1px),linear-gradient(90deg,#ffffff24 1px,#0000 1px);background-size:42px 42px;position:absolute;inset:0}.map-water{background:rgba(var(--color-secondary-rgb), .16);filter:blur(1px);border-radius:999px;height:74px;position:absolute}.map-water-one{width:76%;bottom:24%;right:-8%;transform:rotate(-20deg)}.map-water-two{width:64%;bottom:9%;left:-12%;transform:rotate(18deg)}.map-road{transform-origin:50%;background:#ffffff47;border-radius:999px;height:2px;position:absolute}.map-road-one{width:120%;top:31%;left:-12%;transform:rotate(18deg)}.map-road-two{width:95%;top:54%;left:7%;transform:rotate(-34deg)}.map-road-three{width:110%;top:74%;left:-8%;transform:rotate(8deg)}.risk-marker{z-index:3;color:#fff;cursor:pointer;background:0 0;border:0;width:42px;height:42px;position:absolute;transform:translate(-50%,-50%)}.marker-pin{z-index:2;width:42px;height:42px;font-size:var(--text-xs);font-weight:var(--font-weight-bold);transition:transform var(--motion-fast) var(--ease-standard), box-shadow var(--motion-fast) var(--ease-standard);border:3px solid #ffffffd1;border-radius:999px;place-items:center;display:grid;position:relative;box-shadow:0 12px 26px #0000003d}.risk-marker:hover .marker-pin,.risk-marker.is-active .marker-pin{transform:scale(1.1);box-shadow:0 15px 32px #0000004d}.marker-pulse{opacity:0;border-radius:999px;position:absolute;inset:-5px}.risk-kritis .marker-pulse,.risk-tinggi .marker-pulse{animation:markerPulse 1.8s var(--ease-water) infinite}.risk-kritis .marker-pin,.risk-kritis.legend-dot,.risk-kritis.marker-pulse{background:var(--color-danger)}.risk-tinggi .marker-pin,.risk-tinggi.legend-dot,.risk-tinggi.marker-pulse{background:var(--color-risk-high)}.risk-waspada .marker-pin,.risk-waspada.legend-dot{color:#fff;background:var(--color-warning)}.risk-normal .marker-pin,.risk-normal.legend-dot{background:var(--color-success)}.map-popup{z-index:4;width:min(280px,100% - 36px);color:var(--color-text-primary);border:1px solid rgba(var(--color-primary-rgb), .1);box-shadow:var(--shadow-floating);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fffffff0;border-radius:16px;gap:8px;padding:14px;display:grid;position:absolute;bottom:18px;right:18px}.map-popup div{align-items:center;gap:8px;display:flex}.map-popup p{color:var(--color-text-secondary);font-size:var(--text-sm)}.map-popup>span{color:var(--color-text-muted);font-size:var(--text-xs);font-weight:700}.risk-badge{border-radius:var(--radius-badge);min-height:26px;font-size:var(--text-xs);font-weight:var(--font-weight-bold);align-items:center;padding:5px 9px;display:inline-flex}.risk-badge.risk-kritis{color:#a61e1e;background:var(--color-danger-soft)}.risk-badge.risk-tinggi{color:#a84b00;background:var(--color-risk-high-soft)}.risk-badge.risk-waspada{color:#7a4f00;background:var(--color-warning-soft)}.risk-badge.risk-normal{color:#1b6b32;background:var(--color-success-soft)}.map-legend{color:var(--color-text-secondary);border-top:1px solid rgba(var(--color-primary-rgb), .08);font-size:var(--text-xs);flex-wrap:wrap;gap:12px;padding:14px 18px;font-weight:700;display:flex}.is-compact .map-legend{color:#ffffffb8;border-top-color:#ffffff1a}.map-legend span{align-items:center;gap:6px;display:inline-flex}.legend-dot{border-radius:999px;width:9px;height:9px;display:inline-block}.priority-layout{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}.dashboard-preview{border-radius:24px;overflow:hidden}.dashboard-head{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;gap:16px;padding:20px;display:flex}.dashboard-head div{gap:5px;display:grid}.dashboard-head strong{font-family:var(--font-heading);font-size:var(--text-md)}.dashboard-chip{color:var(--color-secondary-dark);border-radius:var(--radius-badge);background:rgba(var(--color-secondary-rgb), .12);font-size:var(--text-xs);font-weight:var(--font-weight-bold);align-items:center;gap:7px;padding:8px 10px;display:inline-flex}.summary-row{background:var(--color-border);grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;display:grid}.summary-row div{background:var(--color-surface-muted);gap:8px;padding:18px;display:grid}.summary-row span{color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:700}.summary-row strong{color:var(--color-primary);font-size:var(--text-2xl);line-height:1}.priority-table{padding:8px 16px 16px;display:grid}.priority-row{border-bottom:1px solid var(--color-border);min-height:64px;color:var(--color-text-secondary);font-size:var(--text-sm);grid-template-columns:minmax(170px,1.35fr) minmax(120px,.8fr) 72px minmax(140px,1fr);align-items:center;gap:14px;padding-block:12px;display:grid}.priority-row:last-child{border-bottom:0}.priority-header{min-height:42px;color:var(--color-text-muted);font-size:var(--text-xs);font-weight:var(--font-weight-bold);letter-spacing:.07em;text-transform:uppercase}.priority-row strong,.priority-row small{display:block}.priority-row strong{color:var(--color-text-primary);font-size:var(--text-sm)}.priority-row small{font-size:var(--text-xs);margin-top:4px}.score-cell{color:var(--color-text-primary);font-weight:var(--font-weight-bold);align-items:center;gap:7px;display:inline-flex}.mini-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:34px;display:grid}.mini-feature{transition:transform var(--motion-base) var(--ease-water), box-shadow var(--motion-base) var(--ease-water);gap:10px;padding:18px;display:grid}.mini-feature svg{color:var(--color-secondary-dark)}.mini-feature h3{font-size:var(--text-base)}.mini-feature p{font-size:var(--text-sm)}.features-section{background:var(--color-surface)}.features-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:52px;display:grid}.feature-tile{border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-background);cursor:default;transition:transform var(--motion-base) var(--ease-water), box-shadow var(--motion-base) var(--ease-water), border-color var(--motion-base) var(--ease-standard);gap:14px;padding:28px;display:grid;position:relative;overflow:hidden}.feature-tile:before{content:"";background:linear-gradient(90deg, var(--color-secondary), var(--color-secondary-dark));transform-origin:0;height:3px;transition:transform .4s var(--ease-water);border-radius:3px 3px 0 0;position:absolute;top:0;left:0;right:0;transform:scaleX(0)}.feature-tile:hover{box-shadow:var(--shadow-floating);border-color:rgba(var(--color-secondary-rgb), .22);transform:translateY(-5px)}.feature-tile:hover:before{transform:scaleX(1)}.feature-tile-icon{width:50px;height:50px;color:var(--color-secondary-dark);background:rgba(var(--color-secondary-rgb), .1);transition:background var(--motion-base) var(--ease-standard), color var(--motion-fast) var(--ease-standard);border-radius:14px;place-items:center;display:grid}.feature-tile:hover .feature-tile-icon{background:var(--color-secondary);color:#fff}.feature-tile h3{font-size:var(--text-md);color:var(--color-text-primary);font-weight:700;line-height:1.3}.feature-tile p{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0;line-height:1.65}.stats-band{color:#fff;background:var(--color-primary);padding-block:50px}.stats-grid{background:#ffffff1f;border-radius:22px;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;display:grid;overflow:hidden}.stat-card{text-align:center;background:#ffffff0d;justify-items:center;gap:8px;padding:28px 16px;display:grid}.stat-card svg{color:var(--color-secondary)}.stat-card strong{color:#fff;font-size:clamp(32px,5vw,48px);line-height:1}.stat-card span{color:#ffffffb8;font-size:var(--text-sm);font-weight:700}.impact-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:42px;display:grid}.impact-card{transition:transform var(--motion-base) var(--ease-water), box-shadow var(--motion-base) var(--ease-water);gap:14px;padding:24px;display:grid}.impact-card>span{width:52px;height:52px;color:var(--color-primary);background:var(--color-surface-muted);border-radius:16px;place-items:center;display:grid}.final-cta{color:#fff;background:radial-gradient(circle at 50% 40%, rgba(var(--color-secondary-rgb), .18), transparent 28rem), linear-gradient(135deg, var(--color-primary-dark), #092f4d 55%, #041c2f);padding-block:clamp(84px,12vw,138px);position:relative;overflow:hidden}.final-cta-inner{z-index:1;text-align:center;place-items:center;display:grid;position:relative}.final-cta-inner>div{justify-items:center;gap:20px;max-width:790px;display:grid}.final-cta h2{color:#fff;max-width:16ch;font-size:clamp(32px,5.4vw,62px);font-weight:var(--font-weight-bold);line-height:1.02}.final-cta p{color:#ffffffbf;max-width:60ch;font-size:var(--text-md)}.cta-actions{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:8px;display:flex}.cta-watermark svg{color:#ffffff0d;position:absolute}.cta-watermark svg:first-child{width:90px;height:90px;top:18%;left:12%}.cta-watermark svg:nth-child(2){width:110px;height:110px;bottom:16%;right:11%}.cta-watermark svg:nth-child(3){width:74px;height:74px;top:18%;right:22%}.site-footer{color:#ffffffad;background:#041c2f}.footer-grid{grid-template-columns:1.8fr repeat(3,minmax(0,1fr));gap:34px;padding-block:56px 36px;display:grid}.footer-brand{align-content:start;gap:16px;display:grid}.footer-logo{color:#fff}.footer-brand p{color:#ffffffad;max-width:34ch;font-size:var(--text-sm)}.site-footer h2{color:#fff;font-size:var(--text-sm);font-weight:var(--font-weight-bold);letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}.site-footer a,.site-footer span:not(.brand):not(.brand-mark){color:#ffffffad;font-size:var(--text-sm);margin-top:9px;display:block}.site-footer a:hover{color:var(--color-secondary)}.footer-bottom{border-top:1px solid #ffffff1a;justify-content:space-between;gap:16px;padding-block:18px 28px;display:flex}.footer-bottom span{color:#ffffff8c;font-size:var(--text-xs)}@keyframes markerPulse{0%{opacity:.55;transform:scale(.85)}70%,to{opacity:0;transform:scale(2.25)}}@keyframes dotPulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}.hero-section{background:radial-gradient(circle at 74% 22%, rgba(var(--color-secondary-rgb), .16), transparent 25rem), linear-gradient(145deg, #041c2f 0%, #06263d 52%, #08364f 100%);min-height:min(860px,100svh);padding-block:132px 82px}.hero-section:before{z-index:0;content:"";pointer-events:none;background:linear-gradient(115deg,#0000 0%,#ffffff09 47%,#0000 48%) 0 0/100% 100%,linear-gradient(#ffffff07 1px,#0000 1px) 0 0/96px 96px,linear-gradient(90deg,#ffffff07 1px,#0000 1px) 0 0/96px 96px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0% 78%,#0000 100%);mask-image:linear-gradient(#000 0% 78%,#0000 100%)}.hero-section .signal-line{opacity:.42;border-color:rgba(var(--color-secondary-rgb), .1)}.hero-section .signal-line-one{top:11%;right:-210px}.hero-section .signal-line-two{bottom:-290px;left:-210px}.hero-scanline{opacity:0;background:linear-gradient(to bottom, transparent, rgba(var(--color-secondary-rgb), .46), transparent);width:1px;animation:heroScan 7s var(--ease-water) infinite;position:absolute;top:0;bottom:0;left:53%}.hero-grid{grid-template-columns:minmax(0,.92fr) minmax(470px,1.08fr)}.hero-copy{gap:24px}.hero-copy .hero-headline{max-width:none;font-size:118px;font-weight:var(--font-weight-bold);line-height:.82}.hero-copy p{color:#ffffffb8;max-width:50ch;font-size:var(--text-md)}.hero-visual-glow{background:rgba(var(--color-secondary-rgb), .13);filter:blur(54px);border-radius:999px;width:64%;height:64%;position:absolute;inset:11% -8% auto auto;transform:translateZ(0)}.hero-visual .risk-map-card{z-index:1;transition:transform var(--motion-slow) var(--ease-water), box-shadow var(--motion-slow) var(--ease-water);border-radius:28px;position:relative;box-shadow:0 30px 86px #00000052,inset 0 0 0 1px #ffffff14}.hero-visual:hover .risk-map-card{box-shadow:0 36px 100px #00000061, 0 0 28px rgba(var(--color-secondary-rgb), .12), 0 0 0 1px #ffffff1a inset;transform:rotateX(1deg)rotateY(-1.5deg)translateY(-4px)}.info-card,.solution-card,.workflow-card,.feature-tile,.impact-card{isolation:isolate}.info-card:after,.solution-card:after,.workflow-card:after,.impact-card:after{content:"";background:linear-gradient(90deg, transparent, var(--color-secondary), transparent);opacity:0;height:3px;transition:opacity var(--motion-base) var(--ease-standard), transform var(--motion-base) var(--ease-water);border-radius:999px 999px 0 0;position:absolute;inset:auto 18px 0;transform:scaleX(.4)}.info-card:hover:after,.solution-card:hover:after,.workflow-card:hover:after,.impact-card:hover:after{opacity:1;transform:scaleX(1)}.info-card,.solution-card,.workflow-card,.impact-card{position:relative;overflow:hidden}@keyframes heroScan{0%,to{opacity:0;transform:translate(-18vw)}22%,62%{opacity:.55}58%{transform:translate(18vw)}}@media (width<=1080px){.site-header{grid-template-columns:auto 1fr auto}.desktop-nav,.desktop-actions{display:none}.menu-button{justify-self:end;display:grid}.hero-grid,.split-section,.risk-layout,.priority-layout{grid-template-columns:1fr}.hero-grid{text-align:center;justify-items:center;max-width:780px}.hero-copy{justify-items:center}.hero-copy h1,.hero-copy p{max-width:100%}.hero-stat-row{justify-content:center}.hero-visual{width:min(100%,610px)}.floating-card{display:none}.card-grid.three,.workflow-grid,.impact-grid{grid-template-columns:1fr}.workflow-grid:before{display:none}}@media (width<=760px){.site-header{width:min(100% - 20px,1180px);min-height:56px;padding-inline:12px;top:10px}.brand{font-size:var(--text-lg)}.brand-mark{width:36px;height:36px}.hero-section{min-height:calc(100svh - 24px);padding-block:92px 42px}.hero-grid{gap:24px}.hero-copy{gap:18px}.hero-copy h1{font-size:clamp(36px,12vw,52px);line-height:1.04}.hero-copy p{font-size:var(--text-base)}.hero-stat-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;display:grid}.hero-stat-row div{min-width:0;padding:11px 8px}.hero-stat-row strong{font-size:var(--text-lg)}.hero-stat-row span{font-size:10px}.hero-visual .risk-map-card{transform:none}.is-compact .map-viewport{height:250px}.map-viewport{height:320px}.map-card-head{align-items:flex-start;padding:14px}.map-card-head strong{font-size:var(--text-sm)}.map-popup{width:min(248px,100% - 24px);bottom:12px;right:12px}.section{padding-block:68px}.section-intro h2{font-size:clamp(27px,8vw,38px)}.split-section,.risk-layout,.priority-layout{gap:34px}.score-panel{grid-template-columns:1fr}.score-ring{width:108px;height:108px}.mini-feature-grid,.stats-grid{grid-template-columns:1fr 1fr}.summary-row{grid-template-columns:1fr}.priority-table{gap:10px;padding:14px}.priority-header{display:none}.priority-row{border:1px solid var(--color-border);border-radius:16px;grid-template-columns:1fr;gap:7px;min-height:auto;padding:14px}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column}}@media (width<=480px){.hero-eyebrow,.section-label{font-size:var(--text-xs)}.hero-stat-row{grid-template-columns:1fr}.hero-stat-row div{text-align:left;justify-content:space-between;align-items:center;gap:12px;display:flex}.hero-stat-row span{font-size:var(--text-xs);margin-top:0}.risk-marker{width:36px;height:36px}.marker-pin{width:36px;height:36px;font-size:var(--text-xs)}.mini-feature-grid,.stats-grid,.footer-grid{grid-template-columns:1fr}}@media (width<=1080px){.hero-copy .hero-headline{font-size:92px}}@media (width<=760px){.hero-section{padding-block:106px 96px;overflow:hidden}.hero-grid,.hero-copy,.hero-visual,.hero-visual .risk-map-card{width:100%;min-width:0;max-width:100%}.hero-copy .hero-headline{font-size:64px}.hero-copy p{overflow-wrap:break-word}.hero-stat-row{grid-template-columns:1fr}.hero-stat-row div{text-align:left;justify-content:space-between;align-items:center;gap:12px;min-width:0;display:flex}.hero-stat-row span{font-size:var(--text-xs);margin-top:0}}@media (width<=480px){.hero-copy .hero-headline{font-size:50px}}@media (width<=900px){.features-grid{grid-template-columns:1fr}}.map-preview-loading{min-height:360px;color:var(--color-secondary-dark);background:var(--color-surface);font-weight:var(--font-weight-bold);align-content:center;place-items:center;gap:10px;display:grid}html,body,#root{max-width:100%;overflow-x:hidden}.page-loader{min-height:100dvh;color:var(--color-primary);background:var(--color-background);font-family:var(--font-heading);font-size:var(--text-base);align-content:center;place-items:center;gap:14px;display:grid}