/* UI mobile-first: warna utama mengikuti referensi logo Pintu Air. */
:root{--navy:#080b4c;--navy-2:#11165f;--yellow:#f3ef00;--ink:#151a35;--muted:#737991;--line:#e8eaf2;--surface:#fff;--bg:#f6f7fb;--radius:22px;--shadow:0 12px 32px rgba(8,11,76,.07)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.topbar{height:76px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #eef0f6}.brand{display:flex;align-items:center;gap:10px}.brand img{width:45px;height:45px;object-fit:cover;border-radius:12px}.brand span{display:grid;line-height:1.25}.brand b{font-size:14px;letter-spacing:.1em;color:var(--navy)}.brand small{font-size:11px;color:var(--muted);margin-top:4px}.secure-label{font-size:11px;font-weight:700;color:#4b526d;background:#f5f6fa;border-radius:30px;padding:8px 10px}.secure-label i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#3cbf8a;margin-right:5px}.shell{width:min(100% - 32px,880px);margin:0 auto;padding:28px 0 22px}.hero{position:relative;overflow:hidden;background:var(--navy);color:#fff;border-radius:28px;padding:30px 24px 25px;min-height:360px}.eyebrow{display:block;color:#777f9a;font-size:10px;letter-spacing:.15em;text-transform:uppercase;font-weight:800}.hero .eyebrow,.page-intro .eyebrow{color:var(--yellow)}h1{font-size:clamp(34px,8vw,52px);letter-spacing:-.055em;line-height:1.06;margin:17px 0 14px;font-weight:800}h1 em{font-style:normal;color:var(--yellow)}.hero p,.page-intro p{max-width:360px;color:#c9cce4;font-size:14px;margin:0;line-height:1.7}.hero-art{position:absolute;right:0;bottom:0;width:240px;height:130px;opacity:.95}.art-card{position:absolute;right:22px;bottom:18px;width:180px;height:92px;border:1px solid #454987;border-radius:14px;background:#15195e;padding:12px;transform:rotate(-6deg);display:flex;flex-direction:column}.art-card b{font-size:10px}.art-card span{font-size:9px;color:#b9bddf;margin-top:3px}.art-bars{display:flex;gap:6px;align-items:flex-end;margin-top:auto}.art-bars i{display:block;width:19px;background:var(--yellow);border-radius:4px 4px 1px 1px;height:14px}.art-bars i:nth-child(2){height:22px}.art-bars i:nth-child(3){height:17px}.art-bars i:nth-child(4){height:30px}.art-bars i:nth-child(5){height:24px}.coin{position:absolute;display:grid;place-items:center;border-radius:50%;background:var(--yellow);color:var(--navy);font-weight:900;box-shadow:0 6px 20px #0002}.coin-one{width:43px;height:43px;right:170px;top:4px}.coin-two{width:27px;height:27px;right:28px;top:5px;background:#fff}.choice-section{padding:29px 0 10px}.section-heading,.results-head,.table-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-heading h2,.results h2{margin:4px 0 0;font-size:23px;letter-spacing:-.04em}.step-count,.row-counter{font-size:11px;color:var(--muted);background:#eceef6;padding:7px 10px;border-radius:9px;white-space:nowrap}.choice-card{display:flex;align-items:center;gap:13px;padding:17px 15px;background:#fff;border:1px solid #eceef5;border-radius:19px;margin-top:13px;box-shadow:0 4px 14px #080b4c04;transition:transform .18s,border-color .18s}.choice-card:active{transform:scale(.99)}.choice-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;flex-shrink:0}.choice-icon.blue{background:#e8ebff;color:var(--navy)}.choice-icon.yellow{background:#fffed0;color:#555300}.choice-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.choice-copy{display:grid;gap:3px;min-width:0;flex:1}.choice-copy b{font-size:14px}.choice-copy small{font-size:11px;color:var(--muted)}.chip{width:max-content;max-width:100%;font-size:10px;font-weight:700;color:var(--navy);background:#f0f1ff;padding:4px 7px;border-radius:6px;margin-top:5px}.arrow{font-size:22px;color:#9ba0b4}.notice{display:flex;align-items:flex-start;gap:10px;margin-top:17px;padding:13px 14px;background:#fffce0;border:1px solid #f1ed9c;border-radius:14px}.notice-icon{width:19px;height:19px;display:grid;place-items:center;border:1px solid #a09d00;border-radius:50%;font-size:12px;font-weight:800;color:#777400;flex-shrink:0}.notice p{font-size:11px;color:#626025;margin:0;line-height:1.6}.back-link{display:inline-block;font-size:12px;color:#626982;font-weight:700;margin:0 0 23px}.page-intro{padding:4px 3px 23px}.page-intro h1{font-size:clamp(34px,8vw,46px);color:var(--navy);margin:10px 0}.page-intro p{color:var(--muted);font-size:13px}.page-intro h1 em{color:#5a5fa3}.panel{padding:23px 19px;background:#fff;border:1px solid #eaecf4;border-radius:23px;box-shadow:var(--shadow)}label{display:block;font-size:12px;font-weight:800;margin:0 0 9px;color:#292e49}.money-input,.select-wrap{height:54px;border:1px solid #dfe2ee;border-radius:13px;display:flex;align-items:center;background:#fff;position:relative;transition:border .2s,box-shadow .2s}.money-input:focus-within,.select-wrap:focus-within{border-color:#4b51a1;box-shadow:0 0 0 3px #080b4c0e}.money-input>span{padding-left:15px;color:var(--muted);font-size:13px;font-weight:800}.money-input input{width:100%;height:100%;min-width:0;border:0;outline:0;background:transparent;padding:0 14px 0 9px;font-size:16px;font-weight:700;color:var(--navy)}input::placeholder{color:#b1b5c6;font-weight:500}.field-help{display:block;font-size:10px;color:#898fa5;margin:7px 0 22px}.select-wrap{margin-bottom:0}.select-wrap select{appearance:none;-webkit-appearance:none;width:100%;height:100%;padding:0 42px 0 14px;background:transparent;border:0;outline:0;color:#343a57;font-size:13px;font-weight:600}.select-wrap select:invalid{color:#a2a7ba}.select-wrap>span{position:absolute;right:15px;color:#6e7490;pointer-events:none;font-size:18px}.rule-card{display:flex;align-items:center;gap:10px;margin:22px 0;padding:13px 12px;border-radius:14px;background:#f7f8fd;border:1px solid #eef0f8}.rule-icon{width:33px;height:33px;display:grid;place-items:center;background:#e9ebff;border-radius:10px;color:var(--navy);font-weight:900}.rule-card div{flex:1;min-width:0;display:grid;gap:3px}.rule-card b{font-size:11px}.rule-card small{font-size:10px;color:var(--muted)}.auto-tag{font-size:9px;font-weight:800;color:#276e54;background:#e0f7eb;padding:5px 6px;border-radius:6px;white-space:nowrap}.primary-btn,.secondary-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:53px;border:0;border-radius:14px;background:var(--navy);color:#fff;font-weight:800;font-size:13px;cursor:pointer;transition:transform .15s,opacity .15s}.primary-btn span{font-size:18px;color:var(--yellow)}.primary-btn:active,.secondary-btn:active{transform:scale(.99)}.form-error{font-size:12px;color:#b42318;margin:12px 0 0}.results{margin-top:28px;animation:rise .35s ease both}.results-head{align-items:flex-end;margin-bottom:15px}.results h2{font-size:21px}.text-btn{border:0;background:transparent;color:var(--navy);font-weight:800;font-size:11px;padding:9px 0;white-space:nowrap;cursor:pointer}.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.summary-card{padding:15px 13px;border:1px solid #e8eaf3;border-radius:16px;background:#fff;min-width:0}.summary-card small,.summary-card span{display:block;color:var(--muted);font-size:10px}.summary-card strong{display:block;font-size:clamp(16px,4.3vw,22px);letter-spacing:-.04em;color:var(--navy);margin:7px 0;overflow-wrap:anywhere}.summary-card span{font-size:9px}.primary-summary{background:var(--navy);border-color:var(--navy)}.primary-summary small,.primary-summary span{color:#d0d3ee}.primary-summary strong{color:var(--yellow)}.table-heading{margin:25px 0 12px}.table-heading h3{font-size:16px;margin:0 0 3px}.table-heading p{font-size:10px;color:var(--muted);margin:0}.table-wrap{overflow:auto;border:1px solid #e7e9f2;border-radius:14px;background:#fff;max-width:100%;-webkit-overflow-scrolling:touch}.table-wrap table{border-collapse:separate;border-spacing:0;width:100%;min-width:710px;font-size:11px;text-align:right;font-variant-numeric:tabular-nums}.table-wrap th{padding:13px 12px;background:#f1f3fa;color:#565d79;font-size:10px;white-space:nowrap;font-weight:800}.table-wrap th:first-child,.table-wrap td:first-child{text-align:left}.table-wrap td{padding:12px;border-top:1px solid #eff0f6;white-space:nowrap;color:#353a54}.table-wrap tbody tr:nth-child(even){background:#fafbfe}.table-wrap td:last-child{font-weight:800;color:var(--navy)}.pagination{display:flex;justify-content:center;align-items:center;gap:6px;margin:13px 0 17px;flex-wrap:wrap}.pagination button{min-width:31px;height:31px;padding:0 8px;border:1px solid #e3e6f0;border-radius:9px;background:#fff;color:#555c78;font-size:11px;cursor:pointer}.pagination button[aria-current="page"]{background:var(--navy);border-color:var(--navy);color:#fff}.pagination button:disabled{opacity:.35;cursor:default}.secondary-btn{height:47px;background:#fff;border:1px solid #dfe2ee;color:var(--navy);margin-top:12px}.footer{display:flex;align-items:center;gap:9px;padding:27px 2px 5px;color:#7f859b;font-size:10px}.footer img{width:25px;height:25px;border-radius:7px;object-fit:cover}.footer small{margin-left:auto;text-align:right;font-size:9px}.footer span{font-weight:700}.hidden,[hidden]{display:none!important}@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(min-width:650px){.topbar{padding:0 max(24px,calc((100vw - 880px)/2))}.shell{padding-top:36px}.hero{padding:43px 42px;min-height:360px}.hero-art{transform:scale(1.25);transform-origin:bottom right;right:30px}.choice-section{padding-top:34px}.choice-card{padding:19px 20px}.panel{padding:28px;max-width:680px}.results{max-width:880px}.summary-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.summary-card{padding:17px}.table-wrap table{font-size:12px}.page-intro{padding-bottom:25px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Revisi UI: tingkatkan kontras label kuning pada latar terang dan hilangkan ilustrasi dekoratif. */
.page-intro .eyebrow{color:#777500}
.hero-art,.footer{display:none!important}
/* REVISI: ringkas area hero agar tidak menyisakan ruang kosong berlebihan. */
.hero{min-height:0;padding:30px 24px 34px}
.hero h1{margin-top:17px;margin-bottom:14px}
.hero p{max-width:440px}
@media(min-width:650px){.hero{min-height:0;padding:42px 42px 46px}}