:root{--navy:#061c34;--navy2:#09395e;--blue:#0d5888;--teal:#04a99c;--aqua:#69e5d8;--ink:#0b2b43;--muted:#668297;--bg:#f2f7fb;--white:#fff;--line:#d9e8f1;--gold:#ffdc93;--red:#bd3547;--shadow:0 14px 40px rgba(9,52,83,.06)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 'DM Sans',system-ui,Arial,sans-serif}h1,h2,h3,h4,strong,.brand,.btn,.stat strong{font-family:'Outfit','DM Sans',sans-serif}h1,h2,h3{line-height:1.13;letter-spacing:-.025em}h1{font-size:clamp(2.3rem,4vw,4rem);margin:10px 0 20px}h2{font-size:clamp(1.8rem,3vw,2.6rem)}h3{font-size:1.2rem;margin:8px 0 12px}a{color:#087e88;text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{font:inherit}button{cursor:pointer}input,select,textarea{width:100%;background:#edf4fb;color:#0d2e44;border:1px solid #d1e2ee;border-radius:12px;padding:13px 15px;outline:none}input:focus,textarea:focus,select:focus{border-color:var(--teal);box-shadow:0 0 0 3px #03a99c22}label{display:flex;flex-direction:column;gap:7px;font-weight:700;font-size:.89rem}label.checkbox-row{flex-direction:row;align-items:center;gap:12px}label.checkbox-row input{width:auto}small,.muted{color:var(--muted)}small{font-size:.8em}p{margin:10px 0 20px}hr{border:0;border-top:1px solid var(--line);margin:22px 0}.eyebrow{font-weight:900;font-size:.73rem;letter-spacing:.17em;text-transform:uppercase;color:#009e97}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(108deg,#0d5985,#06a99a);border:0;border-radius:12px;padding:13px 22px;color:white;font-weight:800;font-size:.92rem;text-decoration:none;white-space:nowrap;box-shadow:0 10px 25px #007a8f22}.btn:hover{text-decoration:none;filter:brightness(1.06)}.btn.gold{background:var(--gold);color:var(--navy)}.btn.outline{background:transparent;border:1px solid #648498;color:white}.btn.subtle{background:#f6fbff;color:#12476b;border:1px solid #d2e1ec;box-shadow:none}.btn.small{padding:7px 11px;font-size:.78rem}.topbar{background:#fff;min-height:82px;display:flex;align-items:center;padding:14px max(4vw,20px);justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);position:relative;z-index:5}.brand{display:inline-flex;gap:13px;align-items:center;color:var(--ink);font-size:1.6rem;font-weight:900;line-height:1;text-decoration:none}.brand:hover{text-decoration:none}.brand small{display:block;font-size:.52rem;letter-spacing:.23em;color:#008f91;margin-top:5px}.mark{background:linear-gradient(135deg,#073959,#04a79f);border-radius:14px;width:52px;height:52px;display:inline-grid;place-items:center;color:white;font-weight:900;font-size:2rem;box-shadow:0 15px 25px #046d7830}.top-links,.top-actions{display:flex;align-items:center;gap:22px;font-weight:700}.top-links a{color:#4a6d83}.top-actions{gap:12px}.lang-switch{display:inline-flex;gap:5px;background:#edf5f9;border-radius:14px;padding:5px}.lang-switch a{padding:5px 11px;border-radius:10px;color:#41657f;font-size:.8rem;font-weight:800}.lang-switch .on{background:#073d63;color:white}.hero{min-height:630px;padding:70px max(4vw,20px);display:grid;grid-template-columns:1fr .9fr;gap:min(6vw,90px);align-items:center;background:linear-gradient(90deg,#061b34f5,#052e45ce),url('/assets/img/hero-bank-dc.webp') center/cover;color:white}.hero h1{font-size:clamp(2.7rem,4.7vw,5.1rem);line-height:1.12;max-width:750px}.hero h1 em{font-style:normal;color:var(--aqua)}.hero-copy p{font-size:1.13rem;max-width:660px;line-height:1.85;color:#d6ecf5}.pill-gold{display:inline-flex;background:#ffffff19;border:1px solid #6e9bb066;border-radius:25px;padding:10px 16px;color:var(--gold);font-size:.75rem;font-weight:900;letter-spacing:.13em}.actions{display:flex;gap:15px;flex-wrap:wrap;margin-top:30px}.hero-visual{background:linear-gradient(145deg,#114b66e8,#04304ae8);border:1px solid #8abed257;border-radius:30px;padding:40px;box-shadow:0 30px 70px #0007;transform:rotate(2deg)}.hero-visual .eyebrow{margin-top:35px;color:var(--aqua)}.hero-visual h2{color:white}.visual-top{display:flex;align-items:center;gap:12px}.visual-top .mark{width:44px;height:44px;font-size:1.6rem}.chart-columns{display:flex;align-items:flex-end;gap:14px;height:150px;margin:35px 0 15px;border-bottom:1px solid #356781}.chart-columns span{flex:1;border-radius:8px 8px 0 0;background:linear-gradient(180deg,#46decf,#039ab9);height:var(--h,55%);box-shadow:0 0 22px #00d5bc35}.chart-columns span:nth-child(2){--h:80%}.chart-columns span:nth-child(3){--h:65%}.chart-columns span:nth-child(4){--h:95%}.chart-columns span:nth-child(5){--h:78%}.chart-columns span:nth-child(6){--h:100%}.visual-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.visual-stats div{border:1px solid #6690a333;border-radius:10px;padding:10px;color:#b6d4e1;font-size:.75rem}.visual-stats b{display:block;color:#fff;font-size:1.3rem}.section{padding:70px max(5vw,22px);max-width:1560px;margin:auto;scroll-margin-top:30px}.section h2{margin:8px 0 34px}.section-alt{background:linear-gradient(135deg,#e7f8f5,#ebf3fa);max-width:none}.feature-grid,.package-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.panel,.package-card{background:white;border:1px solid var(--line);border-radius:21px;padding:25px;box-shadow:var(--shadow);margin-bottom:18px}.package-card{display:flex;flex-direction:column;min-height:375px}.package-card.featured{border-color:#0ac1b0;box-shadow:0 18px 50px #009c991b;transform:translateY(-6px)}.package-card h3{font-size:1.8rem}.package-price{font:900 2.35rem Outfit;color:#073f64;margin:5px 0 14px}.package-card ul{padding-left:20px;line-height:2;flex:1}.package-card li::marker{color:var(--teal)}.package-card .btn{width:100%}.calculator{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:end;max-width:1200px}.calc-output{background:linear-gradient(115deg,#0b5375,#07a99a);color:white;padding:16px;border-radius:15px}.calc-output strong{display:block;font:900 1.7rem Outfit}.calc-output small{display:block;color:#dcfff8}.faq{max-width:920px;margin:auto}.faq details{border-top:1px solid var(--line);padding:15px 0}.faq summary{cursor:pointer;font-weight:800}.site-footer{padding:30px 5vw;background:#061d35;color:#a7c5d8;font-size:.85rem}.site-footer a{color:var(--aqua)}.maya-widget{position:fixed;bottom:23px;right:22px;z-index:20}.maya-widget>button{border:0;background:white;box-shadow:0 10px 40px #001c3840;border-radius:50px;padding:8px 18px 8px 7px;display:flex;align-items:center;gap:9px;font-weight:800;color:#0b476b}.maya-widget img{height:49px;width:49px;border-radius:50%;object-fit:cover}.maya-widget>div{width:320px;max-width:calc(100vw - 30px);background:white;border:1px solid var(--line);border-radius:18px;padding:20px;margin-bottom:10px;box-shadow:0 16px 50px #042b4b44}.maya-options{display:flex;flex-wrap:wrap;gap:7px}.maya-options button{border:1px solid var(--line);border-radius:20px;background:#edf8f7;padding:7px;color:#176e77}.auth-grid{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - 80px)}.auth-art{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:55px 7%;background:linear-gradient(125deg,#06334bc9,#061e35ee),url('/assets/img/hero-masa-depan.webp') center/cover;color:white}.auth-art .logo-big{font:900 1.8rem Outfit}.auth-art .logo-big span{font-size:.7em;letter-spacing:.12em}.auth-motto h1{max-width:600px}.auth-motto p{font-size:1.5rem;color:var(--aqua);font-weight:800}.auth-box{display:flex;flex-direction:column;justify-content:center;max-width:560px;margin:auto;width:100%;padding:65px 30px}.auth-box h1{font-size:2.9rem}.auth-box form{margin:28px 0 12px}.stack{display:flex;flex-direction:column;gap:20px}.stack .btn{width:100%}.registration{margin:55px auto}.narrow{max-width:730px;margin:25px auto}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.form-grid h3,.form-grid>p,.form-grid>.btn,.form-grid>.wide{grid-column:1/-1}.form-grid>.btn{width:fit-content}.setup-body{background:#f2f7fa}.setup-wrap{max-width:840px;margin:5vh auto;padding:30px}.setup-wrap>.logo{font:900 2.3rem Outfit;color:#063756}.setup-wrap>.logo>span{font-size:1.3rem}.setup-wrap small{display:block;font-size:.7rem}.setup-wrap .form-grid{margin-top:20px}.dashboard-layout{display:grid;grid-template-columns:245px minmax(0,1fr);min-height:100vh}.sidebar{background:var(--navy);padding:24px 14px;color:white;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:auto}.sidebar .brand{color:white;font-size:1.35rem;margin:0 10px 40px}.sidebar .mark{width:42px;height:42px;font-size:1.45rem}.sidebar-caption{color:#7ea6bf;letter-spacing:.17em;font-weight:900;font-size:.72rem;margin:0 14px 14px}.side-nav{display:flex;flex-direction:column;gap:7px}.nav-item{display:flex;gap:13px;align-items:center;color:#b5d0e0;border-radius:12px;padding:11px 14px;font-size:.85rem;font-weight:700}.nav-item:hover,.nav-item.current{background:linear-gradient(90deg,#0e7394,#00a697);color:white;text-decoration:none}.nav-ico{font-size:1.2rem;width:20px;text-align:center}.side-footer{margin-top:auto;border-top:1px solid #ffffff20;padding:20px 10px;color:#a2d7d9;font-size:.72rem;font-weight:800}.side-footer a{display:block;margin-top:10px;color:#d4e3ea}.status-dot{display:inline-block;width:7px;height:7px;background:#25dca7;border-radius:50%;margin-right:6px}.main-shell{min-width:0}.app-top{height:78px;background:white;display:flex;align-items:center;justify-content:space-between;padding:10px 4vw;border-bottom:1px solid var(--line);gap:14px}.app-breadcrumb{color:#50748a;font-size:.8rem;font-weight:800}.app-breadcrumb span{padding:0 5px}.app-user{display:flex;align-items:center;gap:15px}.app-user form{margin:0}.logout{background:white;border:1px solid var(--line);border-radius:9px;padding:7px 13px;color:var(--navy)}.content{max-width:1500px;margin:auto;padding:40px 4vw 80px}.page-heading{margin-bottom:26px}.page-heading h1{font-size:clamp(2.4rem,4vw,3.8rem);margin:10px 0}.page-heading>p{color:var(--muted)}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}.stat{min-height:132px;padding:22px;background:white;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.stat small{display:block;font-weight:900;color:#7793a6}.stat strong{display:block;font-size:clamp(1.5rem,2.5vw,2.1rem);margin:11px 0 1px;line-height:1.16;color:#06496f}.stat span{font-size:.72rem;color:#899ca7}.stat.highlight{background:linear-gradient(125deg,#075078,#06a596);border:0}.stat.highlight strong,.stat.highlight small,.stat.highlight span{color:white}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}.kv{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--line)}.big-number{font:900 2.4rem Outfit;margin:12px 0}.progress{height:12px;border-radius:12px;overflow:hidden;background:#e5f2f1;margin:12px 0 22px}.progress>span{display:block;background:linear-gradient(90deg,#0c6488,#06b7a0);height:100%}.task-row{display:flex;justify-content:space-between;gap:9px;padding:12px 0;border-bottom:1px solid var(--line);align-items:center}.task-row small{display:block}.task-row .btn{padding:8px}.button-row{display:flex;gap:5px;flex-wrap:wrap}.notice{background:#e9f8f4;border:1px solid #bbe9e0;border-radius:13px;padding:15px 18px;margin:0 0 22px;color:#176e71}.notice.warning{background:#fff8e7;color:#805e1a;border-color:#f2dea5}.notice.error{background:#fff1ef;color:#a73040;border-color:#f2c3c1}.table-scroll{max-width:100%;overflow:auto}table{width:100%;border-collapse:collapse;font-size:.84rem;min-width:600px}th{text-align:left;color:#718fa2;text-transform:uppercase;font-size:.69rem;letter-spacing:.08em;border-bottom:1px solid var(--line)}th,td{padding:14px 12px;vertical-align:middle}td{border-bottom:1px solid #e6eef4}td small{display:block}.badge{display:inline-block;padding:4px 11px;border-radius:18px;background:#e9f3f6;font-size:.7rem;font-weight:800;color:#195e7d}.quick-links{display:flex;flex-direction:column}.quick-links a{padding:13px;border-bottom:1px solid var(--line);font-weight:800}.ref-link{background:#edf8f7;border:1px solid var(--line);padding:13px;border-radius:11px;overflow-wrap:anywhere}.inline-form{display:flex;flex-direction:column;gap:6px}.inline-form input{min-width:140px;padding:8px}.link-danger{border:0;color:var(--red);background:transparent;padding:3px}.search-line{display:flex;gap:9px;margin-bottom:20px}.mobile-menu{display:none}.package-grid .panel{margin:0}
@media(max-width:1050px){.top-links{display:none}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1fr}.hero-visual{max-width:650px}.feature-grid,.package-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.calculator{grid-template-columns:repeat(2,1fr)}}
@media(max-width:750px){.topbar{flex-wrap:wrap}.top-actions{flex-wrap:wrap}.hero{padding:60px 22px}.hero-visual{transform:none;padding:25px}.feature-grid,.package-grid,.two-col{grid-template-columns:1fr}.package-card.featured{transform:none}.calculator{grid-template-columns:1fr}.auth-grid{grid-template-columns:1fr}.auth-art{min-height:300px}.auth-art .auth-motto h1{font-size:2.6rem}.auth-box{padding:35px 22px}.dashboard-layout{display:block}.sidebar{position:fixed;z-index:30;transform:translateX(-100%);width:245px;transition:transform .2s}.sidebar.open{transform:translateX(0)}.mobile-menu{display:inline-block;background:#eaf4f5;border:0;border-radius:10px;padding:9px}.app-top{height:auto;min-height:68px;padding:10px 15px}.app-breadcrumb{display:none}.app-user{margin-left:auto}.app-user strong{max-width:90px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.content{padding:25px 15px}.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.stat{padding:15px;min-height:120px}.stat strong{font-size:1.35rem}.form-grid{grid-template-columns:1fr}.form-grid>.btn{width:100%}.search-line{flex-direction:column}.maya-widget{right:10px;bottom:10px}}

/* BRAND IDENTITY RELEASE · v2.0.1. All portals share the same image lockups. */
.brand{flex-shrink:0;line-height:1;min-width:0;display:inline-flex;align-items:center;justify-content:flex-start;max-width:100%}
.brand-image{display:block;width:clamp(176px,15vw,224px);max-width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 3px 9px #06416a11)}
.topbar .brand-image{width:208px}
.sidebar .brand{margin:0 4px 34px;min-height:52px}
.sidebar .brand-image{width:208px;filter:none}
.hero-logo{display:block;width:clamp(178px,21vw,235px);height:auto;max-width:100%;object-fit:contain}
.visual-top .hero-logo{max-height:76px}
.auth-logo{display:block;width:min(260px,76vw);height:auto;max-height:112px;object-fit:contain;object-position:left center}
.auth-art .logo-big{display:block;margin:0;padding:0}
.auth-art .logo-big a{display:inline-block;max-width:100%}
.setup-logo{display:block;width:min(290px,78vw);height:auto;object-fit:contain}
.setup-wrap>.logo{max-width:100%;font:inherit}
@media(min-width:751px) and (max-width:1120px){.topbar{gap:10px;padding-inline:22px}.topbar .brand-image{width:180px}.top-actions{gap:7px}}
@media(max-width:750px){
  .topbar{gap:12px;padding:12px 14px;min-height:68px}
  .topbar .brand-image{width:168px;max-width:44vw}
  .sidebar .brand-image{width:205px}
  .auth-art{padding:34px 6%;min-height:260px}
  .auth-logo{width:216px}
  .hero-logo{width:195px}
  .app-top{gap:8px}
  .app-user{gap:7px}
  .app-user .lang-switch{padding:3px;gap:1px}
  .app-user .lang-switch a{padding:5px 7px}
  .app-user strong{font-size:.82rem;max-width:76px}
  .content{max-width:100%;overflow-wrap:anywhere}
  .panel{padding:18px}
  .page-heading h1{font-size:clamp(2rem,8vw,2.7rem)}
  .btn{white-space:normal;text-align:center}
}
@media(max-width:400px){
  .topbar .brand-image{width:148px;max-width:49vw}
  .top-actions .btn{padding:10px;font-size:.77rem}
  .stats{grid-template-columns:1fr 1fr}
  .stat{min-width:0}
  .stat strong{font-size:1.13rem;overflow-wrap:anywhere}
}
