/* =====================================================================
   KELURAHAN APP - CONSOLIDATED STYLES
   Gabungan: app.min.css + app-auth-split.css + enhancement.
   Satu file untuk memudahkan maintenance.
   ===================================================================== */
/* ---- app.min.css ---- */
@keyframes badgeWave{0%,60%,to{transform:rotate(0deg)}10%,30%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}40%{transform:rotate(-4deg)}}@keyframes wizardFade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}:root{--container:1200px;--primary:#1d56c9;--primary-700:#13408f;--primary-800:#0a2a66;--primary-500:#2f6df0;--primary-soft:#eef2fb;--bg:#f4f7fd;--surface:#ffffff;--text:#10172a;--muted:#586173;--field-bg:#f8fafc;--border:#e7ebf3;--shadow:0 10px 30px -12px rgba(16, 23, 42, 0.12);--shadow-sm:0 6px 18px -8px rgba(16, 23, 42, 0.1);--shadow-lg:0 20px 48px -10px rgba(16, 23, 42, 0.18);--radius:22px;--radius-sm:16px}*,::after,::before{box-sizing:border-box;transition:background-color .2s ease-out,box-shadow .2s ease-out,transform .15s ease-out,border-color .2s ease-out,color .2s ease-out}body,html{height:100%;overflow-x:hidden}body{font-family:"Plus Jakarta Sans","Segoe UI",system-ui,-apple-system,Arial,sans-serif;color:var(--text);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#edf2fb;background-image:radial-gradient(circle,rgba(29,86,201,.12) 1px,transparent 1px);background-size:28px 28px;background-attachment:fixed;background:var(--rds-soft)!important}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}ul{padding:0;list-style:none}body,h1,h2,h3,h4,p,ul{margin:0}:focus-visible{outline:3px solid rgba(46,115,255,.35);outline-offset:2px}.container{width:min(var(--container),calc(100% - 48px));margin-inline:auto}.stack,.stack-lg{display:grid;gap:12px}.stack-lg{gap:18px}.muted{color:var(--muted)}.hidden{display:none!important}body.is-admin,body.is-staf,body.is-warga{--bg:#f5f7fb;--border:#e2e8f0;--shadow:none;--shadow-sm:none;background-image:none}body.is-warga{background-color:#f5f7fb}#content{min-height:calc(100vh - 320px);padding:10px 0 40px}.header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.96);backdrop-filter:saturate(180%) blur(16px);border-bottom:2px solid rgba(29,86,201,.1);transition:box-shadow .3s ease}.header.scrolled{box-shadow:0 4px 24px rgba(29,86,201,.12)}.header-container{width:min(1200px,calc(100% - 48px));margin-inline:auto}.nav-link.active::after,.nav-link:hover::after{transform:translateX(-50%) scaleX(1)}.btn-login{background:linear-gradient(135deg,#1d56c9,#2f6df0)!important}.btn-login:hover{background:linear-gradient(135deg,#1348b0,#1d56c9)!important}.dropdown-item:hover i{background:#1d56c9;color:#fff}.footer{background:#060d1f;margin-top:40px;position:relative;overflow:hidden}.footer::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.04) 1px,transparent 1px);background-size:24px 24px;pointer-events:none;z-index:0}.footer-cta,.footer-wave{position:relative;z-index:1}.footer-wave{display:block;width:100%;line-height:0;margin-bottom:-2px}.footer-cta{background:linear-gradient(135deg,#0a2a66 0,#1d56c9 50%,#2f74dd 100%);color:#fff;padding:54px 0;overflow:hidden}.footer-cta::after,.footer-cta::before{content:"";position:absolute;border-radius:50%;pointer-events:none}.footer-cta::before{top:-60px;right:-60px;width:280px;height:280px;background:rgba(255,255,255,.06)}.footer-cta::after{bottom:-80px;left:-40px;width:220px;height:220px;background:rgba(255,255,255,.04)}.footer-cta-inner{text-align:center;display:grid;gap:12px;justify-items:center;position:relative;z-index:1}.footer-cta-inner h3{font-size:24px;font-weight:900;color:#fff;font-family:"Plus Jakarta Sans",sans-serif}.footer-cta-inner p{max-width:640px;opacity:.92;font-size:14.5px;color:rgba(255,255,255,.9);line-height:1.6}.footer-cta-inner .btn{background:rgba(255,255,255,.15);border:2px solid rgba(255,255,255,.4);color:#fff;padding:12px 28px;border-radius:14px;font-weight:800;font-size:14px;transition:background .2s,transform .2s}.footer-cta-inner .btn:hover{background:rgba(255,255,255,.28);transform:translateY(-3px)}.footer-container{width:min(1200px,calc(100% - 48px));margin-inline:auto;padding:52px 0 24px;position:relative;z-index:1}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}.footer-col:first-child{padding-right:20px;border-right:1px solid rgba(255,255,255,.07)}.footer-brand-logo{width:52px;height:52px;object-fit:contain;margin-bottom:14px;filter:brightness(1.2)}.footer-col h4,.footer-list li{display:flex;align-items:center;font-size:13px}.footer-col h4{color:#fff;font-weight:900;margin-bottom:14px;gap:9px;text-transform:uppercase;letter-spacing:.06em;font-family:"Plus Jakarta Sans",sans-serif}.footer-col h4::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(47,116,221,.4),transparent)}.footer-col a,.footer-col h4 i,.footer-col p{color:#5e9bea;font-size:13px}.footer-col p{color:#94a3b8;line-height:1.75}.footer-col a{color:#94a3b8;transition:color .2s,transform .2s;display:inline-block}.footer-col a:hover{color:#5e9bea;transform:translateX(3px)}.footer-list{display:grid;gap:10px}.footer-list li{gap:8px;color:#94a3b8}.footer-list li i{color:#5e9bea;font-size:12px;width:14px;flex-shrink:0}.footer-bottom,.footer-social{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}.footer-social a{width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);display:flex!important;align-items:center;justify-content:center;color:#94a3b8;font-size:15px;transition:background .2s,color .2s,transform .2s,border-color .2s;transform:none;flex-shrink:0;line-height:1}.footer-social a:hover{background:linear-gradient(135deg,#1d56c9,#2f74dd);border-color:transparent;color:#fff;transform:translateY(-3px)!important}.footer-bottom{text-align:center;padding:18px 0;margin-top:28px;border-top:1px solid rgba(255,255,255,.08);font-size:12.5px;color:rgba(148,163,184,.7);position:relative;z-index:1;align-items:center;justify-content:center;gap:6px}.footer-bottom strong{color:rgba(148,163,184,.9)}.footer-bottom a{color:#5e9bea}.footer-bottom a:hover{color:#aacdf5}@media (max-width:900px){.header-container{padding:10px 0}.brand{min-width:auto}.brand-sub,.nav-link::after{display:none}.menu-toggle{display:inline-flex}body.nav-open{overflow:hidden}.navbar{position:fixed;top:var(--header-h, 72px);left:0;right:0;bottom:0;height:calc(100dvh - var(--header-h, 72px));background:#fff;border-top:2px solid rgba(29,86,201,.1);box-shadow:0 18px 40px rgba(15,23,42,.18);opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity 220ms ease-out,transform 220ms cubic-bezier(.23,1,.32,1);z-index:99999;overflow-y:auto;overscroll-behavior:contain;display:block!important;padding:8px 0 20px}.navbar.show{opacity:1;transform:translateY(0);pointer-events:auto}.nav-list{width:100%;flex-direction:column;align-items:stretch;gap:0}.nav-item{border-bottom:1px solid rgba(29,86,201,.06)}.nav-link{width:100%;justify-content:flex-start;padding:14px 20px;border-radius:0}.nav-link span{flex:1}.dropdown-icon{margin-left:auto}.click-dropdown.open>.nav-link{background:rgba(29,86,201,.05);color:#1d56c9}.dropdown-menu{position:static;display:block;border:0;box-shadow:none;padding:0;background:rgba(29,86,201,.03);max-height:0;overflow:hidden;border-radius:0;transition:max-height 360ms cubic-bezier(.23,1,.32,1)}.click-dropdown.open>.dropdown-menu{max-height:520px;opacity:1;transform:none;pointer-events:auto}.dropdown-item{padding:12px 20px 12px 52px;border-radius:0;border-bottom:1px solid rgba(29,86,201,.05)}.dropdown-item:hover{transform:none}.btn-login{margin:12px 16px 4px!important;justify-content:center!important;padding:13px 20px!important;border-radius:14px!important}.footer-grid{grid-template-columns:1fr 1fr;gap:24px}.footer-col:first-child{border-right:none;padding-right:0}}@media (max-width:600px){#content{padding:8px 0 34px}.footer-grid{grid-template-columns:1fr}}@media (hover:hover) and (pointer:fine){.nav-link:hover{background:rgba(29,86,201,.08);color:#1d56c9}.dropdown-item:hover{background:rgba(29,86,201,.07);color:#1d56c9}}@media (hover:none),(pointer:coarse){.dropdown-item:hover,.nav-link:hover{background:0 0;color:var(--text);transform:none}.dropdown-item:active,.nav-link:active{background:rgba(29,86,201,.08)}}.container{margin-left:auto;margin-right:auto}.container,.header-container{max-width:1200px}.footer-container{max-width:1200px;margin-left:auto;margin-right:auto}#header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.96);-webkit-backdrop-filter:saturate(180%) blur(16px);transition:box-shadow .3s ease,background .3s ease}#header.scrolled{background:rgba(255,255,255,.98);box-shadow:0 4px 24px rgba(29,86,201,.12);border-bottom-color:rgba(29,86,201,.15)}.brand,.header-container{display:flex;align-items:center}.header-container{max-width:var(--container);margin:0 auto;padding:10px 24px;justify-content:space-between;gap:16px}.brand{gap:12px;min-width:260px;text-decoration:none}.brand-logo{width:52px;height:52px;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(29,86,201,.2))}.brand-title{display:flex;align-items:center;gap:8px;font-weight:900;font-size:16px;line-height:1.2;text-transform:uppercase;color:#0a2a66;letter-spacing:.01em;font-family:"Plus Jakarta Sans",sans-serif}.brand-sub,.brand-title i{color:#1d56c9}.brand-sub{margin-top:2px;display:flex;gap:6px;align-items:center;font-size:10.5px;font-weight:700;letter-spacing:.04em}.menu-toggle{display:none;border:1.5px solid #e0e7ff;background:#fff;border-radius:12px;padding:10px 12px;cursor:pointer;box-shadow:0 2px 8px rgba(29,86,201,.1);transition:background .2s}.menu-toggle:hover{background:#f0f4ff}.menu-toggle i{font-size:18px;color:#1d56c9}.nav-list,.navbar{display:flex;align-items:center}.nav-list{gap:4px;list-style:none;margin:0;padding:0}.nav-item,.nav-link{position:relative}.nav-link{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;font-size:13.5px;font-weight:700;border-radius:12px;color:#1e293b;font-family:"Plus Jakarta Sans",sans-serif;transition:background .2s ease,color .2s ease,transform .1s ease}.nav-link i{font-size:13px;opacity:.85}.nav-link::after{content:"";position:absolute;bottom:4px;left:50%;transform:translateX(-50%) scaleX(0);width:60%;height:2.5px;background:linear-gradient(90deg,#1d56c9,#2f74dd);border-radius:2px;transition:transform .25s ease}.dropdown-item i,.nav-link.active,.nav-link:hover{background:rgba(29,86,201,.08);color:#1d56c9}.btn-login{background:linear-gradient(135deg,#1d56c9 0,#2f6df0 100%)!important;color:#fff!important;padding:10px 18px!important;border-radius:12px!important;box-shadow:0 4px 14px rgba(29,86,201,.3)!important;font-weight:800!important;transition:transform .2s,box-shadow .2s,background .2s!important}.btn-login:hover{background:linear-gradient(135deg,#1348b0 0,#1d56c9 100%)!important;transform:translateY(-2px)!important;box-shadow:0 6px 20px rgba(29,86,201,.4)!important}.btn-login::after{display:none!important}.dropdown-icon{font-size:11px;opacity:.7;transition:transform .25s ease}.dropdown-menu{position:absolute;top:calc(100% + 12px);left:0;min-width:240px;padding:10px;background:#fff;border:1px solid rgba(29,86,201,.12);border-radius:18px;box-shadow:0 16px 40px rgba(29,86,201,.15);display:none;transform-origin:top left;transform:translateY(8px) scale(.97);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}.click-dropdown.open>.dropdown-menu{display:block;opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.click-dropdown.open .dropdown-icon{transform:rotate(180deg)}.dropdown-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;font-size:13.5px;font-weight:700;color:#1e293b;font-family:"Plus Jakarta Sans",sans-serif;white-space:nowrap;transition:background .18s ease,color .18s ease,transform .1s ease}.dropdown-item i{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;transition:background .18s,color .18s}.dropdown-item:hover{background:rgba(29,86,201,.07);color:#1d56c9;transform:translateX(3px)}.dropdown-item.active{background:rgba(29,86,201,.1)!important;color:#1d56c9!important}@media (max-width:900px){.header-container{padding:10px 0}.brand{min-width:auto}.brand-sub,.nav-link::after{display:none}.menu-toggle{display:inline-flex}body.nav-open{overflow:hidden}.navbar{position:fixed;top:var(--header-h, 72px);left:0;right:0;bottom:0;height:calc(100dvh - var(--header-h, 72px));background:#fff;border-top:2px solid rgba(29,86,201,.1);box-shadow:0 18px 40px rgba(15,23,42,.16);opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity 220ms ease-out,transform 220ms cubic-bezier(.23,1,.32,1);z-index:99999;overflow-y:auto;overscroll-behavior:contain;display:block!important;padding:8px 0 20px}.navbar.show{opacity:1;transform:translateY(0);pointer-events:auto}.nav-list{width:100%;flex-direction:column;align-items:stretch;gap:0}.nav-item{border-bottom:1px solid rgba(29,86,201,.07)}.nav-link{width:100%;justify-content:flex-start;padding:14px 20px;border-radius:0}.nav-link span{flex:1}.dropdown-icon{margin-left:auto}.click-dropdown.open>.nav-link{background:rgba(29,86,201,.05);color:#1d56c9}.dropdown-menu{position:static;display:block;border:0;box-shadow:none;padding:0;background:rgba(29,86,201,.03);max-height:0;overflow:hidden;border-radius:0;transition:max-height 360ms cubic-bezier(.23,1,.32,1)}.click-dropdown.open>.dropdown-menu{max-height:520px;opacity:1;transform:none;pointer-events:auto}.dropdown-item{padding:12px 20px 12px 52px;border-radius:0;border-bottom:1px solid rgba(29,86,201,.05)}.dropdown-item:hover{transform:none}.btn-login{margin:12px 16px 4px!important;justify-content:center!important;padding:13px 20px!important;border-radius:14px!important}}@media (hover:hover) and (pointer:fine){.nav-link:hover{background:rgba(29,86,201,.08);color:#1d56c9}.dropdown-item:hover{background:rgba(29,86,201,.07);color:#1d56c9}}@media (hover:none),(pointer:coarse){.dropdown-item:hover,.nav-link:hover{background:0 0;color:var(--text);transform:none}.dropdown-item:active,.nav-link:active{background:rgba(29,86,201,.08)}}.dropdown-item:focus:not(:focus-visible),.nav-link:focus:not(:focus-visible){outline:0;background:0 0;color:inherit}.btn:active{transform:scale(.97)}.btn-primary{background:var(--primary);transition:background .25s ease,transform .12s ease}.btn-primary:active,.btn-primary:hover{background:var(--primary-700)}.btn-primary:active{transform:scale(.97)}.btn-outline:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.9)}.btn-light:hover{background:rgba(255,255,255,.92)}.btn-ghost{background:#f1f5f9}.btn-ghost:hover{background:#e2e8f0;color:#1e293b;transform:translateY(-1px)}.btn-ghost:active{background:#cbd5e1;transform:translateY(0)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.card-pad{padding:18px}.section-head h2{position:relative;padding-bottom:8px}.link-more:hover{text-decoration:underline}input[type=date],input[type=email],input[type=number],input[type=password],input[type=tel],input[type=text],input[type=time],input[type=url]{width:100%;border-radius:14px;border:1px solid var(--border);background:var(--field-bg);padding:10px 14px;font-size:14px;font-family:inherit;outline:0;color:var(--text);transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease,transform .08s ease}.input,input[type=file],select,textarea{width:100%;border:1px solid var(--border);background:var(--field-bg);font-size:14px;font-family:inherit;outline:0;color:var(--text)}input[type=file]{border-radius:14px;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease,transform .08s ease}.input,select,textarea{padding:10px 14px}.input,input[type=date],input[type=email],input[type=file],input[type=number],input[type=password],input[type=tel],input[type=text],input[type=time],input[type=url],select{height:44px}textarea{min-height:110px;resize:vertical}input[type=date]:focus,input[type=email]:focus,input[type=file]:focus,input[type=number]:focus,input[type=password]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus{border-color:rgba(31,95,224,.55);box-shadow:0 0 0 1px rgba(31,95,224,.12),0 12px 30px rgba(15,23,42,.08);background:#fff}input[type=file]{padding:8px 10px}input[type=file]::file-selector-button{border:1px solid rgba(31,95,224,.25);background:rgba(31,95,224,.1);color:var(--primary-700);border-radius:12px;padding:8px 12px;font-weight:900;margin-right:10px;cursor:pointer}input[type=file]::file-selector-button:hover{background:rgba(31,95,224,.16);border-color:rgba(31,95,224,.35)}select{padding-right:40px;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-repeat:no-repeat;background-position:right 14px center;background-size:12px}input::placeholder,textarea::placeholder{color:var(--muted);opacity:.9}.search-box{height:44px}.search-box input{height:100%;flex:1;border:0;background:0 0;width:100%;padding:10px 14px 10px 38px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:14px;background:var(--surface);color:var(--text);outline:0;transition:border-color .15s,box-shadow .15s}.filter-tabs select{width:auto;min-width:220px}@media (max-width:520px){.filter-tabs select{width:100%;min-width:0}}.filter-btn:hover,.tab:hover{border-color:rgba(31,95,224,.35)}.filter-btn.active,.tab.active{background:rgba(31,95,224,.12);border-color:rgba(31,95,224,.25);color:var(--primary)}.tab[data-filter=menunggu i]{background:rgba(250,204,21,.12);border-color:rgba(250,204,21,.22);color:#854d0e}.tab[data-filter=diproses i]{background:rgba(249,115,22,.1);border-color:rgba(249,115,22,.22);color:#9a3412}.tab[data-filter=selesai i]{background:rgba(34,197,94,.1);border-color:rgba(34,197,94,.22);color:#166534}.tab[data-filter=ditolak i]{background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.22);color:#991b1b}.tab[data-filter=menunggu i].active{background:rgba(250,204,21,.18)}.tab[data-filter=diproses i].active{background:rgba(249,115,22,.18)}.tab[data-filter=selesai i].active{background:rgba(34,197,94,.18)}.tab[data-filter=ditolak i].active{background:rgba(239,68,68,.18)}.card:hover{transform:translateY(-1px)}.btn{box-shadow:var(--shadow-sm)}.btn:hover{box-shadow:var(--shadow)}.btn:active{transform:translateY(0);box-shadow:0 6px 16px rgba(15,23,42,.18)}.input,select,textarea{transition:border-color .2s ease,box-shadow .2s ease}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:999px;font-weight:600;line-height:1;border:1px solid transparent;cursor:pointer;text-decoration:none}.btn,.btn i{font-size:14px}.btn-light{box-shadow:var(--shadow)}.btn-light:hover{background:#f1f5ff;box-shadow:var(--shadow-lg)}.btn-light:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.btn-outline:hover{box-shadow:var(--shadow)}.btn-outline:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.btn-solid{background:var(--primary);border-color:var(--primary)}.btn-solid:hover{background:var(--primary-700, #2563eb);border-color:var(--primary-700, #2563eb);color:#fff}.btn-service-offline,.btn-service-online{border-radius:999px;padding-inline:22px;box-shadow:0 10px 25px rgba(15,23,42,.12);transition:background .2s ease,box-shadow .2s ease,transform .18s ease}.btn-service-online{background:var(--primary);color:#fff}.btn-service-online:hover{background:var(--primary-700);box-shadow:0 14px 30px rgba(37,99,235,.28);transform:translateY(-1px)}.btn-service-offline{background:#22c55e;color:#fff}.btn-service-offline:hover{background:#16a34a;box-shadow:0 14px 30px rgba(22,163,74,.28);transform:translateY(-1px)}.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(15,23,42,.55);z-index:9999}.modal.open{display:flex}.modal-dialog{width:min(920px,96vw);max-height:92vh;overflow:auto}.modal-content{background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:0 30px 80px rgba(2,6,23,.35)}.modal-head,.table td,.table th{border-bottom:1px solid var(--border)}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px}.modal-title{display:flex;flex-direction:column;gap:4px}.modal-title h3{margin:0;font-size:16px;font-weight:1000}.modal-body{padding:16px}.card-body{padding:18px}.form{background:rgba(15,23,42,.018);border:1px solid rgba(148,163,184,.24);border-radius:18px;padding:14px}.field label,.form label{font-size:13px;font-weight:900;color:var(--muted)}@media (max-width:520px){.form{padding:12px}}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}#suratDetailBody .form-grid{gap:10px}#suratDetailBody .field{margin-bottom:0;padding:10px 12px;border:1px solid rgba(148,163,184,.28);border-radius:14px;background:rgba(148,163,184,.06)}#suratDetailBody .field:hover{background:rgba(59,130,246,.06);border-color:rgba(59,130,246,.22)}#suratDetailBody .field>div{font-weight:800;color:var(--text)}.section-title{margin:0 0 8px;font-size:18px;font-weight:1000}.section-title-sm{margin:0 0 8px;font-size:14px}.bullets,.numbered-list{padding-left:18px}.numbered-list{margin:0}.modal-foot{padding:14px 16px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:10px}.icon-btn{border:1px solid var(--border);background:0 0;cursor:pointer}.icon-btn:hover{background:rgba(31,95,224,.08);color:var(--primary);border-color:rgba(31,95,224,.25)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width:768px){.form-grid{grid-template-columns:1fr}}.list-editor{display:flex;flex-direction:column;gap:10px}.list-row{display:grid;grid-template-columns:44px 1fr 44px}.list-row .idx{width:34px;height:34px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-weight:1000;background:rgba(148,163,184,.18)}.help-box,.table thead th{background:rgba(31,95,224,.06)}.help-box{color:var(--text);font-size:13px}.table-wrap,.table-wrapper{-webkit-overflow-scrolling:touch;border:1px solid var(--border)}.table-wrapper{width:100%;overflow:auto;border-radius:14px}.table{table-layout:auto}.table td,.table th{padding:12px;text-align:left;vertical-align:top;word-break:normal;overflow-wrap:break-word;hyphens:auto}.table th{font-size:12px;text-transform:uppercase;letter-spacing:.25px;color:var(--muted)}.table thead th{color:var(--primary-700);border-bottom:1px solid rgba(31,95,224,.18)}.table tbody tr:nth-child(even){background:rgba(148,163,184,.06)}.table tbody tr:hover{background:rgba(31,95,224,.06)}.row-actions .btn{white-space:nowrap}.btn-success{background:#16a34a;color:#fff}.btn-success:hover{background:#15803d}.btn-danger{background:#ef4444;color:#fff}.btn-danger:hover{background:#dc2626}.btn-warning{background:#f59e0b;color:#111827}.btn-warning:hover{background:#d97706;color:#fff}.btn-info{background:#2f74dd;color:#fff}.btn-info:hover{background:#0284c7}.badge-published{background:rgba(34,197,94,.12);color:#166534;border-color:rgba(34,197,94,.22)}.badge-draft{background:rgba(148,163,184,.18);color:#334155;border-color:rgba(148,163,184,.26)}.badge-cat-info{background:rgba(59,130,246,.12);color:var(--primary);border-color:rgba(59,130,246,.22)}.badge-cat-penting{background:rgba(250,204,21,.15);color:#854d0e;border-color:rgba(250,204,21,.22)}.badge-cat-darurat{background:rgba(239,68,68,.12);color:#991b1b;border-color:rgba(239,68,68,.22)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width:768px){.form-row{grid-template-columns:1fr}}[data-action=toggleAdminMenu],[data-action=toggleStafMenu],[data-action=toggleWargaMenu]{background-color:var(--primary-soft)!important;color:var(--primary)!important;border:1px solid rgba(15,47,118,.18)!important;padding:10px 18px!important;font-size:14px!important;font-weight:800!important;border-radius:12px!important;box-shadow:0 4px 12px rgba(15,47,118,.08)!important;gap:8px!important;transition:transform .12s cubic-bezier(.25,.8,.25,1),background-color .2s ease,border-color .2s ease,box-shadow .2s ease!important}[data-action=toggleAdminMenu]:hover,[data-action=toggleStafMenu]:hover,[data-action=toggleWargaMenu]:hover{background-color:#dbeafe!important;border-color:rgba(15,47,118,.28)!important;box-shadow:0 6px 16px rgba(15,47,118,.12)!important;color:var(--primary-700)!important}[data-action=toggleAdminMenu]:active,[data-action=toggleStafMenu]:active,[data-action=toggleWargaMenu]:active{transform:scale(.92)!important;background-color:#bfdbfe!important;box-shadow:0 2px 6px rgba(15,47,118,.06)!important}@media (max-width:1024px){.news-grid,.service-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.home-hero-inner{grid-template-columns:1fr}.home-stats{grid-template-columns:repeat(2,1fr)}.footer-grid,.news-grid,.service-grid{grid-template-columns:1fr}.footer-grid{gap:22px}}@media (max-width:866px){.container{width:calc(100% - 28px)}.admin-shell,.staf-shell,.warga-shell{grid-template-columns:1fr!important;padding:0 14px 26px!important;margin:18px auto 26px!important;column-gap:16px!important}.admin-top,.staf-top,.warga-top{flex-wrap:wrap;gap:10px}.form-row{grid-template-columns:1fr!important}.modal-card{width:min(92vw,760px)!important;margin:24px auto!important}.unit-leader{grid-template-columns:84px minmax(0,1fr)}.unit-leader-photo img{width:84px;height:84px;border-radius:16px}}@media (max-width:480px){.container{width:calc(100% - 22px)}.hero-text h1{font-size:24px}.home-stats{grid-template-columns:1fr}}@media (max-width:768px){.profil-page .table-wrap,.profil-page .table-wrapper,body.is-admin .table-wrap,body.is-admin .table-wrapper,body.is-staf .table-wrap,body.is-staf .table-wrapper{border:0;overflow:visible;border-radius:0}.profil-page .table,body.is-admin .table,body.is-staf .table{min-width:0!important}.profil-page .table thead,body.is-admin .table thead,body.is-staf .table thead{display:none}.profil-page .table,.profil-page .table tbody,.profil-page .table td,.profil-page .table tr{display:block;width:100%}.profil-page .table tr{background:var(--surface);border:1px solid var(--border);border-radius:16px;margin-bottom:12px;overflow:hidden}.profil-page .table td{display:flex;gap:12px;justify-content:space-between;align-items:flex-start;padding:10px 12px;border-bottom:1px dashed var(--border)}.profil-page .table td:last-child,body.is-admin .table td:last-child,body.is-staf .table td:last-child{border-bottom:none}.profil-page .table td::before,body.is-admin .table td::before,body.is-staf .table td::before{content:attr(data-label);flex:0 0 42%;max-width:42%;color:var(--muted);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.22px}body.is-admin .table,body.is-admin .table tbody,body.is-admin .table td,body.is-admin .table tr,body.is-staf .table,body.is-staf .table tbody,body.is-staf .table td,body.is-staf .table tr{display:block;width:100%}body.is-admin .table tr,body.is-staf .table tr{background:var(--surface);border:1px solid var(--border);border-radius:16px;margin-bottom:12px;overflow:hidden}body.is-admin .table td,body.is-staf .table td{display:flex;gap:12px;justify-content:space-between;align-items:flex-start;padding:10px 12px;border-bottom:1px dashed var(--border)}body.is-admin .table td[data-label=Aksi i],body.is-staf .table td[data-label=Aksi i]{flex-direction:column;align-items:stretch}body.is-admin .table td[data-label=Aksi i]::before,body.is-staf .table td[data-label=Aksi i]::before{max-width:100%;flex-basis:auto;margin-bottom:6px}body.is-admin .row-actions,body.is-admin .row-actions .input,body.is-admin .row-actions select,body.is-staf .row-actions,body.is-staf .row-actions .input,body.is-staf .row-actions select{width:100%}}@media (max-width:520px){body.is-admin .admin-top,body.is-staf .staf-top{padding:12px}body.is-admin .card-pad,body.is-staf .card-pad{padding:14px}.filter-btn,.tab{padding:7px 10px;font-size:12px}}@media (max-width:768px){body.is-warga .warga-table{min-width:0!important;display:block;width:100%}body.is-warga .warga-table thead{display:none}body.is-warga .warga-table tbody,body.is-warga .warga-table td,body.is-warga .warga-table tr{display:block;width:100%}body.is-warga .warga-table tr{background:var(--surface);border:1px solid var(--border);border-radius:16px;margin-bottom:12px;overflow:hidden}body.is-warga .warga-table td{display:flex;gap:12px;justify-content:space-between;align-items:flex-start;padding:10px 12px;border-bottom:1px dashed var(--border)}body.is-warga .warga-table td:last-child{border-bottom:none}body.is-warga .warga-table td::before{content:attr(data-label);flex:0 0 42%;max-width:42%;color:var(--muted);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.22px}}.home-hero{position:relative;background:linear-gradient(135deg,var(--primary-800) 0%,var(--primary-700) 45%,var(--primary-500) 100%);color:#fff;overflow:hidden;margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);width:100vw}.blob,.hero-bg{position:absolute}.hero-bg{inset:0;pointer-events:none;z-index:0}.blob{border-radius:50%;filter:blur(2px);opacity:.5}.blob--1{width:520px;height:520px;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.12),transparent 70%);top:-160px;left:38%;filter:blur(0)}.blob--2{width:60px;height:60px;background:#fcd34d;opacity:.9;top:230px;left:48.5%;filter:blur(0);box-shadow:0 0 50px 8px rgba(252,211,77,.5)}.dotgrid{position:absolute;left:34px;top:300px;width:80px;height:80px;background-image:radial-gradient(rgba(255,255,255,.35) 1.6px,transparent 1.6px);background-size:14px 14px}.hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center;max-width:1200px;margin:0 auto;padding:56px 32px 110px}.badge-wave{display:inline-block;animation:badgeWave 2.4s ease-in-out infinite}.hero-text h1{font-size:clamp(28px,3vw,44px);line-height:1.18;font-weight:800;color:#fff;letter-spacing:-.01em;margin-bottom:18px}.hero-text p{font-size:16.5px;line-height:1.65;color:rgba(255,255,255,.82);max-width:480px;margin-bottom:30px}.hero-actions{display:flex;gap:14px;margin-bottom:40px;flex-wrap:wrap;align-items:center}.btn-light,.btn-outline{font-size:15px;text-decoration:none;cursor:pointer}.btn-light{display:inline-flex;align-items:center;gap:10px;font-weight:700;padding:13px 24px;border-radius:12px;background:#fff;color:var(--primary-700);box-shadow:0 10px 24px -8px rgba(0,0,0,.25);transition:transform .15s,box-shadow .15s;border:0}.btn-light:hover,.btn-outline:hover{transform:translateY(-2px)}.btn-outline{background:0 0}.btn-outline:hover{background:rgba(255,255,255,.12)}.home-stats{display:flex;gap:28px;flex-wrap:wrap}.stat-card{display:flex;align-items:center;gap:11px;background:0 0;border:0;box-shadow:none;padding:0}.stat-card .stat-icon{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;font-size:18px}.stat-card .stat-text{display:flex;flex-direction:column;line-height:1.25}.stat-card strong{font-size:21px;font-weight:800;color:#fff}.stat-card small,.stat-card span{font-size:13px;color:rgba(255,255,255,.78);font-weight:500}.hero-media{position:relative}.hero-slides-wrap{position:relative;width:100%;height:100%}.hero-slides-wrap .hero-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease}.hero-slides-wrap .hero-slide.is-active{opacity:1}.hero-locpill{pointer-events:none}.hero-locpill-icon{width:30px;height:30px;border-radius:50%;background:var(--primary-500);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff;font-size:13px}.hero-dot.is-active{background:#fff;width:18px;border-radius:4px}.hero-wave{position:absolute;left:0;right:0;bottom:-2px;width:100%;height:90px;z-index:1;pointer-events:none}.home-body{max-width:1200px;margin:0 auto;padding:64px 24px 32px}.section-head h2::after{content:"";position:absolute;left:0;bottom:0;width:36px;height:3px;border-radius:2px}.link-more{text-decoration:none}.panel-news{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-sm)}.svc-icon{color:#fff}.svc-icon--blue{background:linear-gradient(135deg,#3b82f6,#2563eb)}.svc-icon--purple{background:linear-gradient(135deg,#a78bfa,#7c3aed)}.svc-icon--green{background:linear-gradient(135deg,#34d399,#059669)}.svc-icon--orange{background:linear-gradient(135deg,#fb923c,#ea580c)}.service-card{background:var(--surface);border-radius:var(--radius-sm);display:grid;color:inherit}.service-card p{color:var(--muted)}.panel-head .link-all,.service-card .svc-go{display:flex;align-items:center;font-size:14px;color:var(--primary)}.service-card .svc-go{position:absolute;left:20px;bottom:18px;width:34px;height:34px;border-radius:50%;background:#eef2fb;justify-content:center;transition:background .2s,color .2s}.section-head h2::after,.service-card:hover .svc-go{background:var(--primary)}.home-cta h3{margin-bottom:10px}.home-cta p{margin-bottom:28px}.cta-actions{display:flex;justify-content:center;flex-wrap:wrap}.home-features{background:var(--surface);border-top:1px solid var(--border);margin-top:16px}.features-inner{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;max-width:1200px;margin:0 auto;padding:0 24px}.feature-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;flex-shrink:0}.feature-icon--blue{background:linear-gradient(135deg,#3b82f6,#2563eb)}.feature-icon--green{background:linear-gradient(135deg,#34d399,#059669)}.feature-icon--purple{background:linear-gradient(135deg,#a78bfa,#7c3aed)}.feature-icon--orange{background:linear-gradient(135deg,#fb923c,#ea580c)}.feature-item p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.55}@media (max-width:1024px){.hero-inner{grid-template-columns:1fr;padding:40px 24px 80px}.hero-media{display:none}.home-panels{grid-template-columns:1fr}.features-inner,.service-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.hero-text h1{font-size:26px}.home-stats{gap:18px}.stat-card strong{font-size:18px}.features-inner{grid-template-columns:1fr 1fr;gap:20px}}@media (max-width:480px){.service-grid{grid-template-columns:1fr 1fr}.features-inner{grid-template-columns:1fr}}.home-content{padding:48px 0 20px}.home-content-inner{display:grid;grid-template-columns:1.55fr 1fr;gap:28px;align-items:start}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.panel-head h2{font-weight:800}.panel-head h2,.section-head h2{font-size:22px;color:var(--text)}.panel-head .link-all{gap:6px;font-weight:700}.news-feature{margin-bottom:18px}.news-feature-media{position:relative;border-radius:var(--radius-sm);overflow:hidden;aspect-ratio:16/10;margin-bottom:14px}.news-feature-media img{width:100%;height:100%;object-fit:cover}.tag-pill{position:absolute;left:12px;bottom:12px;background:var(--primary);color:#fff;font-size:11px;font-weight:700;letter-spacing:.04em;padding:5px 11px;border-radius:7px}.news-feature h3{font-size:16px;font-weight:800;line-height:1.4;margin-bottom:8px}.news-feature-meta,.news-list-item span{font-size:12px;color:var(--muted);font-weight:600}.news-list-panel{border-top:1px solid var(--border)}.news-list-item{display:flex;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--border)}.news-list-item:last-child{border-bottom:none;padding-bottom:0}.news-list-item img{width:58px;height:58px;border-radius:10px;object-fit:cover;flex-shrink:0}.news-list-item h4{font-size:14px;font-weight:700;line-height:1.35;margin-bottom:5px}.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.news-card{background:var(--surface);border-radius:var(--radius-sm);display:grid}.news-card:hover{box-shadow:var(--shadow)}.galeri-card img,.news-thumb img{aspect-ratio:16/10;width:100%;object-fit:cover}.news-body{padding:14px;display:grid;gap:8px}.feature-item h4,.news-title{font-size:14px;font-weight:800}.news-title{line-height:1.35}.news-excerpt,.news-meta{font-size:13px;color:var(--muted)}.news-meta{display:flex;gap:10px;font-size:12px;align-items:center}.agenda-list{display:grid}.agenda-item{display:grid;grid-template-columns:54px 1fr auto;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px;box-shadow:var(--shadow-sm)}.agenda-date{width:54px;height:54px;border-radius:16px;background:rgba(31,95,224,.1);display:grid;place-items:center}.agenda-date .day{font-weight:950;font-size:16px;line-height:1}.agenda-date .month{font-size:10px;font-weight:800;opacity:.9}.agenda-meta,.agenda-sub{font-size:12px;color:var(--muted)}.agenda-meta{display:flex;gap:10px;align-items:center}.home-features{padding:36px 0 60px}.home-features-inner{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:30px 36px;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}.feature-item{display:flex;align-items:flex-start;gap:14px}.feature-item .feat-icon{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}.feat-icon--blue{background:linear-gradient(135deg,#3b82f6,#1d4ed8)}.feat-icon--green{background:linear-gradient(135deg,#34d399,#059669)}.feat-icon--purple{background:linear-gradient(135deg,#a78bfa,#7c3aed)}.feat-icon--red{background:linear-gradient(135deg,#fb7185,#e11d48)}.feature-item h4{margin-bottom:4px;color:var(--text)}.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);color:#fff;font-size:13.5px;font-weight:600;padding:7px 16px;border-radius:999px;margin-bottom:22px}.home-cta{background:linear-gradient(135deg,var(--primary-800),var(--primary));color:#fff;padding:34px 18px;text-align:center}.home-cta h3{font-weight:950;font-size:20px}.home-cta p{margin-top:8px;opacity:.95;font-size:13px}.home-cta .cta-actions{margin-top:14px;display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.berita-page .page-head{display:grid;gap:6px;margin-bottom:16px}.agenda-page .page-head h1,.berita-page .page-head h1{font-size:24px;font-weight:950}.berita-page .page-head p{color:var(--muted);font-size:13px}.berita-toolbar{display:grid;gap:12px;margin-bottom:14px}.berita-grid{display:grid;grid-template-columns:repeat(3,1fr)}.agenda-page .page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:14px}.agenda-public{display:grid}.galeri-page h1{margin-bottom:6px}.galeri-page p{margin-bottom:14px}.galeri-grid{margin-top:14px;display:grid;grid-template-columns:repeat(4,1fr)}.galeri-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}.galeri-card img{aspect-ratio:4/3}.galeri-card .galeri-body{padding:12px;display:grid;gap:6px}.galeri-card h4{font-size:14px;font-weight:900}.galeri-card small{color:var(--muted)}.kontak-header{text-align:center;margin-bottom:18px}.galeri-page h1,.info-card h3,.kontak-header h1{font-size:24px;font-weight:950}.galeri-page p,.info-card p,.kontak-header p{color:var(--muted);font-size:13px}.kontak-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:16px}.kontak-card{background:var(--surface);border-radius:var(--radius);text-align:center;display:grid;gap:6px}.kontak-card .icon{margin:0 auto 8px}.icon.blue{background:#2563eb}.icon.green{background:#22c55e}.icon.purple{background:#a855f7}.kontak-row{margin-bottom:16px}.kontak-box{background:var(--surface);border-radius:var(--radius)}.info-card h3{font-size:16px;margin-bottom:8px}.jam-list li{display:flex;padding:8px 0}.jam-list li,.sosial-list li{justify-content:space-between;border-bottom:1px solid var(--border)}.batas-list li:last-child,.jam-list li:last-child,.sosial-list li:last-child{border-bottom:none}.closed{color:#ef4444;font-weight:900}.rt-grid{grid-template-columns:repeat(3,1fr)}.rt-card{border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px}.faq-item{border-bottom:1px solid var(--border)}.faq-question{width:100%;text-align:left;background:0 0;border:0;padding:12px 0;font-weight:900;cursor:pointer}.faq-answer{display:none;padding-bottom:12px;color:var(--muted);font-size:13px}.faq-answer.show{display:block}.page-wrap{display:grid;gap:14px}.page-title{font-size:24px;font-weight:950}.page-lead{color:var(--muted);font-size:13px;max-width:820px}.info-grid{display:grid;grid-template-columns:1.2fr .8fr}.info-card{padding:16px}.bullets{display:grid;gap:8px;margin:10px 0 0}.bullets li,.timeline-content p{font-size:13px;color:var(--muted)}.bullets li{display:grid;grid-template-columns:18px 1fr;gap:8px;align-items:start}.bullets i{color:var(--primary);margin-top:2px}.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}@media (max-width:1024px){.home-hero .hero-inner{grid-template-columns:1fr;padding:38px 22px}.hero-media{justify-items:start}.home-stats,.news-grid,.service-grid{grid-template-columns:repeat(2,1fr)}.galeri-grid{grid-template-columns:repeat(3,1fr)}.berita-grid,.services-grid{grid-template-columns:repeat(2,1fr)}.info-grid{grid-template-columns:1fr}}@media (max-width:600px){.home-hero .hero-inner{padding:28px 18px}.hero-text h1{font-size:26px}.berita-grid,.galeri-grid,.home-stats,.kontak-grid,.kontak-row,.news-grid,.rt-grid,.service-grid,.services-grid{grid-template-columns:1fr}.agenda-item{grid-template-columns:54px 1fr}}.timeline{position:relative;margin-left:6px}.timeline::before{content:"";position:absolute;top:0;bottom:0;left:14px;width:2px;background:rgba(148,163,184,.5)}.timeline-item{position:relative;display:flex;gap:10px;padding:8px 0 8px 6px}.timeline-badge{position:relative;z-index:1;width:26px;height:26px;border-radius:999px;background:#fff;box-shadow:0 6px 16px rgba(15,23,42,.16);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px}.timeline-content h4{margin:0 0 4px;font-size:14px;font-weight:900}.timeline-content p{margin:0}.service-wizard .wizard-card{border-radius:20px}.service-wizard.wizard-modal-page{min-height:calc(100vh - 120px)}.wizard-overlay{position:fixed;inset:0;background:rgba(2,6,23,.45);z-index:2000}.wizard-dialog{width:min(960px,96vw);max-height:92vh}.wizard-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;border-bottom:1px solid var(--border)}.wizard-footer{align-items:center;border-top:1px solid var(--border)}.wizard-choice-list{grid-template-columns:1fr;margin-top:10px;overflow-y:auto;padding-right:6px}@media (min-width:860px){.wizard-choice-list{grid-template-columns:1fr 1fr;max-height:380px;overflow-y:auto}}.choice-card,.file-list li{display:flex;align-items:center}.choice-card{border:1px solid var(--border);border-radius:16px;padding:14px;background:var(--surface);cursor:pointer;justify-content:space-between;gap:12px;transition:box-shadow .2s ease,transform .15s ease,border-color .2s ease,background .2s ease}.choice-card:hover{border-color:rgba(31,95,224,.35);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.choice-card.active{border-color:rgba(31,95,224,.65);background:rgba(31,95,224,.06)}.choice-card h3{margin:0;font-size:15px;font-weight:1000}.choice-card .meta{font-size:12px;color:var(--muted);margin-top:4px}.choice-card .check,.wizard-step .step-circle{border-radius:999px;align-items:center;justify-content:center}.choice-card .check{width:30px;height:30px;border:1px solid var(--border);display:inline-flex;color:var(--muted)}.choice-card.active .check{border-color:rgba(31,95,224,.55);color:var(--primary);background:rgba(31,95,224,.1)}.wizard-steps{display:flex;padding-bottom:10px;border-bottom:1px solid var(--border)}.wizard-step{flex-direction:column;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.wizard-step .step-circle{width:26px;height:26px;background:var(--primary-soft);display:flex;font-weight:800}.wizard-step.is-active{color:var(--primary)}.wizard-step.is-active .step-circle{box-shadow:var(--shadow-sm)}.wizard-step.is-done{opacity:.8}.wizard-pane{display:none}.map-embed-wrap iframe,.wizard-pane.is-active{display:block}.upload-dropzone{border:1.5px dashed var(--border);padding:18px 14px;text-align:center;background:rgba(148,163,184,.04)}.upload-dropzone:hover{background:rgba(148,163,184,.1);border-style:solid;box-shadow:var(--shadow-sm)}.file-list{list-style:none;margin:0;padding:0}.file-list li{gap:10px;padding:6px 10px;border-radius:10px;background:rgba(148,163,184,.08);font-size:13px}@media (max-width:768px){.wizard-overlay{padding:8px}.wizard-dialog{width:98vw;max-height:96vh;border-radius:16px}.wizard-body{padding:12px}.wizard-steps{gap:10px;justify-content:space-between}.wizard-step .step-circle{width:24px;height:24px;font-size:12px}.wizard-step .step-label{font-size:10px}}.pengumuman-page .page-header{margin-bottom:18px}.pengumuman-page .page-header h1{font-size:26px;margin-bottom:4px}.pengumuman-page .page-header p{color:var(--muted);font-size:14px}.pengumuman-filters{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:flex-end;margin-bottom:18px}.pengumuman-filters .filter-field{display:flex;flex-direction:column;gap:4px;min-width:180px}.pengumuman-filters label{font-size:13px;font-weight:600;color:var(--muted)}.pengumuman-filters input[type=search],.pengumuman-filters input[type=text],.pengumuman-filters select{height:42px;padding:0 12px;border-radius:12px;border:1px solid var(--border);background:var(--surface);font-size:14px;outline:0;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}.pengumuman-filters input[type=search]:focus,.pengumuman-filters input[type=text]:focus,.pengumuman-filters select:focus{border-color:rgba(31,95,224,.45);box-shadow:0 0 0 1px rgba(31,95,224,.18);background:#fff}.pengumuman-empty{padding:16px 18px;border-radius:16px;background:var(--surface);border:1px solid var(--border);color:var(--muted);font-size:14px}.page-title{font-size:clamp(22px,4.6vw,32px);line-height:1.2;word-break:break-word}.meta-item span,.page-lead{overflow-wrap:break-word;word-break:normal}.unit-leader{display:grid;grid-template-columns:96px minmax(0,1fr);gap:14px;align-items:start}.unit-leader-photo img{width:96px;height:96px;border-radius:18px;object-fit:cover;background:rgba(148,163,184,.16)}.unit-leader-meta{display:flex;flex-wrap:wrap;gap:10px 14px;margin-top:8px}.meta-item{display:inline-flex;align-items:center;gap:8px;min-width:0}@media (max-width:600px){.unit-leader{grid-template-columns:1fr}.unit-leader-photo img{width:84px;height:84px}}.konfirmasi-page .thanks-inner{display:flex;align-items:flex-start;gap:16px}.konfirmasi-page .thanks-icon{width:56px;height:56px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:rgba(31,95,224,.1);color:var(--primary);font-size:28px;flex:0 0 auto}.konfirmasi-page .thanks-text h2{margin:0 0 6px;font-size:22px;font-weight:1000}.konfirmasi-page .thanks-text p{margin:0}.konfirmasi-page .ref-code{display:inline-block;margin-top:6px;padding:8px 12px;border-radius:12px;background:rgba(31,95,224,.08);border:1px solid rgba(31,95,224,.18);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-weight:1000;letter-spacing:.02em}.konfirmasi-page .thanks-actions{display:flex;gap:10px;flex-wrap:wrap}@media (max-width:768px){.konfirmasi-page .thanks-inner{flex-direction:column}.konfirmasi-page .thanks-icon{width:48px;height:48px;border-radius:16px;font-size:24px}}.info-reset-card{background:rgba(37,99,235,.06);border:1px solid rgba(37,99,235,.18)}.info-reset-body{padding:16px}.info-reset-title{font-weight:900;margin-bottom:10px;color:var(--primary);font-size:15px}.info-reset-list{margin:0;padding-left:20px;list-style:disc;color:#334155;line-height:1.7;font-size:14px}.info-reset-list li{margin-bottom:6px}.agenda-item,.home-body .stat-card,.news-card,.service-card{background:linear-gradient(180deg,#fff,#f6f9ff)}.agenda-item,.home-body .stat-card{border:1px solid rgba(15,47,118,.1);box-shadow:0 14px 34px rgba(15,47,118,.1)}.agenda-date,.home-body .stat-card .stat-icon,.service-card .svc-icon{background:rgba(29,78,216,.12);color:#1d4ed8}.home-hero .stat-card{background:0 0!important;border:0!important;box-shadow:none!important}.home-hero .stat-card .stat-icon{background:rgba(255,255,255,.14)!important;color:#fff!important}.home-hero .stat-card strong{color:#fff!important}.home-hero .stat-card small,.home-hero .stat-card span{color:rgba(255,255,255,.78)!important}.home-stats{max-width:1200px;margin:24px auto 0}.home-page .agenda-list,.home-page .home-cta,.home-page .news-grid,.home-page .section-head,.home-page .service-grid,.news-section,.section,.services{max-width:1200px;margin-left:auto;margin-right:auto}.home-page .agenda-list,.home-page .news-grid,.home-page .service-grid{width:100%}.home-page .agenda-list,.home-page .news-grid,.home-page .section-head,.home-page .service-grid{background:rgba(255,255,255,.65);border:1px solid rgba(37,99,235,.1);border-radius:18px;padding:14px;backdrop-filter:blur(6px)}.home-page .stat-card{border:1px solid rgba(37,99,235,.12);box-shadow:0 12px 24px rgba(15,47,118,.08)}.home-page .agenda-item,.home-page .news-card,.home-page .service-card,.home-page .stat-card{background:linear-gradient(180deg,#fff 0,#f3f8ff 100%)}.home-page .agenda-item,.home-page .news-card{border:1px solid rgba(37,99,235,.12);box-shadow:0 12px 24px rgba(15,47,118,.08)}.home-page .agenda-item:hover,.home-page .news-card:hover,.home-page .stat-card:hover{box-shadow:0 16px 34px rgba(15,47,118,.12)}.home-page .section-head h2{color:#0f2f76;letter-spacing:.2px}.home-page .link-more{color:#1d4ed8;font-weight:800}.hero-locpill i,.profil-photo{display:flex;align-items:center;justify-content:center}.profil-photo{margin-top:12px;padding:10px}.profil-photo img{display:block;max-width:100%;height:auto;border-radius:12px;width:min(520px,100%);aspect-ratio:16/9;object-fit:cover;object-position:center}.hero-slides-track{position:relative}.hero-slide{inset:0}.hero-dots,.hero-locpill{position:absolute;display:flex;z-index:2}.hero-locpill{left:20px;bottom:48px;align-items:center;gap:10px;background:rgba(16,23,42,.55);backdrop-filter:blur(6px);border-radius:12px;padding:10px 14px;color:#fff}.hero-locpill i{width:30px;height:30px;border-radius:50%;background:var(--primary);font-size:13px;flex-shrink:0}.hero-locpill strong{display:block;font-size:14px;font-weight:700}.hero-locpill small{display:block;font-size:12px;color:rgba(255,255,255,.78)}.hero-dots{right:18px;bottom:18px;gap:6px}.hero-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.45);border:0;padding:0;transition:background .2s,width .2s;cursor:pointer}.hero-dot.active{background:#fff;width:18px;border-radius:4px}.about-page .page-wrap{max-width:860px}.pelayanan-page .page-wrap{padding-bottom:40px}.filter-btn:hover{background:var(--primary-soft);color:var(--primary)}.search-box,.tab{background:var(--surface);border:1.5px solid var(--border)}.tab{padding:8px 18px;border-radius:999px;font-size:13px;font-weight:700;color:var(--text);cursor:pointer}.tab.active,.tab:hover{border-color:var(--primary)}.tab:hover{background:var(--primary-soft);color:var(--primary)}.tab.active{background:var(--primary)}.search-box{gap:10px;padding:10px 14px;transition:border-color .2s}.search-box:focus-within{border-color:var(--primary)}.search-box i{flex-shrink:0}.search-box input::placeholder{color:var(--muted)}.loading-card{color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);grid-column:1/-1}.loading-card i{display:block;margin-bottom:12px;font-size:28px;color:var(--primary);opacity:.7}.link-more{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:var(--primary);white-space:nowrap;transition:opacity .15s}.link-more:hover{opacity:.78}.page-banner{background:linear-gradient(135deg,var(--primary-800) 0%,var(--primary-700) 55%,var(--primary-500) 100%);padding:36px 0 40px}.page-banner::before{background:radial-gradient(circle at 80% 50%,rgba(255,255,255,.08)0,transparent 60%)}.page-banner-inner{display:flex;gap:18px}.page-banner-icon{background:rgba(255,255,255,.15);display:flex;font-size:22px;flex-shrink:0}.page-banner-inner h1{font-size:clamp(22px,2.5vw,30px);font-weight:800;color:#fff;margin:0 0 6px;line-height:1.2}.page-banner-inner p{font-size:14.5px;color:rgba(255,255,255,.82);margin:0;line-height:1.5}.page-content{padding-top:36px;padding-bottom:48px}.search-box{position:relative;display:flex;align-items:center}.search-box i{position:absolute;left:13px;color:var(--muted);font-size:14px;pointer-events:none}.search-box input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(31,95,224,.1)}.filter-tabs{margin-top:10px}.filter-tabs .tab{border:1.5px solid var(--border);background:var(--surface);color:var(--muted);cursor:pointer;transition:background .15s,color .15s,border-color .15s}.filter-btn.active{background:var(--primary);border-color:var(--primary)}.filter-btn:hover{color:#fff}.filter-btn:hover,.filter-tabs .tab.active,.filter-tabs .tab:hover{background:var(--primary);border-color:var(--primary)}.filter-tabs .tab:hover{color:#fff}.galeri-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.filter-btn{border:1.5px solid var(--border);background:var(--surface);color:var(--muted);cursor:pointer}.sosial-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}.sosial-list li{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--text)}.sosial-list li i{width:20px;color:var(--primary);font-size:16px}.rt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-top:10px}@media (max-width:600px){.page-banner{padding:24px 0 28px}.page-banner-icon{width:44px;height:44px;font-size:18px;border-radius:12px}.page-banner-inner h1{font-size:20px}.page-content{padding-top:24px;padding-bottom:32px}}.layanan-card{background:var(--surface);border-radius:var(--radius);padding:28px}.layanan-select-wrap{display:grid;gap:8px;max-width:480px}.layanan-select-label{font-weight:800;font-size:14px;color:var(--text)}.layanan-select{font-size:15px;padding:10px 14px;border-radius:var(--radius-sm);border:1.5px solid var(--border);background:var(--surface);color:var(--text);outline:0;transition:border-color .15s,box-shadow .15s}.layanan-select:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(31,95,224,.1)}.batas-list li,.panel-title{display:flex;align-items:center}.panel-title{font-size:18px;font-weight:800;color:var(--text);gap:10px;margin-bottom:6px}.info-section-title i,.panel-title i{color:var(--primary)}.panel-desc{font-size:13.5px;color:var(--muted);margin-bottom:18px;line-height:1.5}.form-actions{display:flex;flex-wrap:wrap;margin-top:14px}.peta-grid{display:grid;grid-template-columns:1fr 2fr;gap:24px;align-items:stretch}.peta-map-card{padding:12px!important;min-height:480px;display:flex;flex-direction:column}.map-embed-wrap{flex:1;border:1px solid var(--border);box-shadow:var(--shadow-sm);min-height:480px}.info-section-title{font-size:15px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:8px;margin-bottom:12px}.batas-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;font-size:14px}.batas-list li{justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--border)}.pengumuman-page .page-header,.pengumuman-page .page-wrap>header{display:none}@media (max-width:900px){.peta-grid{grid-template-columns:1fr}.map-embed-wrap,.peta-map-card{min-height:320px}}.home-card{border-radius:16px;padding:28px 28px 24px;overflow:hidden;position:relative}@media (max-width:880px){.home-duo-row{grid-template-columns:1fr}}.home-staf-card{background:linear-gradient(135deg,#c0392b 0,#e74c3c 60%,#ff6b6b 100%)!important;color:#fff!important;min-height:320px}.home-galeri-card .section-head h2,.home-pengumuman-card .section-head h2{font-size:20px;font-weight:900;margin:0}.home-staf-card .section-head h2,.visimisi-header h2{color:#fff;font-size:20px;font-weight:900;margin:0}.home-staf-card .link-more{color:rgba(255,255,255,.85);font-size:13px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:4px;transition:color .2s}.home-galeri-card .link-more:hover,.home-staf-card .link-more:hover{color:#fff}.staf-slider-wrap{position:relative;overflow:hidden;margin:16px -4px 0;padding:0 4px}.staf-slider-track{display:flex;gap:16px;transition:transform .5s cubic-bezier(.4,0,.2,1);will-change:transform}.staf-card{flex:0 0 160px;background:rgba(255,255,255,.15);backdrop-filter:blur(8px);padding:16px 12px;text-align:center;transition:transform .2s,box-shadow .2s}.staf-card:hover{transform:translateY(-4px)}.staf-photo{width:80px;height:80px;border-radius:50%;background:rgba(255,255,255,.2);overflow:hidden;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;border:3px solid rgba(255,255,255,.4)}.home-galeri-item img,.staf-photo img{width:100%;height:100%;object-fit:cover}.staf-avatar-icon{font-size:32px;color:rgba(255,255,255,.7)}.staf-nama{font-size:13px;font-weight:800;color:#fff;line-height:1.3;margin-bottom:4px}.staf-jabatan{font-size:11px;color:rgba(255,255,255,.8);font-weight:600}.staf-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.25);border:1px solid rgba(255,255,255,.4);color:#fff;border-radius:50%;width:36px;height:36px;font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;z-index:5}.staf-nav:hover{background:rgba(255,255,255,.45)}.staf-prev{left:0}.staf-next{right:0}.staf-dots{display:flex;justify-content:center;gap:6px;margin-top:12px}.staf-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35);border:0;cursor:pointer;padding:0;transition:background .2s,transform .2s}.staf-dot.active{background:#fff;transform:scale(1.3)}.staf-empty,.staf-loading{color:rgba(255,255,255,.8);padding:32px;text-align:center;font-size:14px;display:flex;flex-direction:column;align-items:center;gap:8px}.home-visimisi-card{background:linear-gradient(135deg,#1a1a2e 0,#16213e 60%,#0f3460 100%)!important;color:#fff!important;min-height:320px;display:flex;flex-direction:column;gap:18px}.visimisi-header{display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:14px}.visimisi-icon{width:44px;height:44px;background:linear-gradient(135deg,#2563eb,#7c3aed);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff;flex-shrink:0}.visimisi-misi h4,.visimisi-visi h4{font-size:12px;font-weight:800;letter-spacing:.08em;color:#60a5fa;text-transform:uppercase;margin:0 0 8px;display:flex;align-items:center;gap:6px}#homeVisiText{font-size:14px;line-height:1.65;color:rgba(255,255,255,.9);font-style:italic;margin:0;background:rgba(255,255,255,.06);border-left:3px solid #3b82f6;padding:12px 14px;border-radius:0 8px 8px 0}.visimisi-misi h4{color:#34d399;margin:0 0 10px}.visimisi-misi-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;max-height:200px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}.visimisi-misi-list li{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:rgba(255,255,255,.85);line-height:1.5}.visimisi-misi-list li i{color:#34d399;font-size:12px;margin-top:3px;flex-shrink:0}.home-galeri-card{background:linear-gradient(135deg,#d97706 0,#f59e0b 60%,#fcd34d 100%)!important;color:#fff!important;min-height:280px}.home-galeri-card .link-more{color:rgba(255,255,255,.9);font-size:13px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:4px}.home-galeri-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}.home-galeri-item{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:1;transition:transform .2s}.home-galeri-item:hover{transform:scale(1.04)}.home-galeri-item img{display:block}.home-galeri-caption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.7));font-size:10px;font-weight:700;padding:12px 6px 5px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transition:opacity .2s}.home-galeri-item:hover .home-galeri-caption{opacity:1}.galeri-more-btn{margin-top:14px;text-align:center}.galeri-more-btn .btn,.home-pengumuman-card .link-more{font-size:13px;text-decoration:none;display:inline-flex;align-items:center}.galeri-more-btn .btn{background:rgba(255,255,255,.2);color:#fff;border:2px solid rgba(255,255,255,.4);border-radius:8px;font-weight:800;padding:8px 18px;gap:6px;transition:background .2s}.galeri-more-btn .btn:hover{background:rgba(255,255,255,.35)}.home-pengumuman-card{background:linear-gradient(135deg,#047857 0,#059669 60%,#34d399 100%)!important;color:#fff!important;min-height:280px}.home-pengumuman-card .link-more{color:rgba(255,255,255,.9);font-weight:700;gap:4px}.home-pengumuman-card .link-more:hover{color:#fff}.home-pengumuman-list{display:flex;flex-direction:column;gap:10px;margin-top:16px}.home-peng-item{display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.15);backdrop-filter:blur(6px);border-radius:12px;padding:12px 14px;gap:10px;transition:background .2s,transform .15s}.home-peng-item:hover{background:rgba(255,255,255,.25);transform:translateX(4px)}.home-peng-left{flex:1;min-width:0}.home-peng-badge{display:inline-block;font-size:10px;font-weight:800;padding:2px 8px;border-radius:4px;margin-bottom:4px}.home-peng-title{font-size:13px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.4}.home-peng-date{font-size:11px;color:rgba(255,255,255,.75);margin-top:3px;display:flex;align-items:center;gap:4px}.home-peng-arrow{color:rgba(255,255,255,.6);font-size:14px;flex-shrink:0}.peng-more-btn{margin-top:12px;text-align:center}.peng-more-btn .btn{background:rgba(255,255,255,.2);color:#fff;border:2px solid rgba(255,255,255,.4);border-radius:8px;font-weight:800;font-size:13px;padding:8px 18px;text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:background .2s}.peng-more-btn .btn:hover{background:rgba(255,255,255,.35)}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}.hero-photo-card{position:relative;overflow:hidden;border-radius:24px;background:#1d3a5f;aspect-ratio:4/3;max-width:480px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.3)}.hero-slides-track{will-change:transform}.hero-slide-caption{background:linear-gradient(transparent,rgba(0,0,0,.7))}.hero-slider-dot{background:rgba(255,255,255,.5)}.loading-card{background:0 0}.empty-card,.loading-card{color:var(--muted, #9ca3af);padding:24px;text-align:center;font-size:14px;border:1px dashed rgba(0,0,0,.1);border-radius:10px}.home-section-wrap{border:1px solid var(--border, #e5e7eb);margin:0 0 24px}.home-section-wrap .section-head h2,.panel-news .section-head h2,.panel-services .section-head h2{font-size:20px;font-weight:900;color:var(--text, #111);margin:0}@media (max-width:640px){.home-card{padding:20px 16px 18px}.home-galeri-grid{grid-template-columns:repeat(2,1fr)}.staf-card{flex:0 0 140px}.staf-photo{width:64px;height:64px}}.home-news-wrap{display:grid;grid-template-columns:1fr 1fr;gap:16px;width:100%}@media (max-width:860px){.home-news-wrap{grid-template-columns:1fr}}.home-news-featured{position:relative;border-radius:14px;overflow:hidden;background:#1a1f2e;min-height:320px}.home-news-featured-track{width:100%;height:100%;min-height:320px;position:relative}.featured-slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;display:flex;flex-direction:column}.featured-slide.active{opacity:1;z-index:1}.featured-no-img,.featured-slide img{width:100%;height:100%;min-height:320px}.featured-slide img{object-fit:cover;display:block}.featured-no-img{background:linear-gradient(135deg,#1d56c9,#7c3aed);display:flex;align-items:center;justify-content:center;font-size:56px;color:rgba(255,255,255,.3)}.featured-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.85)0,rgba(0,0,0,.4) 60%,transparent 100%);padding:32px 20px 20px;z-index:2}.featured-cat{display:inline-block;background:var(--primary, #1d56c9);color:#fff;font-size:10px;font-weight:800;padding:3px 10px;border-radius:4px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}.featured-title{font-size:17px;font-weight:900;color:#fff;margin:0 0 6px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.featured-meta{font-size:12px;color:rgba(255,255,255,.7);margin-bottom:10px}.featured-nav,.featured-read{cursor:pointer;align-items:center}.featured-read{display:inline-flex;gap:4px;font-size:12px;font-weight:800;color:#93c5fd;text-decoration:none}.featured-read:hover{color:#fff}.featured-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:50%;width:34px;height:34px;font-size:22px;line-height:1;display:flex;justify-content:center;z-index:10;transition:background .2s}.featured-nav:hover{background:rgba(0,0,0,.6)}.featured-prev{left:10px}.featured-next{right:10px}.featured-dots{position:absolute;bottom:12px;right:14px;display:flex;gap:5px;z-index:10}.feat-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.4);border:0;cursor:pointer;padding:0;transition:background .2s,transform .2s}.feat-dot.active{background:#fff;transform:scale(1.4)}.home-news-list{display:flex;flex-direction:column;gap:0;border:1px solid var(--border, #e5e7eb);background:#fff}.home-news-item{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-bottom:1px solid var(--border, #e5e7eb);cursor:pointer}.home-news-item:last-child{border-bottom:none}.home-news-item:hover{background:#f8faff}.home-news-item.active{background:#eff6ff;border-left:3px solid var(--primary, #1d56c9)}.hni-thumb{flex-shrink:0;width:80px;height:60px;border-radius:8px;overflow:hidden;background:#e5e7eb}.hni-thumb img,.org-photo img{width:100%;height:100%;object-fit:cover;display:block}.hni-thumb-empty{display:flex;align-items:center;justify-content:center;color:#9ca3af;font-size:20px;background:linear-gradient(135deg,#dbeafe,#ede9fe)}.hni-body{flex:1;min-width:0}.hni-cat,.hni-title{font-weight:800;margin-bottom:4px}.hni-cat{display:inline-block;font-size:10px;color:var(--primary, #1d56c9);background:#dbeafe;padding:2px 7px;border-radius:4px;text-transform:uppercase;letter-spacing:.05em}.hni-title{font-size:13px;color:var(--text, #111);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.hni-date{font-size:11px;color:var(--muted, #6b7280)}.agenda-list{display:flex;flex-direction:column;gap:0}.agenda-row{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--border, #e5e7eb);transition:background .15s}.agenda-row:last-child{border-bottom:none}.agenda-row:hover{background:#f8faff;border-radius:8px;padding-left:8px;padding-right:8px}.agenda-date-box{flex-shrink:0;width:52px;height:52px;background:linear-gradient(135deg,var(--primary, #1d56c9),#2f6df0);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;line-height:1}.adb-day{font-size:20px;font-weight:900;display:block}.adb-mon{font-size:10px;font-weight:700;text-transform:uppercase;opacity:.85}.agenda-content{flex:1;min-width:0}.agenda-title,.service-card h4{font-size:14px;color:var(--text, #111)}.agenda-title{font-weight:800;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.agenda-detail,.service-card p{font-size:12px;color:var(--muted, #6b7280)}.agenda-detail{display:flex;gap:12px;flex-wrap:wrap}.agenda-detail span{display:inline-flex;align-items:center;gap:4px}.agenda-detail i{color:var(--primary, #1d56c9);font-size:11px}.agenda-empty{text-align:center;padding:28px;color:var(--muted, #9ca3af);display:flex;flex-direction:column;align-items:center;gap:8px;font-size:14px}.agenda-empty i{font-size:28px}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:16px}@media (max-width:860px){.service-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.service-grid{grid-template-columns:1fr}}.service-card{background:#fff;border:1px solid var(--border, #e5e7eb);padding:20px 16px;text-decoration:none;display:flex;flex-direction:column;gap:10px;cursor:pointer;position:relative;overflow:hidden}.org-node-wrap::before,.service-card::before{content:"";position:absolute;top:0;left:0;right:0}.service-card::before{height:3px;background:var(--primary, #1d56c9);transform:scaleX(0);transition:transform .2s;transform-origin:left}.service-card:hover{border-color:#bfdbfe}.service-card:hover::before{transform:scaleX(1)}.svc-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}.svc-icon--blue{background:#dbeafe;color:#2563eb}.svc-icon--purple{background:#ede9fe;color:#7c3aed}.svc-icon--green{background:#dcfce7;color:#16a34a}.svc-icon--orange{background:#ffedd5;color:#ea580c}.service-card h4{font-weight:900;margin:0;line-height:1.3}.service-card p{margin:0;line-height:1.5;flex:1}.svc-go{width:30px;height:30px;background:var(--primary-light, #eff6ff);color:var(--primary, #1d56c9);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;align-self:flex-start;margin-top:auto;transition:background .2s,transform .2s}.service-card:hover .svc-go{background:var(--primary, #1d56c9);color:#fff;transform:translateX(3px)}.home-panels{align-items:start}@media (max-width:860px){.home-panels{grid-template-columns:1fr}}.panel-news .section-head,.panel-services .section-head{margin-bottom:16px}.org-chart-wrap{overflow-x:auto;padding:8px 0 40px;-webkit-overflow-scrolling:touch}.org-chart{display:inline-flex;flex-direction:column;align-items:center;min-width:max-content;padding:8px 40px 16px}.org-root-row{display:flex;gap:0;align-items:flex-start;justify-content:center}.org-root-row>.org-node-wrap::before,.org-root-row>.org-node-wrap>.org-vline,body.is-admin #footer{display:none}.org-node,.org-node-wrap{display:flex;flex-direction:column;align-items:center;position:relative}.org-node-wrap{padding:0 20px}.org-node-wrap::before{height:2px;background:#222}.org-node-wrap:first-child::before{left:50%}.org-node-wrap:last-child::before{right:50%}.org-node-wrap:only-child::before{display:none}.org-vline{width:2px;height:32px;background:#222;flex-shrink:0}.org-children{display:flex;flex-direction:row;align-items:flex-start;justify-content:center;position:relative}.org-card,.org-photo{display:flex;align-items:center}.org-card{background:linear-gradient(160deg,#dbeafe 0,#1e40af 100%)!important;border:2px solid #3b82f6;border-radius:16px;padding:18px 14px 14px;flex-direction:column;gap:8px;width:148px;box-shadow:0 4px 16px rgba(30,64,175,.25);transition:transform .2s,box-shadow .2s;position:relative;cursor:default;text-align:center}.org-card:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(30,64,175,.4);z-index:2}.org-root>.org-card{width:172px;background:linear-gradient(160deg,#bfdbfe 0,#1d4ed8 100%);border-color:#1d4ed8;box-shadow:0 6px 24px rgba(29,78,216,.35)}.org-photo{width:68px;height:68px;border-radius:50%;overflow:hidden;border:3px solid rgba(255,255,255,.7);background:rgba(255,255,255,.2);justify-content:center;flex-shrink:0}.org-root>.org-card .org-photo{width:88px;height:88px}.so-ph-icon{font-size:26px;color:rgba(255,255,255,.5)}.org-root>.org-card .so-ph-icon{font-size:32px}.org-name{font-size:12px;font-weight:900;color:#fff;line-height:1.3;max-width:120px;word-break:break-word;text-shadow:0 1px 3px rgba(0,0,0,.3)}.org-root>.org-card .org-name{font-size:14px;max-width:148px}.org-jabatan{font-size:10px;font-weight:800;color:#1e3a8a;background:rgba(255,255,255,.85);padding:3px 9px;border-radius:999px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:130px}.org-root>.org-card .org-jabatan{font-size:11px;max-width:150px}.so-empty,.so-loading{text-align:center;color:var(--muted, #9ca3af);display:flex;align-items:center}.so-loading{padding:56px;font-size:15px;justify-content:center;gap:10px}.so-empty{padding:60px;flex-direction:column;gap:12px}.so-empty i{font-size:48px;opacity:.2}.so-nav-btns{margin-top:32px;display:flex;gap:10px;flex-wrap:wrap}@media (max-width:640px){.org-card{width:120px;padding:14px 10px 12px}.org-root>.org-card{width:140px}.org-photo{width:54px;height:54px}.org-root>.org-card .org-photo{width:68px;height:68px}.org-node-wrap{padding:0 8px}.org-name{font-size:11px}.org-jabatan{font-size:9px}}.agenda-public{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:16px}.agenda-card-full{display:flex;gap:20px;align-items:flex-start;background:#fff;border:1px solid var(--border, #e5e7eb);padding:20px 24px}.acf-date-box{flex-shrink:0;width:64px;height:72px;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;gap:1px;padding:6px 4px}.agenda-badge-upcoming{background:linear-gradient(135deg,var(--primary, #1d56c9),#2f6df0);color:#fff;box-shadow:0 4px 14px rgba(29,86,201,.35)}.agenda-badge-past{background:linear-gradient(135deg,#64748b,#94a3b8);color:#fff}.acf-day{font-size:26px;font-weight:900;display:block;line-height:1}.acf-mon{font-size:11px;font-weight:800;text-transform:uppercase;opacity:.9;letter-spacing:.04em}.acf-yr{font-size:10px;opacity:.75;font-weight:700}.acf-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.acf-status{margin-bottom:2px}.acf-tag{display:inline-block;font-size:10px;font-weight:900;padding:3px 10px;text-transform:uppercase;letter-spacing:.06em}.acf-tag-upcoming{background:#dbeafe;color:#1d4ed8}.acf-tag-past{background:#f1f5f9;color:#64748b}.acf-title{font-size:18px;font-weight:900;color:var(--text, #111);margin:0;line-height:1.3}.acf-meta{display:flex;flex-wrap:wrap;gap:12px;font-size:13px;color:var(--muted, #6b7280);font-weight:600}.acf-meta span{display:inline-flex;align-items:center;gap:5px}.acf-meta i{color:var(--primary, #1d56c9);font-size:12px}.acf-content{margin-top:4px;border-top:1px solid var(--border, #e5e7eb);padding-top:10px}.acf-content p{font-size:14px;color:var(--text, #333);line-height:1.65;margin:0 0 6px}.acf-content p:last-child{margin-bottom:0}.agenda-empty-full,.agenda-loading{text-align:center;color:var(--muted, #9ca3af);display:flex;align-items:center}.agenda-loading{padding:40px;font-size:14px;justify-content:center;gap:8px}.agenda-empty-full{padding:60px;flex-direction:column;gap:12px;font-size:15px}.agenda-empty-full i{font-size:40px;opacity:.25}@media (max-width:560px){.agenda-card-full{flex-direction:column;gap:14px;padding:16px}.acf-date-box{flex-direction:row;width:auto;height:auto;gap:6px;padding:8px 14px;border-radius:10px}.acf-day{font-size:20px}.acf-title{font-size:16px}}.pengumuman-page{padding:0 0 48px}.peng-filters,.peng-page-header{margin-bottom:24px}.peng-page-header h1{font-size:26px;font-weight:900;margin:0 0 4px;color:var(--text, #111)}.peng-filters{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end;background:#f8fafc;border:1px solid var(--border, #e5e7eb)}.peng-filter-field{display:flex;flex-direction:column;gap:6px}.peng-filter-search{flex:1;min-width:220px}.peng-filter-field label{font-size:11px;font-weight:800;color:var(--muted, #6b7280);text-transform:uppercase;letter-spacing:.05em;display:flex;align-items:center;gap:5px}.peng-filter-field input,.peng-filter-field select{border:1.5px solid var(--border, #e5e7eb);border-radius:8px;padding:8px 12px;font-size:14px;font-weight:600;color:var(--text, #111);background:#fff;outline:0;transition:border-color .2s,box-shadow .2s;min-width:160px;width:100%}.peng-filter-field input:focus,.peng-filter-field select:focus{border-color:var(--primary, #1d56c9);box-shadow:0 0 0 3px rgba(29,86,201,.1)}.announcement-card,.peng-list{display:flex;flex-direction:column;gap:16px}.announcement-card{background:#fff;border:1.5px solid var(--border, #e5e7eb);padding:20px 24px;gap:10px}.peng-card-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.peng-badge,.peng-date{display:inline-flex;align-items:center;gap:5px}.peng-badge{font-size:10px;padding:4px 10px;text-transform:uppercase}.peng-date{font-size:12px;font-weight:700;color:var(--muted, #6b7280);margin-left:auto}.peng-title{font-size:19px;font-weight:900;color:var(--text, #111);margin:0;line-height:1.3}.peng-body{border-top:1px solid var(--border, #e5e7eb);padding-top:12px}.peng-content-line{font-size:14px;color:#374151;line-height:1.7;margin:0 0 6px;font-weight:500}.peng-content-line:last-child{margin-bottom:0}.announcement-card .btn-ghost{font-weight:800;font-size:13px;color:var(--primary, #1d56c9);display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1.5px solid var(--border, #e5e7eb);border-radius:8px;background:0 0;cursor:pointer;text-decoration:none;transition:background .2s,border-color .2s}.announcement-card .btn-ghost:hover{background:#eff4ff;border-color:var(--primary, #1d56c9)}.announcement-card img[alt=Lampiran]{max-width:100%;max-height:320px;border-radius:10px;border:1px solid var(--border, #e5e7eb);display:block;object-fit:contain;cursor:zoom-in;margin-top:4px}.peng-empty{text-align:center;padding:56px;color:var(--muted, #9ca3af);border:1.5px dashed var(--border, #e5e7eb);border-radius:16px;display:flex;flex-direction:column;align-items:center;gap:12px;font-size:15px}.peng-empty i{font-size:40px;opacity:.2}@media (max-width:560px){.peng-filters{padding:14px 16px;gap:12px}.announcement-card{padding:16px}.peng-title{font-size:16px}.peng-date{margin-left:0}}.home-page .panel-services,.panel-services{background:#ffffff!important}.home-page .panel-services .section-head h2::after,.panel-services .section-head h2::after{background:#60a5fa!important}.home-page .panel-services .link-more,.panel-services .link-more{color:#93c5fd!important}.home-page .service-card,.panel-services .service-card{border:0!important;box-shadow:0 4px 18px rgba(0,0,0,.25)!important;color:#fff!important}.home-page .service-card:nth-child(1),.panel-services .service-card:nth-child(1){background:#ffffff!important;color:#111827!important}.home-page .service-card:nth-child(2),.panel-services .service-card:nth-child(2){background:#ffffff!important;color:#111827!important}.home-page .service-card:nth-child(3),.panel-services .service-card:nth-child(3){background:#ffffff!important;color:#111827!important}.home-page .service-card:nth-child(4),.panel-services .service-card:nth-child(4){background:#ffffff!important;color:#111827!important}.home-page .service-card .svc-icon,.panel-services .service-card .svc-icon{font-size:20px!important}.panel-services .service-card .svc-go{background:rgba(255,255,255,.2)!important;color:#fff!important}.home-page .service-card .svc-go,.panel-services .service-card .svc-go{border:1.5px solid rgba(255,255,255,.3)!important}.home-page .service-card:hover .svc-go,.panel-services .service-card:hover .svc-go{background:#2563eb!important;color:#fff!important}.home-page .panel-news,.panel-news{background:linear-gradient(150deg,#1e1b4b 0,#1e3a8a 50%,#0f172a 100%)!important}.home-page .panel-news .section-head h2::after{background:#a78bfa!important}.home-news-list{background:rgba(255,255,255,.07)!important;overflow:hidden!important}.home-news-item{transition:background .15s!important}.home-news-item:nth-child(1){border-left:3px solid #60a5fa}.home-news-item:nth-child(2){border-left:3px solid #a78bfa}.home-news-item:nth-child(3){border-left:3px solid #34d399}.home-news-item:nth-child(4){border-left:3px solid #fb923c}.home-news-item:nth-child(1) .hni-thumb-empty{background:linear-gradient(135deg,#1d4ed8,#4f46e5)!important;color:#93c5fd!important}.home-news-item:nth-child(2) .hni-thumb-empty{background:linear-gradient(135deg,#6d28d9,#a21caf)!important;color:#e9d5ff!important}.home-news-item:nth-child(3) .hni-thumb-empty{background:linear-gradient(135deg,#065f46,#047857)!important;color:#6ee7b7!important}.home-news-item:nth-child(4) .hni-thumb-empty{background:linear-gradient(135deg,#92400e,#d97706)!important;color:#fde68a!important}.home-body{background:linear-gradient(180deg,#f0f5ff 0,#e8efff 40%,#dce8ff 100%)!important}.home-page .panel-news,.home-page .panel-services,.panel-news,.panel-services{overflow:hidden!important}.panel-news .home-news-wrap{margin-top:4px}.home-duo-row>.home-card{border-radius:18px!important;box-shadow:0 6px 24px rgba(0,0,0,.15)!important;border:0!important}.home-section-wrap{background:#fff;border-radius:18px;padding:22px;border:1px solid rgba(29,86,201,.1);box-shadow:0 4px 20px rgba(29,86,201,.08);margin-bottom:24px}.home-body{background:#f0f4ff!important;padding-bottom:32px!important}.hero-wave path{fill:#f0f4ff!important}.home-duo-row,.home-panels{display:grid!important;grid-template-columns:1fr 1fr!important;gap:20px!important;margin:24px auto!important;max-width:1200px!important;padding:0 24px!important;box-sizing:border-box!important}.home-panels{grid-template-columns:1.05fr 1fr!important}@media (max-width:860px){.home-duo-row,.home-panels{grid-template-columns:1fr!important}}.home-section-wrap{display:none!important}.home-agenda-card{background:linear-gradient(145deg,#0c4a6e 0,#1a52ad 100%)!important;border-color:transparent!important;box-shadow:0 6px 24px rgba(3,105,161,.3)!important;color:#fff!important;min-height:320px!important}.home-agenda-card .section-head h2{color:#fff!important;font-size:20px!important}.home-agenda-card .section-head h2::after,.home-page .panel-services .section-head h2::after,.panel-services .section-head h2::after{background:rgba(255,255,255,.5)!important}.home-agenda-card .link-more{color:rgba(255,255,255,.85)!important}.home-agenda-card .agenda-row{display:flex!important;align-items:flex-start!important;gap:14px!important;padding:12px 0!important;border-bottom:1px solid rgba(255,255,255,.12)!important}.home-agenda-card .agenda-row:last-child{border-bottom:none!important}.home-agenda-card .agenda-date-box{background:rgba(255,255,255,.18)!important;border-radius:10px!important;min-width:52px!important;text-align:center!important;padding:8px 6px!important;flex-shrink:0!important;box-shadow:none!important}.home-agenda-card .adb-day{color:#fff!important;font-size:22px!important;font-weight:900!important;display:block!important;line-height:1!important}.home-agenda-card .adb-mon{color:rgba(255,255,255,.75)!important;font-size:11px!important;font-weight:700!important;text-transform:uppercase!important;display:block!important}.home-agenda-card .agenda-title{color:#fff!important;font-weight:800!important;font-size:14px!important;line-height:1.4!important}.home-agenda-card .agenda-detail{color:rgba(255,255,255,.65)!important;font-size:12px!important;margin-top:4px!important}.home-agenda-card .agenda-detail i{margin-right:4px!important}.home-agenda-card .agenda-empty{color:rgba(255,255,255,.6)!important;text-align:center!important;padding:40px 0!important}.home-page .panel-services,.panel-services{background:linear-gradient(145deg,#1e3a8a 0,#1d4ed8 100%)!important;border:0!important;border-radius:18px!important;padding:22px!important}.home-page .panel-services{box-shadow:0 8px 28px rgba(29,78,216,.3)!important}.home-page .panel-news .section-head h2,.home-page .panel-services .section-head h2,.panel-services .section-head h2{color:#fff!important}.home-page .panel-services .link-more,.panel-services .link-more{color:rgba(255,255,255,.85)!important}.panel-services .service-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:12px!important}@media (max-width:1024px){.panel-services .service-grid{grid-template-columns:repeat(2,1fr)!important}}.home-page .service-card,.panel-services .service-card{background:#ffffff!important;border:1px solid #e5e7eb!important;border-radius:14px!important;padding:18px 14px 48px!important;box-shadow:none!important;transition:transform .2s,box-shadow .2s,background .2s!important;position:relative!important}.home-page .service-card:hover,.panel-services .service-card:hover{background:rgba(255,255,255,.24)!important;border-color:rgba(255,255,255,.5)!important;transform:translateY(-5px)!important;box-shadow:0 10px 24px rgba(0,0,0,.2)!important}.home-page .service-card h4,.panel-services .service-card h4{color:#111827!important;font-size:13px!important;font-weight:800!important}.home-page .service-card p,.panel-services .service-card p{color:#6b7280!important;font-size:12px!important}.panel-services .svc-icon--blue{background:linear-gradient(135deg,#60a5fa,#2563eb)!important}.panel-services .svc-icon--purple{background:linear-gradient(135deg,#c084fc,#7c3aed)!important}.panel-services .svc-icon--green{background:linear-gradient(135deg,#34d399,#059669)!important}.panel-services .svc-icon--orange{background:linear-gradient(135deg,#fb923c,#ea580c)!important}.home-page .service-card .svc-go,.panel-services .svc-go{background:#eff6ff!important;color:#2563eb!important;border:1px solid #bfdbfe!important;width:30px!important;height:30px!important;border-radius:50%!important;display:flex!important;align-items:center!important;justify-content:center!important;position:absolute!important;bottom:14px!important;left:14px!important}.panel-services .service-card:hover .svc-go{background:#fff!important;color:#1d56c9!important}.home-page .panel-news,.panel-news{background:linear-gradient(145deg,#1e1b4b 0,#312e81 60%,#1e3a8a 100%)!important;border:0!important;border-radius:18px!important;padding:22px!important}.home-page .panel-news{box-shadow:0 8px 28px rgba(30,27,75,.4)!important}.panel-news .section-head h2::after{background:#a78bfa!important}.home-page .panel-news .link-more{color:#c4b5fd!important}.home-news-list{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:12px!important}.home-news-item{border-bottom:1px solid rgba(255,255,255,.08)!important}.home-news-item:hover{background:rgba(255,255,255,.12)!important}.home-news-item.active{background:rgba(255,255,255,.18)!important;border-left:3px solid #a78bfa!important}.hni-title{color:#f1f5f9!important}.hni-date{color:rgba(255,255,255,.5)!important}.hni-cat{color:#c4b5fd!important;background:rgba(167,139,250,.2)!important}.home-cta{max-width:calc(1200px - 48px)!important;margin:24px auto!important;border-radius:20px!important}.home-cta .cta-content{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:20px!important;padding:22px 28px!important}.home-cta .cta-text{font-size:18px!important;font-weight:900!important;color:#1e3a8a!important;max-width:600px!important}.home-cta .cta-btn{background:linear-gradient(145deg,#1e3a8a,#1d4ed8)!important;color:#fff!important;border:0!important;padding:12px 20px!important;border-radius:8px!important;font-size:14px!important;font-weight:800!important;transition:background .2s,box-shadow .2s!important}.home-cta .cta-btn:hover{background:linear-gradient(145deg,#1d4ed8,#1e3a8a)!important;box-shadow:0 6px 20px rgba(29,78,216,.4)!important}@media (max-width:600px){.home-cta .cta-content{flex-direction:column!important;text-align:center!important}.home-cta .cta-btn{width:100%!important}}.data-pagination .page-btn{background:var(--surface)}.data-pagination .page-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--modern-blue),var(--modern-indigo))!important}:root{--modern-blue:#2563eb;--modern-blue-2:#2f74dd;--modern-indigo:#4f46e5;--modern-purple:#7c3aed;--modern-cyan:#2f74dd;--modern-green:#10b981;--modern-orange:#f59e0b;--modern-red:#ef4444;--modern-ink:#0f172a;--modern-muted:#64748b;--modern-soft:#eff6ff;--modern-line:rgba(148, 163, 184, 0.24);--modern-card:rgba(255, 255, 255, 0.86);--modern-shadow:0 22px 60px -28px rgba(15, 23, 42, 0.38);--modern-shadow-sm:0 14px 34px -24px rgba(15, 23, 42, 0.36)}body:not(.is-admin):not(.is-staf):not(.is-warga){background:radial-gradient(circle at 12% 16%,rgba(37,99,235,.12),transparent 26%),radial-gradient(circle at 88% 12%,rgba(47,116,221,.12),transparent 24%),radial-gradient(circle at 70% 88%,rgba(124,58,237,.1),transparent 24%),linear-gradient(180deg,#f8fbff 0,#eef5ff 54%,#f8fbff 100%);color:var(--modern-ink)}body:not(.is-admin):not(.is-staf):not(.is-warga)::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.48;background-image:linear-gradient(rgba(37,99,235,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.055) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,#000 0,transparent 72%)}#header{background:rgba(255,255,255,.78)!important;border-bottom:1px solid rgba(226,232,240,.82)!important;backdrop-filter:blur(18px) saturate(170%);box-shadow:0 10px 30px -28px rgba(15,23,42,.36)}#header .dropdown>a,#header .nav-link,#header .navbar a{transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease}#header .navbar a.active,#header .navbar a:hover{transform:translateY(-1px);background:linear-gradient(135deg,rgba(37,99,235,.1),rgba(47,116,221,.1))!important;color:var(--modern-blue)!important}#header .btn-login,.navbar a.btn-login{background:linear-gradient(135deg,var(--modern-blue),var(--modern-indigo))!important;box-shadow:0 14px 30px -18px rgba(37,99,235,.8)!important}.page-banner{background:radial-gradient(circle at 12% 24%,rgba(255,255,255,.28),transparent 24%),radial-gradient(circle at 88% 20%,rgba(125,211,252,.3),transparent 24%),linear-gradient(135deg,#0b3b8f 0,#1d56c9 48%,#2f74dd 100%)!important}.page-banner::before{width:240px;height:240px;right:8%;top:-90px;border-radius:999px;background:rgba(255,255,255,.14);box-shadow:-260px 120px 0 rgba(255,255,255,.08)}.page-banner::after{inset:0;opacity:.34;background-image:radial-gradient(rgba(255,255,255,.55) 1.2px,transparent 1.2px);background-size:18px 18px;mask-image:linear-gradient(90deg,#000 0,transparent 78%)}.page-banner-icon,.page-banner-inner{align-items:center}.page-banner-icon{width:64px!important;height:64px!important;border-radius:20px!important;display:inline-flex;justify-content:center;background:rgba(255,255,255,.16)!important;border:1px solid rgba(255,255,255,.24)}.page-banner p{font-size:15px!important}.card{background:var(--modern-card)!important;box-shadow:var(--modern-shadow-sm)!important;backdrop-filter:blur(12px) saturate(150%)}.agenda-card,.agenda-card-full,.announcement-card,.berita-card,.gallery-card,.home-card,.info-card,.kontak-box,.kontak-card,.layanan-card,.news-card,.service-card{border:1px solid rgba(226,232,240,.92)!important;background:var(--modern-card)!important;box-shadow:var(--modern-shadow-sm)!important;backdrop-filter:blur(12px) saturate(150%)}.auth-card,.peng-filter-field,.search-box{background:var(--modern-card)!important;box-shadow:var(--modern-shadow-sm)!important;backdrop-filter:blur(12px) saturate(150%)}.agenda-card-full,.announcement-card,.gallery-card,.info-card,.kontak-card,.service-card{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.agenda-card-full:hover,.announcement-card:hover,.berita-card:hover,.gallery-card:hover,.info-card:hover,.kontak-card:hover,.service-card:hover{border-color:rgba(37,99,235,.28)!important;box-shadow:var(--modern-shadow)!important}.info-card:hover,.kontak-card:hover{transform:translateY(-4px)}.berita-toolbar,.galeri-filter,.peng-filters{background:rgba(255,255,255,.72);border:1px solid rgba(226,232,240,.86);border-radius:24px;padding:14px;box-shadow:0 16px 34px -28px rgba(15,23,42,.3);backdrop-filter:blur(12px)}.input,input,select,textarea{border-radius:16px!important;background:rgba(248,250,252,.94)!important}.input:focus,input:focus,select:focus,textarea:focus{border-color:rgba(37,99,235,.45)!important;box-shadow:0 0 0 4px rgba(37,99,235,.11)!important;background:#fff!important}.btn-auth,.filter-btn,.page-btn,.tab{transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease!important}.btn-auth:hover,.btn:hover,.filter-btn:hover,.page-btn:hover,.tab:hover{transform:translateY(-1px)}.tab.active{background:linear-gradient(135deg,var(--modern-blue),var(--modern-indigo))!important;box-shadow:0 18px 34px -22px rgba(37,99,235,.9)!important}.btn-primary,.tab.active{color:#fff!important}.btn-auth,.btn-primary,.btn-solid,.filter-btn.active{background:linear-gradient(135deg,var(--modern-blue),var(--modern-indigo))!important;box-shadow:0 18px 34px -22px rgba(37,99,235,.9)!important}.btn-auth{color:#fff!important}.berita-grid,.kontak-grid{gap:18px!important}.gallery-card{overflow:hidden}.berita-card img,.berita-thumb,.gallery-card img{transition:transform .35s ease,filter .35s ease}.berita-card:hover img,.gallery-card:hover img{transform:scale(1.045);filter:saturate(1.08) contrast(1.04)}.announcement-card{position:relative;overflow:hidden}.announcement-card::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:linear-gradient(180deg,var(--modern-blue),var(--modern-cyan))}.peng-badge{border-radius:999px!important;font-weight:900!important;letter-spacing:.02em}.agenda-card-full{overflow:hidden}.acf-date-box,.agenda-date{background:linear-gradient(135deg,#334155,#64748b)!important;box-shadow:0 16px 28px -20px rgba(15,23,42,.65)}.acf-tag,.acf-tag-past,.acf-tag-upcoming{border-radius:999px!important}.kontak-card .icon,.stat-icon,.svc-icon{box-shadow:0 14px 28px -18px currentColor}.data-pagination{padding:8px 0 2px}.data-pagination .page-btn{background:rgba(255,255,255,.88)!important;border:1px solid rgba(226,232,240,.95)!important;box-shadow:0 12px 26px -20px rgba(15,23,42,.4)}.auth-card,.auth-page{position:relative;overflow:hidden}.auth-page{min-height:calc(100vh - 86px)!important;padding:clamp(34px,5vw,72px) 24px!important}.auth-page::after,.auth-page::before{content:"";position:absolute;pointer-events:none;border-radius:999px;filter:blur(2px)}.auth-page::before{width:520px;height:520px;left:-170px;top:40px;background:radial-gradient(circle,rgba(37,99,235,.2),transparent 68%)}.auth-page::after{width:440px;height:440px;right:-120px;bottom:-80px;background:radial-gradient(circle,rgba(47,116,221,.22),transparent 68%)}.auth-card{z-index:1;width:min(540px,100%)!important;padding:clamp(24px,4vw,36px)!important}.auth-card.wide{width:min(860px,100%)!important}.auth-card::before{content:"";position:absolute;inset:0 0 auto 0;height:7px;background:linear-gradient(90deg,var(--modern-blue),var(--modern-cyan),var(--modern-purple))}.auth-card::after{content:"Kelurahan Duren Mekar";position:absolute;right:22px;top:18px;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:rgba(37,99,235,.28)}.auth-icon{width:68px;height:68px;border-radius:24px;display:inline-flex;align-items:center;justify-content:center;margin-bottom:16px;color:#fff;font-size:24px;background:linear-gradient(135deg,var(--modern-blue),var(--modern-indigo));box-shadow:0 24px 46px -26px rgba(37,99,235,.9)}.auth-card h1,.auth-card h2{font-size:clamp(24px,3vw,34px)!important;letter-spacing:-.035em;margin-bottom:8px!important}.auth-subtitle{color:var(--modern-muted);font-weight:700;line-height:1.65;margin-bottom:20px!important}.auth-card label{color:#334155;font-size:12px!important;letter-spacing:.02em;text-transform:uppercase}.auth-card input{height:50px!important;border-radius:16px!important;background:#f8fafc!important;border:1px solid #e2e8f0!important}.auth-card input:focus{background:#fff!important;box-shadow:0 0 0 4px rgba(37,99,235,.12)!important;border-color:rgba(37,99,235,.5)!important}.auth-card .form-grid{gap:14px!important}.auth-card .btn-auth{height:52px;border-radius:18px!important;font-size:15px!important}.auth-links{margin-top:18px!important;padding:14px!important;border-radius:18px;background:linear-gradient(135deg,rgba(37,99,235,.07),rgba(47,116,221,.07));border:1px solid rgba(37,99,235,.1);display:grid;gap:8px;text-align:center;color:var(--modern-muted);font-weight:700}.auth-links a,.back-home{color:var(--modern-blue)!important;font-weight:900!important}.back-home{display:inline-flex!important;margin-top:18px!important;align-items:center;gap:8px}.auth-error,.auth-info{border:1px solid rgba(255,255,255,.65);box-shadow:0 14px 30px -24px rgba(15,23,42,.45)}.info-reset-card{border-radius:20px!important;background:linear-gradient(135deg,rgba(37,99,235,.06),rgba(16,185,129,.06))!important}.bullets li,.info-reset-list li{padding:8px 0}@media (max-width:768px){.page-banner-inner{gap:14px!important;text-align:left}.page-banner-icon{width:54px!important;height:54px!important;border-radius:18px!important}.berita-toolbar,.galeri-filter,.peng-filters{border-radius:20px;padding:12px}.auth-page{padding:24px 14px!important}.auth-card{border-radius:24px!important}.auth-card::after{display:none}}.home-card.home-agenda-card,.home-card.home-galeri-card,.home-card.home-pengumuman-card,.home-card.home-visimisi-card,.panel-news,.panel-services{border:1px solid rgba(226,232,240,.86)!important;box-shadow:0 22px 54px -30px rgba(15,23,42,.36)!important}.home-card.home-agenda-card,.panel-services{background:rgba(255,255,255,.92)!important;color:var(--modern-ink)!important}.home-card.home-visimisi-card{background:radial-gradient(circle at 88% 18%,rgba(96,165,250,.24),transparent 28%),linear-gradient(135deg,#101827 0,#16213e 58%,#0f3460 100%)!important;color:#fff!important}.home-galeri-card *,.home-pengumuman-card *,.home-visimisi-card h2,.home-visimisi-card h4,.home-visimisi-card i,.home-visimisi-card li,.home-visimisi-card p,.home-visimisi-card span{color:inherit}.home-visimisi-card #homeVisiText,.home-visimisi-card .visimisi-misi-list li{color:rgba(255,255,255,.9)!important}.home-card.home-galeri-card{background:radial-gradient(circle at 88% 14%,rgba(255,255,255,.28),transparent 28%),linear-gradient(135deg,#b45309 0,#f59e0b 62%,#fcd34d 100%)!important;color:#fff!important}.home-card.home-pengumuman-card{background:radial-gradient(circle at 88% 14%,rgba(255,255,255,.22),transparent 28%),linear-gradient(135deg,#065f46 0,#059669 62%,#34d399 100%)!important;color:#fff!important}.home-galeri-card .link-more,.home-galeri-card .section-head h2,.home-pengumuman-card .link-more,.home-pengumuman-card .section-head h2{color:#fff!important;text-shadow:0 1px 8px rgba(15,23,42,.24)}.home-galeri-card .empty-card,.home-galeri-card .loading-card,.home-pengumuman-card .empty-card,.home-pengumuman-card .loading-card{color:rgba(255,255,255,.92)!important;background:rgba(255,255,255,.14)!important;border-color:rgba(255,255,255,.2)!important}.home-galeri-item{background:rgba(255,255,255,.2)!important;border:1px solid rgba(255,255,255,.22)}.home-galeri-caption{color:#fff!important}.home-peng-item{background:rgba(255,255,255,.16)!important;border:1px solid rgba(255,255,255,.22)!important}.home-peng-item:hover{background:rgba(255,255,255,.26)!important}.admin-side .side-head,.admin-side .side-head h3,.home-peng-badge,.home-peng-date,.home-peng-item,.home-peng-item small,.home-peng-item span,.home-peng-left,.home-peng-right,.home-peng-title,.panel-news .link-more,.panel-news .section-head h2,.panel-news a,.panel-news h3,.panel-news p,.panel-news small,.panel-news span,.staf-side .side-head,.staf-side .side-head h3,.warga-side .side-head,.warga-side .side-head h3{color:#fff!important}.home-peng-badge{background:rgba(255,255,255,.22)!important}.home-news-featured,.home-news-list,.home-news-wrap,.panel-news{color:#fff}.panel-news{background:radial-gradient(circle at 88% 14%,rgba(255,255,255,.18),transparent 28%),linear-gradient(135deg,#172554 0,#1d4ed8 58%,#2563eb 100%)!important}.home-body .section-head h2{letter-spacing:-.02em}.home-body .section-head .link-more{border-radius:999px;padding:6px 10px;background:rgba(37,99,235,.08)}.home-galeri-card .section-head .link-more,.home-pengumuman-card .section-head .link-more,.panel-news .section-head .link-more{background:rgba(255,255,255,.16)!important;border:1px solid rgba(255,255,255,.2)}body.is-admin,body.is-staf,body.is-warga{background:radial-gradient(circle at 12% 10%,rgba(37,99,235,.1),transparent 24%),radial-gradient(circle at 92% 8%,rgba(47,116,221,.1),transparent 24%),linear-gradient(180deg,#f8fbff 0,#eef4ff 100%)!important}.admin-shell,.staf-shell,.warga-shell{isolation:isolate}.warga-side{border:1px solid rgba(148,163,184,.24)!important;box-shadow:0 24px 60px -34px rgba(15,23,42,.75)!important}.admin-side,.staf-side,.warga-side{background:radial-gradient(circle at 90%0,rgba(37,99,235,.18),transparent 30%),linear-gradient(180deg,#08111f 0,#0f172a 100%)!important}.warga-side a{transition:transform .16s ease,background .16s ease,color .16s ease}.admin-side a,.staf-side a,.warga-side a{color:rgba(226,232,240,.88)!important}.staf-side a{transition:transform .16s ease,background .16s ease,color .16s ease}.warga-side a.active,.warga-side a:hover{transform:translateX(3px)}.admin-side a.active,.admin-side a:hover,.staf-side a.active,.staf-side a:hover,.warga-side a.active,.warga-side a:hover{color:#fff!important;background:linear-gradient(135deg,rgba(37,99,235,.92),rgba(47,116,221,.82))!important}.admin-side a.active,.staf-side a.active,.staf-side a:hover{transform:translateX(3px)}.warga-card{background:rgba(255,255,255,.9)!important;backdrop-filter:blur(12px) saturate(150%)}.admin-card,.admin-main .card,.staf-card,.warga-metrics .metric{border-radius:22px!important}.admin-card,.admin-main .card,.metric,.staf-card,.warga-metrics .metric{background:rgba(255,255,255,.9)!important;border:1px solid rgba(226,232,240,.92)!important;box-shadow:0 18px 42px -30px rgba(15,23,42,.34)!important;backdrop-filter:blur(12px) saturate(150%)}.admin-card:hover,.admin-main .card:hover,.staf-card:hover,.warga-card:hover,.warga-metrics .metric:hover{box-shadow:0 24px 60px -36px rgba(15,23,42,.42)!important}.admin-top,.staf-top,.warga-top{background:rgba(255,255,255,.7);border:1px solid rgba(226,232,240,.82);border-radius:22px;padding:14px 16px;box-shadow:0 16px 40px -32px rgba(15,23,42,.3);backdrop-filter:blur(12px)}.admin-top h1,.staf-top h1,.warga-top h1,.wizard-head h1{letter-spacing:-.035em}.admin-table,.table,.warga-table{border-radius:18px;overflow:hidden}.admin-table thead th,.table thead th,.warga-table thead th{background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(47,116,221,.08))!important;color:#1e3a8a!important}.admin-table tbody tr,.warga-table tbody tr{transition:background .15s ease}.admin-table tbody tr:hover,.table tbody tr:hover,.warga-table tbody tr:hover{background:rgba(37,99,235,.045)!important}.kontak-page .kontak-grid{align-items:stretch}.kontak-page .kontak-card{min-height:180px}.kontak-page .kontak-card::after{content:"";position:absolute;right:-46px;top:-46px;width:130px;height:130px;border-radius:999px;background:radial-gradient(circle,rgba(37,99,235,.14),transparent 65%)}.kontak-box h3,.kontak-page .kontak-card .icon{display:inline-flex;align-items:center;margin-bottom:14px}.kontak-page .kontak-card .icon{width:54px;height:54px;border-radius:18px;justify-content:center;color:#fff!important;font-size:20px}.kontak-page .kontak-card .icon.blue{background:linear-gradient(135deg,#2563eb,#2f74dd)}.kontak-page .kontak-card .icon.green{background:linear-gradient(135deg,#059669,#34d399)}.kontak-page .kontak-card .icon.purple{background:linear-gradient(135deg,#7c3aed,#ec4899)}.kontak-page .kontak-card h4{font-size:17px;font-weight:950;letter-spacing:-.02em;margin-bottom:6px}.kontak-page .kontak-card p{font-weight:850;color:#1e293b}.kontak-box,.kontak-page .kontak-card{position:relative;padding:22px!important;overflow:hidden}.kontak-box h3{gap:8px;font-size:18px;letter-spacing:-.025em}.kontak-box h3::before,.service-page .section-title::before,.service-section .section-title::before{content:"";width:10px;height:22px;border-radius:99px;background:linear-gradient(180deg,var(--modern-blue),var(--modern-cyan))}#kFaqBox>*,.rt-grid>*,.sosial-list li{border-radius:16px!important;background:rgba(248,250,252,.82)!important;border:1px solid rgba(226,232,240,.78)!important;padding:12px 14px!important}.service-page .page-header{border-radius:30px;padding:clamp(24px,4vw,38px);background:radial-gradient(circle at 88% 12%,rgba(255,255,255,.24),transparent 28%),linear-gradient(135deg,#0f3b8f 0,#1d56c9 54%,#2f74dd 100%)}.service-page .page-title{color:#fff!important;font-size:clamp(28px,4vw,46px)!important;line-height:1.08;letter-spacing:-.04em}.service-page #srvDeskripsi{color:rgba(255,255,255,.86)!important;max-width:820px}.service-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.service-section{margin-top:24px}.service-page .section-title,.service-section .section-title{display:inline-flex;align-items:center;gap:10px;font-size:22px;font-weight:950;letter-spacing:-.025em;margin-bottom:12px}.service-page .section-title::before,.service-section .section-title::before{width:12px;height:26px;border-radius:999px}.service-page .card{border-radius:24px!important}.service-page .card-body,.wizard-card .card-body{padding:20px!important}.numbered-list{counter-reset:modern-counter;display:grid;gap:10px}.numbered-list li{counter-increment:modern-counter;position:relative;padding:12px 14px 12px 54px!important;border-radius:16px;background:rgba(248,250,252,.88);border:1px solid rgba(226,232,240,.86);font-weight:750}.numbered-list li::before{content:counter(modern-counter);position:absolute;left:14px;top:50%;transform:translateY(-50%);width:28px;height:28px;display:grid;place-items:center;border-radius:10px;color:#fff;font-weight:950}.timeline{display:grid;gap:12px}.timeline>*{border-radius:16px!important;background:rgba(248,250,252,.88)!important;border:1px solid rgba(226,232,240,.86)!important}.info-block{border-radius:20px;padding:18px;background:linear-gradient(135deg,rgba(37,99,235,.055),rgba(47,116,221,.055));border:1px solid rgba(37,99,235,.1)}.section-title-sm{font-weight:950!important;color:#1e3a8a}.card-warning{background:linear-gradient(135deg,rgba(245,158,11,.1),rgba(251,191,36,.12))!important;border-color:rgba(245,158,11,.25)!important}.wizard-modal-page{min-height:calc(100vh - 80px);background:radial-gradient(circle at 18% 18%,rgba(37,99,235,.16),transparent 26%),radial-gradient(circle at 86% 16%,rgba(47,116,221,.14),transparent 26%)}.wizard-overlay{display:grid;place-items:center}.wizard-card,.wizard-dialog{border-radius:30px!important;border:1px solid rgba(226,232,240,.96)!important;box-shadow:0 34px 90px -48px rgba(15,23,42,.55)!important}.wizard-head{padding:24px 28px!important;color:#fff;background:radial-gradient(circle at 92% 16%,rgba(255,255,255,.22),transparent 28%),linear-gradient(135deg,#0f3b8f,#2563eb 58%,#2f74dd)}.wizard-head h1{color:#fff!important;font-size:clamp(24px,3vw,34px)}.wizard-head .muted{color:rgba(255,255,255,.84)!important}.icon-btn{width:42px;height:42px;border-radius:14px;border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.16);color:#fff;display:inline-flex;align-items:center;justify-content:center}.wizard-body{padding:24px!important}.wizard-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:22px}.wizard-step{border-radius:18px;padding:14px;background:rgba(248,250,252,.92);border:1px solid rgba(226,232,240,.92);display:flex;align-items:center;gap:10px}.wizard-step.is-active{background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(47,116,221,.12));border-color:rgba(37,99,235,.24)}.step-circle{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;color:#fff;font-weight:950;background:linear-gradient(135deg,#94a3b8,#64748b)}.numbered-list li::before,.wizard-step.is-active .step-circle{background:linear-gradient(135deg,var(--modern-blue),var(--modern-indigo))}.step-label{font-weight:900;color:#334155}.wizard-pane{animation:fadeSlideUp .22s ease both}.wizard-choice-list{display:grid;gap:12px}.wizard-choice-list>*{border-radius:18px!important;border:1px solid rgba(226,232,240,.92)!important;background:rgba(255,255,255,.92)!important;transition:transform .18s ease,box-shadow .18s ease}.wizard-choice-list>:hover{transform:translateY(-2px);box-shadow:0 18px 40px -30px rgba(15,23,42,.42)!important}.upload-dropzone{border:2px dashed rgba(37,99,235,.28)!important;border-radius:20px!important;background:linear-gradient(135deg,rgba(37,99,235,.055),rgba(47,116,221,.055))!important;min-height:150px;display:grid!important;place-items:center;cursor:pointer}.upload-icon{width:56px;height:56px;margin:0 auto 10px;border-radius:18px;display:grid;place-items:center;color:#fff;font-size:22px;background:linear-gradient(135deg,var(--modern-blue),var(--modern-indigo))}.help-box{border-radius:18px;padding:14px 16px;background:rgba(47,116,221,.08);border:1px solid rgba(47,116,221,.18);color:#16458f}.wizard-footer{display:flex;justify-content:flex-end;gap:10px}.admin-metrics .metric,.warga-metrics .metric{position:relative;overflow:hidden}.admin-metrics .metric::after,.warga-metrics .metric::after{content:"";position:absolute;right:-34px;top:-34px;width:100px;height:100px;border-radius:999px;background:rgba(37,99,235,.1)}.admin-metrics .metric:nth-child(2)::after,.warga-metrics .metric:nth-child(2)::after{background:rgba(47,116,221,.12)}.admin-metrics .metric:nth-child(3)::after,.warga-metrics .metric:nth-child(3)::after{background:rgba(16,185,129,.12)}.admin-metrics .metric:nth-child(4)::after,.warga-metrics .metric:nth-child(4)::after{background:rgba(245,158,11,.14)}.admin-metrics .label,.warga-metrics .label{color:#64748b!important;font-size:12px!important;letter-spacing:.04em}.metric .label{color:#64748b!important}.admin-metrics .value,.warga-metrics .value{color:#0f172a!important;letter-spacing:-.04em}.metric .value{letter-spacing:-.04em}.cta-actions,.form-actions,.row-actions,.top-actions{gap:10px!important}.modal .modal-panel,.modal-panel{border-radius:28px!important;border:1px solid rgba(226,232,240,.96)!important;box-shadow:0 34px 90px -48px rgba(15,23,42,.58)!important}.modal .modal-panel{overflow:hidden}.modal-head{background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(47,116,221,.08))!important}@media (max-width:820px){.wizard-steps{grid-template-columns:1fr}.wizard-footer{flex-direction:column}.wizard-footer .btn{width:100%}.service-page .page-header{border-radius:24px}}.service-wizard.wizard-modal-page,.wizard-modal-page{min-height:calc(100dvh - 72px)!important;height:auto!important;padding:clamp(12px,3vw,28px) 12px!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch}.service-wizard .wizard-overlay,.wizard-overlay{min-height:calc(100dvh - 96px)!important;height:auto!important;display:flex!important;align-items:flex-start!important;justify-content:center!important;padding:0!important;overflow:visible!important}.service-wizard .wizard-card,.service-wizard .wizard-dialog,.wizard-card,.wizard-dialog{width:min(1040px,100%)!important;max-height:calc(100dvh - 104px)!important;height:auto!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}.service-wizard .wizard-head,.wizard-head{flex:0 0 auto!important}.service-wizard .wizard-body,.wizard-body{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch;padding:clamp(14px,3vw,24px)!important}.service-wizard .wizard-content,.wizard-content{min-height:0!important}.service-wizard .wizard-footer,.wizard-footer{position:sticky!important;bottom:0!important;z-index:5!important;flex:0 0 auto!important;background:rgba(255,255,255,.94)!important;backdrop-filter:blur(12px) saturate(160%);margin:18px -24px -24px!important;padding:14px 24px!important;border-top:1px solid rgba(226,232,240,.95)!important}.service-wizard .wizard-choice-list,.wizard-choice-list{max-height:none!important;overflow:visible!important}.service-wizard .wizard-choice-list>*,.wizard-choice-list>*{min-width:0!important}@media (max-width:820px),(max-height:760px){.service-wizard.wizard-modal-page,.wizard-modal-page{min-height:100dvh!important;padding:8px!important}.service-wizard .wizard-overlay,.wizard-overlay{min-height:calc(100dvh - 16px)!important}.service-wizard .wizard-card,.service-wizard .wizard-dialog,.wizard-card,.wizard-dialog{width:100%!important;max-height:calc(100dvh - 16px)!important;border-radius:22px!important}.service-wizard .wizard-head,.wizard-head{padding:16px 18px!important}.service-wizard .wizard-head h1,.wizard-head h1{font-size:20px!important;line-height:1.15!important}.service-wizard .wizard-body,.wizard-body{padding:14px!important}.service-wizard .wizard-steps,.wizard-steps{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;margin-bottom:14px!important}.service-wizard .wizard-step,.wizard-step{padding:10px 8px!important;flex-direction:column!important;text-align:center!important;gap:6px!important}.service-wizard .step-circle,.step-circle{width:30px!important;height:30px!important;border-radius:10px!important}.service-wizard .step-label,.step-label{font-size:10px!important;line-height:1.2!important}.service-wizard .form-grid,.wizard-card .form-grid{grid-template-columns:1fr!important}.service-wizard .wizard-footer,.wizard-footer{margin:14px -14px -14px!important;padding:12px 14px!important;display:grid!important;grid-template-columns:1fr!important;gap:8px!important}.service-wizard .wizard-footer .btn,.wizard-footer .btn{width:100%!important;min-height:44px!important}}@supports not (height:100dvh){.service-wizard .wizard-card,.service-wizard .wizard-dialog,.wizard-card,.wizard-dialog{max-height:calc(100vh - 104px)!important}@media (max-width:820px),(max-height:760px){.service-wizard .wizard-card,.service-wizard .wizard-dialog,.wizard-card,.wizard-dialog{max-height:calc(100vh - 16px)!important}}}.home-page .hero-photo-card{isolation:isolate!important}.home-page .hero-locpill{left:18px!important;right:18px!important;bottom:18px!important;top:auto!important;width:auto!important;max-width:none!important;min-height:54px!important;display:flex!important;align-items:center!important;gap:10px!important;padding:10px 12px!important;border-radius:16px!important;background:rgba(15,23,42,.74)!important;border:1px solid rgba(255,255,255,.2)!important;color:#fff!important;box-shadow:0 18px 36px -26px rgba(0,0,0,.75)!important;backdrop-filter:blur(14px) saturate(160%)!important;pointer-events:none!important;transform:none!important;z-index:5!important}.home-page .hero-locpill::before{content:"Lokasi Kantor";position:absolute;left:58px;top:7px;font-size:9px;line-height:1;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:rgba(191,219,254,.96)}.home-page .hero-locpill i,.home-page .hero-locpill-icon{width:34px!important;height:34px!important;min-width:34px!important;border-radius:12px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:linear-gradient(135deg,#2563eb,#2f74dd)!important;color:#fff!important;box-shadow:none!important}.home-page .hero-locpill span:last-child,.home-page .hero-locpill>span:not(.hero-locpill-icon){min-width:0!important;padding-top:9px!important}.home-page .hero-locpill small,.home-page .hero-locpill strong{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.home-page .hero-locpill strong{color:#fff!important;font-size:12px!important;line-height:1.2!important;font-weight:950!important}.home-page .hero-locpill small{color:rgba(226,232,240,.86)!important;font-size:10px!important;line-height:1.25!important}@media (max-width:680px){.home-page .hero-locpill{display:none!important}}.home-page .home-agenda-card,.home-page .home-card.home-agenda-card{background:radial-gradient(circle at 86% 12%,rgba(37,99,235,.1),transparent 26%),linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.96))!important;color:#0f172a!important;border:1px solid rgba(203,213,225,.92)!important;box-shadow:0 22px 56px -34px rgba(15,23,42,.38)!important}.home-page .home-agenda-card .section-head{gap:12px!important;margin-bottom:14px!important}.home-page .home-agenda-card .section-head h2{color:#0f172a!important;font-size:19px!important;font-weight:950!important;letter-spacing:-.025em!important;text-shadow:none!important}.home-page .home-agenda-card .section-head h2::after{background:linear-gradient(90deg,#2563eb,#2f74dd)!important;opacity:1!important}.home-page .home-agenda-card .link-more{color:#1d4ed8!important;background:rgba(37,99,235,.08)!important;border:1px solid rgba(37,99,235,.14)!important;border-radius:999px!important;padding:6px 10px!important;font-weight:900!important;text-shadow:none!important}.home-page .home-agenda-card .agenda-list{display:grid!important;gap:10px!important}.home-page .home-agenda-card .agenda-row{display:grid!important;grid-template-columns:54px minmax(0,1fr)!important;align-items:center!important;gap:12px!important;padding:11px!important;border:1px solid rgba(226,232,240,.94)!important;border-radius:16px!important;box-shadow:0 12px 26px -24px rgba(15,23,42,.35)!important}.home-page .home-agenda-card .agenda-row:hover{background:#f8fbff!important;border-color:rgba(37,99,235,.22)!important;transform:translateY(-1px)!important}.home-page .home-agenda-card .agenda-date-box{width:54px!important;height:54px!important;min-width:54px!important;padding:0!important;border-radius:15px!important;background:linear-gradient(135deg,#2563eb,#2f74dd)!important;box-shadow:0 14px 28px -20px rgba(37,99,235,.65)!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;color:#fff!important}.home-page .home-agenda-card .adb-day{display:block!important;color:#fff!important;font-size:20px!important;line-height:1!important;font-weight:1000!important}.home-page .home-agenda-card .adb-mon{display:block!important;color:rgba(255,255,255,.88)!important;font-size:10px!important;line-height:1.1!important;margin-top:3px!important;font-weight:900!important;letter-spacing:.04em!important;text-transform:uppercase!important}.home-page .home-agenda-card .agenda-content{min-width:0!important}.home-page .home-agenda-card .agenda-title{display:block!important;color:#0f172a!important;font-size:13.5px!important;line-height:1.35!important;font-weight:950!important;margin:0 0 5px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;text-shadow:none!important}.home-page .home-agenda-card .agenda-detail{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important;color:#64748b!important;font-size:11.5px!important;line-height:1.35!important;margin-top:0!important}.home-page .home-agenda-card .agenda-detail span{display:inline-flex!important;align-items:center!important;gap:4px!important;color:#64748b!important}.home-page .home-agenda-card .agenda-detail i{color:#2563eb!important;margin-right:0!important}.home-page .home-agenda-card .agenda-empty,.home-page .home-agenda-card .empty-card,.home-page .home-agenda-card .loading-card{color:#475569!important;background:rgba(248,250,252,.95)!important;border:1px dashed rgba(148,163,184,.55)!important;border-radius:16px!important;padding:24px!important;text-align:center!important}@media (max-width:980px){.home-page .home-duo-row,.home-page .home-panels{grid-template-columns:1fr!important}}:root{--feature-bg-image:url('/assets/img/bg-kelurahan.jpg');--feature-bg-overlay-1:rgba(4, 82, 100, 0.88);--feature-bg-overlay-2:rgba(15, 118, 110, 0.70);--feature-bg-dark:#064e5f;--feature-bg-accent:#fbbf24}.page-banner{background-image:linear-gradient(90deg,var(--feature-bg-overlay-1) 0%,rgba(6,78,95,.78) 46%,rgba(6,78,95,.55) 100%),var(--feature-bg-image)!important;background-repeat:no-repeat!important;box-shadow:inset 0-1px 0 rgba(255,255,255,.14)!important}.layanan-page .page-header,.public-feature-hero{position:relative!important;isolation:isolate!important;overflow:hidden!important;min-height:clamp(280px,42vh,460px)!important;display:flex!important;align-items:center!important;color:#fff!important;background-size:cover!important;background-position:center!important}.layanan-page .page-header,.public-feature-hero,.service-page .page-header{background-image:linear-gradient(90deg,var(--feature-bg-overlay-1) 0%,rgba(6,78,95,.78) 46%,rgba(6,78,95,.55) 100%),var(--feature-bg-image)!important;background-repeat:no-repeat!important;box-shadow:inset 0-1px 0 rgba(255,255,255,.14)!important}.agenda-page .page-header,.berita-page .page-header,.faq-page .page-header,.galeri-page .page-header,.kontak-page .page-header,.lapor-page .page-header,.lembaga-page .page-header,.pengumuman-page .page-header,.peta-page .page-header,.profil-page .page-header,.struktur-page .page-header,.unit-kerja-page .page-header{position:relative!important;isolation:isolate!important;overflow:hidden!important;min-height:clamp(280px,42vh,460px)!important;display:flex!important;align-items:center!important;color:#fff!important;background-image:linear-gradient(90deg,var(--feature-bg-overlay-1) 0%,rgba(6,78,95,.78) 46%,rgba(6,78,95,.55) 100%),var(--feature-bg-image)!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;box-shadow:inset 0-1px 0 rgba(255,255,255,.14)!important}.agenda-page .page-header::before,.berita-page .page-header::before,.faq-page .page-header::before,.galeri-page .page-header::before,.kontak-page .page-header::before,.lapor-page .page-header::before,.layanan-page .page-header::before,.lembaga-page .page-header::before,.pengumuman-page .page-header::before,.peta-page .page-header::before,.profil-page .page-header::before,.public-feature-hero::before,.struktur-page .page-header::before,.unit-kerja-page .page-header::before{content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;pointer-events:none!important;opacity:.24!important;background-image:radial-gradient(rgba(255,255,255,.86) 1px,transparent 1px)!important;background-size:18px 18px!important;mask-image:linear-gradient(90deg,#000 0,transparent 70%)!important}.agenda-page .page-header::after,.berita-page .page-header::after,.faq-page .page-header::after,.galeri-page .page-header::after,.kontak-page .page-header::after,.lapor-page .page-header::after,.layanan-page .page-header::after,.lembaga-page .page-header::after,.page-banner::after,.pengumuman-page .page-header::after,.peta-page .page-header::after,.profil-page .page-header::after,.public-feature-hero::after,.service-page .page-header::after,.struktur-page .page-header::after,.unit-kerja-page .page-header::after{content:""!important;position:absolute!important;right:-120px!important;top:-160px!important;width:440px!important;height:440px!important;border-radius:999px!important;z-index:-1!important;pointer-events:none!important;background:rgba(255,255,255,.12)!important}.agenda-page .page-header>*,.berita-page .page-header>*,.faq-page .page-header>*,.galeri-page .page-header>*,.kontak-page .page-header>*,.lapor-page .page-header>*,.layanan-page .page-header>*,.lembaga-page .page-header>*,.pengumuman-page .page-header>*,.peta-page .page-header>*,.profil-page .page-header>*,.public-feature-hero .container,.struktur-page .page-header>*,.unit-kerja-page .page-header>*{position:relative!important;z-index:1!important}.agenda-page .page-header h1,.berita-page .page-header h1,.faq-page .page-header h1,.galeri-page .page-header h1,.kontak-page .page-header h1,.lapor-page .page-header h1,.layanan-page .page-header h1,.lembaga-page .page-header h1,.page-banner h2,.pengumuman-page .page-header h1,.peta-page .page-header h1,.profil-page .page-header h1,.public-feature-hero h1,.public-feature-hero h2,.public-feature-hero p,.struktur-page .page-header h1,.unit-kerja-page .page-header h1{color:#fff!important;text-shadow:0 3px 18px rgba(0,0,0,.28)!important}.agenda-page .page-header h1,.berita-page .page-header h1,.faq-page .page-header h1,.galeri-page .page-header h1,.kontak-page .page-header h1,.lapor-page .page-header h1,.layanan-page .page-header h1,.lembaga-page .page-header h1,.pengumuman-page .page-header h1,.peta-page .page-header h1,.profil-page .page-header h1,.public-feature-hero h1,.struktur-page .page-header h1,.unit-kerja-page .page-header h1{font-size:clamp(30px,5vw,58px)!important;line-height:1.05!important;font-weight:1000!important;letter-spacing:-.045em!important;max-width:860px!important}.page-banner p{color:rgba(255,255,255,.9)!important}.layanan-page .page-header p,.public-feature-hero p{max-width:720px!important;color:rgba(255,255,255,.9)!important;font-size:clamp(15px,2vw,18px)!important;line-height:1.7!important;font-weight:750!important}.service-page .page-header p{color:rgba(255,255,255,.9)!important}.agenda-page .page-header p,.berita-page .page-header p,.faq-page .page-header p,.galeri-page .page-header p,.kontak-page .page-header p,.lapor-page .page-header p,.lembaga-page .page-header p,.pengumuman-page .page-header p,.peta-page .page-header p,.profil-page .page-header p,.struktur-page .page-header p,.unit-kerja-page .page-header p{max-width:720px!important;color:rgba(255,255,255,.9)!important;font-size:clamp(15px,2vw,18px)!important;line-height:1.7!important;font-weight:750!important}.page-banner-icon{background:rgba(251,191,36,.96)!important;color:#134e4a!important;border:0!important;box-shadow:0 18px 34px -24px rgba(0,0,0,.55)!important}.page-banner .feature-kicker,.public-feature-hero .feature-kicker{display:inline-flex!important;align-items:center!important;width:fit-content!important;margin-bottom:18px!important;padding:7px 15px!important;border-radius:999px!important;font-size:11px!important;font-weight:1000!important;letter-spacing:.08em!important;text-transform:uppercase!important;text-shadow:none!important}.page-banner .badge,.page-banner .feature-kicker,.public-feature-hero .badge,.public-feature-hero .feature-kicker{gap:8px!important;background:var(--feature-bg-accent)!important;color:#134e4a!important}.public-feature-hero .badge{display:inline-flex!important;align-items:center!important;width:fit-content!important;margin-bottom:18px!important;padding:7px 15px!important;border-radius:999px!important;font-size:11px!important;font-weight:1000!important;letter-spacing:.08em!important;text-transform:uppercase!important;text-shadow:none!important}.home-page .home-hero{background-image:linear-gradient(90deg,rgba(4,82,100,.92) 0%,rgba(4,82,100,.8) 44%,rgba(4,82,100,.54) 100%),var(--feature-bg-image)!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}.home-page .home-hero .blob,.home-page .home-hero .dotgrid,.home-page .home-hero .hero-bg{opacity:.2!important}.home-page .hero-text h1,.home-page .hero-text p{color:#fff!important;text-shadow:0 3px 18px rgba(0,0,0,.28)!important}.home-page .hero-badge{background:var(--feature-bg-accent)!important;color:#134e4a!important;border:0!important;text-shadow:none!important}.home-body,.page-content,.page-wrap{position:relative!important}.home-body::before,.page-content::before,.page-wrap::before{content:""!important;position:fixed!important;inset:0!important;z-index:-2!important;pointer-events:none!important;background:radial-gradient(circle at 12% 18%,rgba(47,116,221,.08),transparent 26%),radial-gradient(circle at 88% 12%,rgba(251,191,36,.08),transparent 24%),linear-gradient(180deg,#f8fbff 0,#eef6f8 100%)!important}@media (max-width:768px){.agenda-page .page-header,.berita-page .page-header,.faq-page .page-header,.galeri-page .page-header,.kontak-page .page-header,.lapor-page .page-header,.layanan-page .page-header,.lembaga-page .page-header,.page-banner,.pengumuman-page .page-header,.peta-page .page-header,.profil-page .page-header,.public-feature-hero,.service-page .page-header,.struktur-page .page-header,.unit-kerja-page .page-header{min-height:320px!important;background-position:center!important}.page-banner-inner{width:min(100% - 28px,1200px)!important;padding:52px 0!important}}:root{--kelurahan-overlay:rgba(3, 78, 96, 0.88);--kelurahan-overlay-soft:rgba(3, 78, 96, 0.58);--kelurahan-bg:url('/assets/images/Background.png');--kelurahan-yellow:#fbbf24;--kelurahan-navy:#082f49;--kb-navy:#082f49;--kb-dark:#0b3b63;--kb-blue:#2563eb;--kb-sky:#2f74dd;--kb-soft:#e0f2fe;--kb-bg:#eef8fb;--kb-line:rgba(8, 47, 73, 0.16);--kb-yellow:#fbbf24;--kb-card:rgba(255, 255, 255, 0.96)}body #app .home-page .home-hero,body main .home-page .home-hero{position:relative!important;color:#fff!important;background-image:linear-gradient(90deg,rgba(3,78,96,.94) 0%,rgba(3,78,96,.82) 48%,rgba(3,78,96,.48) 100%),var(--kelurahan-bg)!important;background-size:cover!important;background-position:center center!important;background-repeat:no-repeat!important;background-color:#034e60!important}body .home-page .hero-inner{position:relative!important;z-index:2!important}body .home-page .hero-badge{color:#134e4a!important;box-shadow:none!important}body .home-page .hero-actions .btn-light,body .home-page .hero-actions .btn-primary,body .home-page .hero-actions .btn-solid{background:var(--kelurahan-yellow)!important;color:#134e4a!important;border-color:transparent!important}body .home-page .hero-actions .btn-ghost,body .home-page .hero-actions .btn-outline{color:#fff!important;border:2px solid rgba(255,255,255,.82)!important;background:rgba(255,255,255,.08)!important;backdrop-filter:blur(10px)!important}body .home-page .stat-card{background:rgba(255,255,255,.14)!important;color:#fff!important;border:1px solid rgba(255,255,255,.24)!important;backdrop-filter:blur(14px) saturate(160%)!important}body .home-page .stat-icon{background:var(--kelurahan-yellow)!important;color:#134e4a!important}body .home-page{isolation:isolate!important}body .home-page,body .home-page .home-body{position:relative!important}body .home-page .home-body::before{content:""!important;position:absolute!important;inset:0 50%auto 50%!important;width:100vw!important;height:100%!important;transform:translateX(-50%)!important;z-index:-2!important;pointer-events:none!important;background-image:linear-gradient(180deg,rgba(239,248,250,.94) 0%,rgba(248,252,253,.97) 100%),var(--kelurahan-bg)!important;background-size:cover!important;background-position:center top!important;background-repeat:no-repeat!important}body .agenda-page .page-header,body .berita-page .page-header,body .faq-page .page-header,body .galeri-page .page-header,body .kontak-page .page-header,body .lapor-page .page-header,body .layanan-page .page-header,body .lembaga-page .page-header,body .page-banner,body .pengumuman-page .page-header,body .peta-page .page-header,body .profil-page .page-header,body .public-feature-hero,body .service-page .page-header,body .struktur-page .page-header,body .unit-kerja-page .page-header{min-height:clamp(300px,44vh,480px)!important;display:flex!important;align-items:center!important}body .agenda-page .page-header::before,body .berita-page .page-header::before,body .faq-page .page-header::before,body .galeri-page .page-header::before,body .kontak-page .page-header::before,body .lapor-page .page-header::before,body .layanan-page .page-header::before,body .lembaga-page .page-header::before,body .pengumuman-page .page-header::before,body .peta-page .page-header::before,body .profil-page .page-header::before,body .service-page .page-header::before,body .struktur-page .page-header::before,body .unit-kerja-page .page-header::before{content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;pointer-events:none!important;opacity:.2!important;background-image:radial-gradient(rgba(255,255,255,.9) 1px,transparent 1px)!important;background-size:18px 18px!important;mask-image:linear-gradient(90deg,#000 0,transparent 72%)!important}body .home-page .home-stats small,body .home-page .home-stats strong,body .public-feature-hero h1,body .public-feature-hero p{color:#fff!important;text-shadow:0 3px 18px rgba(0,0,0,.35)!important}body .page-banner h1,body .page-header h1,body .public-feature-hero h1{font-size:clamp(30px,5vw,58px)!important;line-height:1.06!important;font-weight:1000!important;letter-spacing:-.045em!important}@media (max-width:768px){body .home-page .home-hero{min-height:520px!important;background-position:center!important}body .page-banner,body .page-header,body .public-feature-hero{min-height:320px!important}body .home-page .home-body::before,body .home-page::before{background-attachment:scroll!important}}body .agenda-page .page-header,body .berita-page .page-header,body .faq-page .page-header,body .galeri-page .page-header,body .home-page .home-hero,body .kontak-page .page-header,body .lapor-page .page-header,body .layanan-page .page-header,body .lembaga-page .page-header,body .page-banner,body .pengumuman-page .page-header,body .peta-page .page-header,body .profil-page .page-header,body .public-feature-hero,body .service-page .page-header,body .struktur-page .page-header,body .unit-kerja-page .page-header{position:relative!important;isolation:isolate!important;overflow:hidden!important;color:#fff!important;background-image:linear-gradient(90deg,rgba(3,78,96,.92) 0%,rgba(3,78,96,.78) 48%,rgba(3,78,96,.48) 100%),var(--kelurahan-bg)!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;background-color:#034e60!important}body .home-page .home-hero::before,body .page-banner::before,body .page-header::before,body .public-feature-hero::before{content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;pointer-events:none!important;opacity:.18!important;background-image:radial-gradient(rgba(255,255,255,.9) 1px,transparent 1px)!important;background-size:18px 18px!important;mask-image:linear-gradient(90deg,#000 0,transparent 72%)!important}body .home-page .hero-text h1,body .home-page .hero-text p,body .page-banner .muted,body .page-banner h1,body .page-banner h2,body .page-banner p,body .page-header .muted,body .page-header h1,body .page-header p{color:#fff!important;text-shadow:0 3px 18px rgba(0,0,0,.35)!important}body .home-page .hero-badge{background:var(--kelurahan-yellow)!important;color:var(--kelurahan-navy)!important;border:0!important;text-shadow:none!important}body .home-page::before{content:""!important;position:fixed!important;inset:0!important;z-index:-10!important;pointer-events:none!important;background-image:linear-gradient(180deg,rgba(248,252,253,.92),rgba(239,248,250,.92)),var(--kelurahan-bg)!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}@media (max-width:768px){body .home-page .home-hero{min-height:520px!important;background-position:center!important}}#header .brand-name,#header .brand-title,#header .logo-text strong,#header .navbar-brand strong,#header h1,#header h2{margin-bottom:0!important;line-height:1.1!important}#header .logo img,#header img{flex-shrink:0!important}.kb-page-hero{background:radial-gradient(circle at 88% 12%,rgba(47,116,221,.13),transparent 26%),linear-gradient(180deg,#f2fbfd 0,#eaf6f8 100%)!important;border-top:1px solid rgba(8,47,73,.08);border-bottom:1px solid var(--kb-line)}.kb-hero-inner{padding:clamp(40px,6vw,74px) 24px!important}.kb-breadcrumb{color:#475569}.kb-page-hero h1{margin:0;color:#06172a;font-size:clamp(34px,5vw,54px);line-height:1.05;font-weight:1000;letter-spacing:-.055em}.kb-page-hero p{max-width:720px;margin:14px 0 0;color:#334155;font-size:clamp(15px,2vw,18px);line-height:1.7;font-weight:650}.kb-page-content{padding-top:clamp(48px,6vw,78px)!important;padding-bottom:clamp(64px,8vw,96px)!important}.kontak-modern-page{background:var(--kb-bg)}.kb-contact-info-stack{display:grid;gap:18px}.berita-side-card,.kb-faq-list details,.kb-info-card{background:var(--kb-card)!important;border:1px solid rgba(8,47,73,.16)!important}.kb-info-card{min-height:136px;display:grid;grid-template-columns:58px minmax(0,1fr);gap:18px;align-items:flex-start}.kb-info-icon{font-size:19px}.kb-info-icon-blue{background:linear-gradient(135deg,#16458f,#2f74dd)}.kb-info-icon-yellow{background:linear-gradient(135deg,#f59e0b,#fbbf24);color:#082f49}.kb-info-icon-cyan{background:linear-gradient(135deg,#9fc6f3,#2f74dd);color:#082f49}.kb-info-card h3{margin:0 0 8px;color:#06172a;font-size:20px;line-height:1.2;letter-spacing:-.02em}.kb-info-card p,.kb-info-card small{display:block;margin:0;color:#334155;font-size:14px;line-height:1.65;font-weight:600}.kb-map-card{min-height:520px;display:flex;flex-direction:column;padding:18px;border-radius:20px;overflow:hidden;background:linear-gradient(135deg,#082f49,#0b3b63)!important;border:1px solid rgba(8,47,73,.26);box-shadow:0 22px 54px -36px rgba(8,47,73,.62)}.kb-map-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;color:rgba(255,255,255,.84);font-size:12px;font-weight:850}.kb-map-visual{position:relative;flex:1;min-height:340px;border-radius:16px;overflow:hidden;background:linear-gradient(135deg,rgba(47,116,221,.22),rgba(251,191,36,.1)),linear-gradient(45deg,#9cc7b3 25%,#6fa7b9 25%,#6fa7b9 50%,#9cc7b3 50%,#9cc7b3 75%,#6fa7b9 75%);background-size:cover,46px 46px;border:1px solid rgba(255,255,255,.16)}.kb-map-grid{position:absolute;inset:0;opacity:.7;background-image:linear-gradient(rgba(255,255,255,.55) 2px,transparent 2px),linear-gradient(90deg,rgba(255,255,255,.55) 2px,transparent 2px),linear-gradient(30deg,transparent 46%,rgba(255,255,255,.72) 47%,rgba(255,255,255,.72) 49%,transparent 50%);background-size:32px 32px,32px 32px,130px 130px}.kb-map-pin{position:absolute;left:52%;top:48%;transform:translate(-50%,-50%);color:#2f74dd;font-size:50px;filter:drop-shadow(0 10px 10px rgba(0,0,0,.32))}.kb-map-footer{margin-top:14px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.94)}.kb-map-footer span,.kb-map-footer strong{display:block}.kb-map-footer strong{color:#06172a;font-size:13px}.kb-map-footer span{color:#475569;font-size:12px;margin-top:2px}.kb-map-btn{color:#fff!important}.berita-calendar-btn,.kb-map-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:10px;padding:10px 14px;background:linear-gradient(135deg,var(--kb-navy),var(--kb-dark));text-decoration:none;font-size:13px;font-weight:900;white-space:nowrap}.kb-contact-bottom{margin-top:68px;display:grid;grid-template-columns:minmax(360px,1fr) minmax(280px,.72fr);gap:72px;align-items:start}.kb-faq-section h2,.kb-message-section h2{display:flex;align-items:center;gap:10px;margin:0 0 28px;color:#06172a;font-size:clamp(26px,3vw,34px);line-height:1.1;font-weight:1000;letter-spacing:-.04em}.kb-faq-section h2 span,.kb-message-section h2 span{width:6px;height:28px;border-radius:999px;background:var(--kb-yellow)}.kb-contact-form{display:grid;gap:18px}.kb-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 22px}.kb-contact-form label{display:grid;gap:8px;color:#334155;font-size:13px;font-weight:800}.kb-contact-form .input{min-height:48px;border-radius:10px!important;background:#fff!important;border:1px solid rgba(8,47,73,.2)!important}.kb-submit-btn{min-width:180px}.berita-newsletter button,.kb-submit-btn{width:fit-content;min-height:50px;border:0;border-radius:10px;color:#082f49;background:linear-gradient(135deg,#fbbf24,#f59e0b);font-weight:900;cursor:pointer}.kb-faq-list{display:grid;gap:16px}.kb-faq-list details{padding:0;overflow:hidden}.kb-faq-list summary{list-style:none;cursor:pointer;padding:20px 22px;color:#06172a;font-size:20px;line-height:1.28;font-weight:850}.kb-faq-list summary::-webkit-details-marker{display:none}.kb-faq-list p{margin:0;padding:0 22px 22px;color:#475569;font-size:14px;line-height:1.7}.kb-help-card{margin-top:34px;padding:28px;border-radius:16px;color:#fff;background:linear-gradient(135deg,#163f8a,#0b3b63)}.kb-help-card h3{margin:0 0 12px;font-size:21px}.kb-help-card p{color:rgba(255,255,255,.86);line-height:1.65}.kb-help-card strong{display:inline-flex;gap:8px;align-items:center;color:#fff}#header .alamat,#header .brand small,#header .brand-address,#header .brand-subtitle,#header .header-address,#header .logo-subtitle,#header .navbar-brand small,#header .site-address,#header [class*=address],#header [class*=subtitle],#header [class*=tagline],#header small,.kb-hidden-dynamic{display:none!important}.berita-modern-page{background:var(--kb-bg)}.berita-side-card h3{color:#06172a}.berita-alert-list,.berita-mini-agenda{display:grid;gap:12px}.berita-category-pills{display:grid}.berita-alert-red{background:rgba(239,68,68,.07);border-left-color:#ef4444}.berita-alert-blue{background:rgba(47,116,221,.1);border-left-color:#2f74dd}.berita-alert span{display:block;margin-bottom:8px;color:#b91c1c;font-size:10px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase}.berita-alert strong{display:block;color:#06172a;font-size:14px;margin-bottom:6px}.berita-alert p{margin:0;color:#475569;font-size:12px;line-height:1.55}.berita-mini-agenda article,.rds-mini-agenda article{display:grid;grid-template-columns:54px minmax(0,1fr);gap:12px;align-items:center}.berita-mini-agenda time{width:54px;height:58px;display:grid;place-items:center;border-radius:12px;color:#082f49;background:#e0f2fe;border:1px solid rgba(47,116,221,.18)}.berita-mini-agenda time b{display:block;font-size:18px;line-height:1}.berita-mini-agenda time span,.rds-mini-agenda time span{display:block;font-size:10px;text-transform:uppercase;font-weight:900}.berita-mini-agenda strong{display:block;color:#06172a;font-size:13px;line-height:1.35}.berita-mini-agenda small{display:block;margin-top:5px;color:#64748b;font-size:11px}.berita-calendar-btn{width:100%;margin-top:16px;background:0 0;color:#082f49!important;border:1px solid rgba(8,47,73,.25)}.berita-category-pills .tab.active{background:#2f74dd!important}.berita-modern-grid .berita-card:first-child,.berita-modern-grid .news-card:first-child{grid-column:1/-1}.berita-newsletter-inner{display:flex;align-items:center;justify-content:space-between;gap:28px}.berita-newsletter h2{margin:0 0 8px;font-size:30px;color:#fff}.berita-newsletter p{margin:0;color:rgba(255,255,255,.78)}.berita-newsletter form{display:flex;gap:10px;min-width:min(420px,100%)}.berita-newsletter input,.rds-newsletter input{flex:1;min-height:48px;border:0;border-radius:10px;padding:0 16px}.berita-newsletter button{min-width:120px}@media (max-width:980px){.berita-modern-layout,.kb-contact-bottom,.kb-contact-layout{grid-template-columns:1fr}.berita-modern-sidebar{position:static}}@media (max-width:720px){.berita-modern-grid.berita-grid,.kb-form-grid{grid-template-columns:1fr!important}.berita-newsletter form,.berita-newsletter-inner,.kb-map-footer{flex-direction:column;align-items:stretch}.berita-newsletter button,.kb-map-btn{width:100%}}:root{--ip-navy:#082f49;--ip-dark:#0b3b63;--ip-blue:#2563eb;--ip-sky:#2f74dd;--ip-soft:#eef8fb;--ip-card:rgba(255, 255, 255, 0.96);--ip-text:#06172a;--ip-muted:#475569;--ip-line:rgba(8, 47, 73, 0.16);--ip-yellow:#fbbf24}.agenda-integrated-page,.berita-integrated-page,.pengumuman-integrated-page{background:radial-gradient(circle at 12% 8%,rgba(47,116,221,.08),transparent 28%),radial-gradient(circle at 88% 14%,rgba(251,191,36,.08),transparent 24%),var(--ip-soft)!important;color:var(--ip-text)}.rds-simple-hero{background:radial-gradient(circle at 82% 12%,rgba(47,116,221,.14),transparent 25%),linear-gradient(180deg,#f3fbfd 0,#e9f6f8 100%)!important;border-top:1px solid rgba(8,47,73,.08);border-bottom:1px solid var(--ip-line)}.rds-simple-hero-inner{padding:clamp(44px,7vw,82px) 24px!important}.rds-breadcrumb-dark{display:inline-flex;align-items:center;gap:8px;margin-bottom:18px;color:#475569;font-size:12px;font-weight:800}.rds-breadcrumb-dark a{color:var(--ip-dark);text-decoration:none}.rds-hero-row{display:flex;align-items:flex-end;justify-content:space-between;gap:28px}.rds-kicker-dark{display:inline-flex;width:fit-content;margin-bottom:14px;padding:7px 13px;border-radius:999px;color:#fff;background:linear-gradient(135deg,var(--ip-navy),var(--ip-dark));font-size:10px;line-height:1;font-weight:1000;letter-spacing:.12em;text-transform:uppercase}.rds-simple-hero h1{max-width:820px;margin:0;color:var(--ip-text);font-size:clamp(36px,5vw,62px);line-height:1.06;font-weight:1000;letter-spacing:-.055em}.rds-simple-hero p{max-width:760px;margin:16px 0 0;color:#334155;font-size:clamp(15px,2vw,18px);line-height:1.75;font-weight:650}.rds-month-filter,.rds-search-pill{min-width:260px;display:inline-flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;border-radius:16px;background:rgba(255,255,255,.74);border:1px solid var(--ip-line);color:#334155;font-weight:750}.agenda-integrated-content,.berita-integrated-content,.pengumuman-integrated-content{padding-top:clamp(48px,6vw,72px)!important;padding-bottom:clamp(72px,8vw,110px)!important}.berita-integrated-layout,.pengumuman-integrated-layout{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:28px;align-items:start}.agenda-integrated-layout{display:grid;gap:28px;align-items:start}.agenda-integrated-sidebar,.berita-integrated-sidebar,.pengumuman-integrated-sidebar{display:grid;gap:22px;position:sticky;top:96px}.rds-side-card{background:var(--ip-card)!important}.berita-integrated-grid.berita-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:24px!important}.berita-integrated-grid>:first-child{grid-column:1/-1!important}.berita-integrated-page .berita-card,.berita-integrated-page .news-card,.pengumuman-integrated-page .announcement-card{background:#fff!important;border:1px solid var(--ip-line)!important;border-radius:18px!important;box-shadow:0 18px 42px -34px rgba(8,47,73,.45)!important;overflow:hidden!important}.agenda-integrated-page .agenda-card,.agenda-integrated-page .agenda-card-full{box-shadow:0 18px 42px -34px rgba(8,47,73,.45)!important;overflow:hidden!important}.rds-alert-item{border-left:4px solid var(--ip-sky)}.rds-alert-item strong,.rds-mini-agenda strong{color:var(--ip-text)}.rds-alert-item p{color:var(--ip-muted)}.rds-mini-agenda time{width:54px;height:58px;display:grid;place-items:center;border-radius:12px;color:#082f49;border:1px solid rgba(47,116,221,.18)}.rds-outline-btn,.rds-solid-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;margin-top:16px;border-radius:10px;text-decoration:none;font-size:13px;font-weight:900}.rds-outline-btn{color:var(--ip-navy)!important;background:0 0;border:1px solid rgba(8,47,73,.25)}.rds-solid-btn{color:#fff!important;background:linear-gradient(135deg,var(--ip-navy),var(--ip-dark))}.rds-category-list span{border:0!important;border-radius:999px!important;background:#e8f3f6!important;color:#334155!important;padding:8px 12px!important;font-size:12px!important;font-weight:850!important}.berita-category-pills .tab.active{background:linear-gradient(135deg,var(--ip-sky),var(--ip-blue))!important}.rds-category-list{display:flex;flex-wrap:wrap}.rds-newsletter-inner{display:flex;align-items:center;justify-content:space-between;gap:28px}.rds-newsletter h2{margin:0 0 8px;color:#fff;font-size:30px}.rds-newsletter p{margin:0;color:rgba(255,255,255,.78)}.rds-newsletter form{display:flex;gap:10px;min-width:min(420px,100%)}.rds-newsletter button{min-width:120px;min-height:48px;border:0;border-radius:10px;background:var(--ip-yellow);color:var(--ip-navy);font-weight:950}.pengumuman-modern-filters{margin-bottom:24px!important;background:rgba(255,255,255,.78)!important;border-radius:18px!important}.pengumuman-integrated-list{display:grid!important;gap:18px!important}.rds-stat-card{background:linear-gradient(135deg,#163f8a,#0b3b63)!important;color:#fff!important}.rds-stat-card small,.rds-stat-card span{color:rgba(255,255,255,.78);text-transform:uppercase;letter-spacing:.08em;font-weight:850}.rds-stat-card strong{display:block;margin:10px 0 2px;color:#fff;font-size:46px;line-height:1;font-weight:1000}.rds-stat-card hr{border:0;border-top:1px solid rgba(255,255,255,.16);margin:22px 0}.rds-stat-card div b{display:block;color:#fff;font-size:28px}.agenda-integrated-layout{grid-template-columns:minmax(0,1fr) 340px}.agenda-integrated-list{display:grid!important;gap:22px!important}.agenda-integrated-page .agenda-card,.agenda-integrated-page .agenda-card-full,.agenda-integrated-page .agenda-row{border-radius:18px!important;background:#fff!important;border:1px solid var(--ip-line)!important}.rds-calendar-card{padding:0!important;overflow:hidden}.rds-calendar-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:22px;color:#fff;background:linear-gradient(135deg,#38bdf8 0%,#2563eb 100%)}.rds-calendar-head h3{margin:0;color:#fff;font-size:22px}.rds-calendar-head button{width:32px;height:32px;border:0;background:0 0;color:#fff;cursor:pointer}.rds-calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:18px;text-align:center}.rds-calendar-grid button,.rds-calendar-grid span{min-height:32px;display:grid;place-items:center;border:0;border-radius:9px;background:0 0;color:#334155;font-weight:750}.rds-calendar-grid button.has-event,.rds-mini-agenda time{background:#e0f2fe;color:var(--ip-navy)}.rds-calendar-grid button.is-today{background:var(--ip-yellow);color:var(--ip-navy)}.rds-cta-card{background:rgba(255,255,255,.7)!important}.rds-cta-card p{color:var(--ip-muted);line-height:1.65}@media (max-width:980px){.rds-hero-row,.rds-newsletter form,.rds-newsletter-inner{flex-direction:column;align-items:stretch}.agenda-integrated-layout,.berita-integrated-layout,.pengumuman-integrated-layout{grid-template-columns:1fr}.agenda-integrated-sidebar,.berita-integrated-sidebar,.pengumuman-integrated-sidebar{position:static}.rds-month-filter,.rds-search-pill{min-width:0;width:100%}}@media (max-width:720px){.berita-integrated-grid.berita-grid{grid-template-columns:1fr!important}.rds-simple-hero h1{font-size:36px}}:root{--rds-navy:#082f49;--rds-dark:#0b3b63;--rds-blue:#2563eb;--rds-sky:#2f74dd;--rds-cyan:#9fc6f3;--rds-soft:#eef8fb;--rds-line:rgba(8, 47, 73, 0.16);--rds-card:rgba(255, 255, 255, 0.96);--rds-muted:#475569;--rds-text:#06172a;--rds-yellow:#fbbf24;--rds-bg-image:url('/assets/images/Background.png')}#header .brand,#header .brand-wrap,#header .logo-wrap,#header .navbar-brand{align-items:center!important}.agenda-page,.berita-page,.galeri-page,.kontak-page,.layanan-page,.lembaga-page,.pengumuman-page,.peta-page,.profil-page,.redesign-page,.service-page,.struktur-page,.unit-kerja-page{background:radial-gradient(circle at 12% 8%,rgba(47,116,221,.08),transparent 28%),radial-gradient(circle at 88% 12%,rgba(251,191,36,.08),transparent 24%),var(--rds-soft)!important;color:var(--rds-text)!important}.agenda-page .page-banner,.berita-page .page-banner,.galeri-page .page-banner,.kontak-page .page-banner,.layanan-page .page-banner,.lembaga-page .page-banner,.page-banner,.pengumuman-page .page-banner,.peta-page .page-banner,.profil-page .page-banner,.rds-hero,.service-page .page-header,.struktur-page .page-banner,.unit-kerja-page .page-banner{position:relative!important;overflow:hidden!important;isolation:isolate!important;min-height:clamp(280px,38vh,430px)!important;display:flex!important;align-items:center!important;background:linear-gradient(90deg,rgba(8,47,73,.92) 0%,rgba(11,59,99,.76) 52%,rgba(47,116,221,.42) 100%),var(--rds-bg-image)!important;background-size:cover!important;background-position:center!important;color:#fff!important;border-bottom:1px solid rgba(8,47,73,.14)!important}.page-banner::before,.rds-hero::before,.service-page .page-header::before{content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;pointer-events:none!important;opacity:.2!important;background-image:radial-gradient(rgba(255,255,255,.9) 1px,transparent 1px)!important;background-size:18px 18px!important;mask-image:linear-gradient(90deg,#000 0,transparent 72%)!important}.page-banner-inner,.rds-hero-inner,.service-page .page-header>*{position:relative!important;z-index:1!important;width:min(1180px,calc(100% - 48px))!important;margin-inline:auto!important;padding:clamp(52px,7vw,92px)0!important}.page-banner .muted,.page-banner h1,.page-banner p,.rds-hero h1,.rds-hero p,.service-page .page-header .muted,.service-page .page-header h1,.service-page .page-header p{color:#fff!important;text-shadow:0 3px 18px rgba(0,0,0,.32)!important}.page-banner h1,.rds-hero h1,.service-page .page-header h1{max-width:820px!important;margin:0!important;font-size:clamp(34px,5vw,58px)!important;line-height:1.04!important;font-weight:1000!important;letter-spacing:-.055em!important}.page-banner p,.rds-hero p,.service-page .page-header p{max-width:720px!important;margin-top:14px!important;font-size:clamp(15px,2vw,18px)!important;line-height:1.7!important;font-weight:700!important}.page-banner .badge,.rds-kicker,.service-page .page-header .badge{display:inline-flex!important;align-items:center!important;width:fit-content!important;margin-bottom:16px!important;padding:7px 14px!important;border-radius:999px!important;background:var(--rds-yellow)!important;color:var(--rds-navy)!important;font-size:10px!important;line-height:1!important;font-weight:1000!important;letter-spacing:.08em!important;text-transform:uppercase!important;text-shadow:none!important}.kb-breadcrumb,.rds-breadcrumb{display:inline-flex!important;align-items:center!important;gap:8px!important;margin-bottom:16px!important;color:rgba(255,255,255,.84)!important;font-size:12px!important;font-weight:850!important}.kb-breadcrumb a,.rds-breadcrumb a{color:#fff!important;text-decoration:none!important}.page-content,.page-wrap,.rds-content{width:min(1180px,calc(100% - 48px))!important;margin-inline:auto!important;padding-top:clamp(48px,6vw,74px)!important;padding-bottom:clamp(64px,8vw,100px)!important}.rds-layout,.rds-two-col{grid-template-columns:minmax(0,1fr) 340px!important}.berita-modern-layout,.kb-contact-layout,.rds-layout,.rds-two-col{display:grid!important;gap:28px!important;align-items:start!important}.kb-contact-layout{grid-template-columns:minmax(0,1fr) 340px!important}.berita-modern-sidebar,.rds-sidebar{display:grid!important;gap:22px!important;position:sticky!important;top:96px!important}.agenda-card,.agenda-card-full,.announcement-card,.berita-card,.berita-side-card,.gallery-card,.info-card,.kb-faq-list details,.kb-info-card,.kontak-box,.kontak-card,.layanan-card,.news-card,.rds-card,.rds-side-card,.service-card{background:var(--rds-card)!important;border:1px solid var(--rds-line)!important;border-radius:18px!important;box-shadow:0 18px 42px -34px rgba(8,47,73,.45)!important}.berita-side-card,.rds-side-card{padding:24px!important}.berita-side-card h3,.rds-side-card h3{margin:0 0 18px!important;color:var(--rds-text)!important;font-size:22px!important;line-height:1.15!important;font-weight:950!important;letter-spacing:-.03em!important}.berita-page .berita-toolbar{display:none!important}.berita-modern-layout,.berita-page .rds-layout{grid-template-columns:minmax(0,1fr) 350px!important}.berita-modern-grid.berita-grid,.berita-page .berita-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:24px!important}.berita-page .berita-grid>:first-child{grid-column:1/-1!important}.berita-card,.news-card{overflow:hidden!important;transition:transform .2s ease,box-shadow .2s ease!important}.agenda-card-full:hover,.announcement-card:hover,.berita-card:hover,.gallery-card:hover,.news-card:hover,.service-card:hover{transform:translateY(-3px)!important;box-shadow:0 26px 56px -34px rgba(8,47,73,.56)!important}.berita-category-pills,.filter-tabs{display:flex!important;flex-wrap:wrap!important;gap:10px!important}.berita-category-pills .tab,.filter-btn,.filter-tabs .tab{border:0!important;border-radius:999px!important;background:#e8f3f6!important;color:#334155!important;padding:8px 12px!important;font-size:12px!important;font-weight:850!important}.berita-category-pills .tab.active,.filter-btn.active,.filter-tabs .tab.active{background:linear-gradient(135deg,var(--rds-sky),var(--rds-blue))!important;color:#fff!important}.berita-modern-search,.peng-filter-field,.search-box{border-radius:12px!important;background:#f2fbfd!important;border:1px solid rgba(8,47,73,.14)!important;box-shadow:none!important}.berita-alert,.rds-alert{padding:16px!important;border-radius:12px!important;border-left:4px solid var(--rds-sky)!important;background:rgba(47,116,221,.09)!important}.berita-newsletter,.rds-newsletter{background:linear-gradient(135deg,#163f8a,#0b3b63)!important;color:#fff!important;padding:58px 0!important}.agenda-page .agenda-card,.agenda-page .agenda-card-full,.agenda-page .agenda-row{border-radius:18px!important}.agenda-page .agenda-row,.home-page .home-agenda-card .agenda-row{background:#fff!important;border:1px solid var(--rds-line)!important;color:var(--rds-text)!important}.acf-date-box,.agenda-date,.agenda-date-box{background:linear-gradient(135deg,#e0f2fe,#bae6fd)!important;color:var(--rds-navy)!important;border:1px solid rgba(47,116,221,.18)!important;box-shadow:none!important}.adb-day,.adb-mon,.agenda-date-box *{color:var(--rds-navy)!important}.kontak-page .kontak-grid,.rds-contact-cards{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:18px!important}.kb-info-card,.kontak-card{padding:24px!important}.kb-info-icon,.kontak-card .icon{width:54px!important;height:54px!important;border-radius:999px!important;display:grid!important;place-items:center!important;color:#fff!important}.kb-info-card h3,.kontak-box h3,.kontak-card h4{color:var(--rds-text)!important;font-weight:950!important}.kontak-row{display:grid!important;grid-template-columns:1fr 1fr!important}.galeri-grid,.gallery-grid,.kontak-row,.layanan-grid,.service-grid{gap:24px!important}.info-grid,.profil-grid,.profil-page .profil-grid{gap:28px!important}.berita-card img,.gallery-card img,.map-container,.map-embed-wrap,.news-card img,.peta-map-card,.profil-photo{border-radius:16px!important;overflow:hidden!important}#footer,.footer,.site-footer{background:linear-gradient(135deg,#082f49,#0c2348)!important;color:#fff!important}#footer a,#footer p,#footer small,.footer a,.footer p,.footer small,.site-footer a,.site-footer p,.site-footer small{color:rgba(255,255,255,.82)!important}@media (max-width:980px){.berita-modern-layout,.berita-page .rds-layout,.kb-contact-layout,.kontak-row,.rds-layout,.rds-two-col{grid-template-columns:1fr!important}.berita-modern-sidebar,.rds-sidebar{position:static!important}}@media (max-width:720px){.page-banner-inner,.page-content,.page-wrap,.rds-content,.rds-hero-inner{width:min(100% - 28px,1180px)!important}.berita-modern-grid.berita-grid,.berita-page .berita-grid,.kontak-page .kontak-grid,.rds-contact-cards{grid-template-columns:1fr!important}.page-banner h1,.rds-hero h1,.service-page .page-header h1{font-size:34px!important}}.rds-sidebar-loading{color:#64748b;font-size:13px;font-weight:750;padding:10px 0}.rds-alert-list,.rds-category-list,.rds-mini-agenda{display:grid;gap:12px}.rds-alert-item{padding:15px;border-radius:12px;border-left:4px solid #2f74dd;background:rgba(47,116,221,.09)}.rds-alert-item.is-important{border-left-color:#ef4444;background:rgba(239,68,68,.07)}.rds-alert-item span{display:block;margin-bottom:7px;color:#b91c1c;font-size:10px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase}.rds-alert-item strong{margin-bottom:5px}.rds-alert-item p{margin:0;color:#475569;font-size:12px;line-height:1.55}.rds-mini-agenda time b{display:block;font-size:18px;line-height:1}.rds-alert-item strong,.rds-mini-agenda small,.rds-mini-agenda strong{display:block;color:#06172a;font-size:13px;line-height:1.35}.rds-mini-agenda small{margin-top:5px;color:#64748b;font-size:11px}.auth-page{display:grid;place-items:center;padding:28px 0 40px}.auth-card,.auth-card input{border:1px solid var(--border)}.auth-card{width:min(520px,calc(100% - 48px));background:var(--surface);padding:22px}.auth-card h1,.auth-card h2{font-size:22px;font-weight:950}.auth-card label{font-weight:900;display:block;margin:12px 0 6px}.auth-card input{width:100%;padding:0 14px;outline:0}.btn-auth{margin-top:14px;width:100%}.auth-card .btn-auth,.auth-card:hover,.metric:hover{box-shadow:var(--shadow)}.admin-side a{transition:background .15s ease,color .15s ease,transform .1s ease}.admin-side a:hover{transform:translateX(2px)}.auth-card .btn-auth{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;margin-top:16px;padding:12px 16px;font-weight:800;border:1px solid transparent;cursor:pointer;background:var(--primary);color:#fff;transition:background .18s ease,box-shadow .18s ease,transform .12s ease}.auth-card .btn-auth:hover{background:var(--primary-700);box-shadow:var(--shadow-lg);transform:translateY(-1px)}.auth-card .btn-auth:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.auth-page .auth-blue-side,.auth-page .auth-blue-side :not(.auth-blue-kicker):not(.auth-blue-logo):not(.auth-blue-logo *){color:#fff!important;text-shadow:0 3px 16px rgba(0,0,0,.34)!important}.auth-page .auth-blue-side .auth-blue-title,.auth-page .auth-blue-side h1,.auth-page .auth-blue-side h2,.auth-page .auth-blue-side h3{color:#fff!important;opacity:1!important;text-shadow:0 4px 20px rgba(0,0,0,.38)!important}.auth-page .auth-blue-address,.auth-page .auth-blue-name,.auth-page .auth-blue-side .auth-blue-desc,.auth-page .auth-blue-side p,.auth-page .auth-blue-side small,.auth-page .auth-blue-side span,.auth-page .auth-blue-side strong,.auth-page .auth-card .auth-blue-side .auth-subtitle,.auth-page .auth-card .auth-blue-side .muted,.auth-page .auth-card .auth-blue-side [class*=desc],.auth-page .auth-card .auth-blue-side [class*=text],.auth-page .auth-card .auth-blue-side [class*=title]{color:#fff!important;opacity:1!important}.auth-page .auth-blue-sec-item small,.auth-page .auth-blue-sec-item span,.auth-page .auth-blue-sec-item strong,.auth-page .auth-blue-side .auth-brand-address,.auth-page .auth-blue-side .auth-brand-desc,.auth-page .auth-blue-side .auth-brand-name,.side-head h3{color:#fff!important}.auth-page .auth-blue-kicker{color:#082f49!important;text-shadow:none!important;background:linear-gradient(135deg,#bae6fd,#5e9bea)!important}body.is-admin{background-color:#edf2fb;background-image:radial-gradient(circle,rgba(29,86,201,.1) 1px,transparent 1px);background-size:28px 28px;background-attachment:fixed}.admin-shell{max-width:1200px;width:100%;margin:24px auto 48px;padding:0 24px 48px;display:grid;grid-template-columns:268px minmax(0,1fr);column-gap:20px;align-items:flex-start}.admin-main,.admin-side,.admin-side .side-menu{display:flex;flex-direction:column}.admin-side{background:#0d1526!important;border-radius:20px!important;box-shadow:0 8px 32px rgba(6,13,31,.4)!important;border:1px solid rgba(255,255,255,.06)!important;overflow:hidden;position:sticky;top:86px;height:calc(100vh - 110px)}.admin-side .side-menu{list-style:none;gap:2px}.admin-main{width:100%;gap:16px}.admin-top{display:flex;align-items:center;justify-content:space-between;gap:14px}#adminMenuBackdrop,.admin-top [data-action=toggleAdminMenu]{display:none}@media (max-width:1023px){.admin-top [data-action=toggleAdminMenu]{display:inline-flex}}.admin-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.laporan-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}.laporan-card{background:#fff!important;border:1px solid rgba(29,86,201,.1)!important;border-radius:18px!important;overflow:hidden;box-shadow:0 2px 12px rgba(29,86,201,.07)!important;transition:transform .2s,box-shadow .2s!important}.laporan-card:hover{transform:translateY(-3px)!important;box-shadow:0 8px 24px rgba(29,86,201,.12)!important}.laporan-card-header{padding:14px 18px;border-bottom:1px solid rgba(29,86,201,.08);background:linear-gradient(90deg,#f0f4ff,#e8f0ff);font-weight:800;color:#0f2f76;font-size:14px}.laporan-table{width:100%;border-collapse:collapse}.laporan-table td,.laporan-table th{padding:12px 14px;border-bottom:1px solid rgba(29,86,201,.06)}.laporan-table th{background:rgba(29,86,201,.04);color:#1e3a8a;font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.05em}.laporan-table td{font-size:13px}.badge{justify-content:center}.btn-sm{padding:7px 12px;font-size:12px;border-radius:10px;font-weight:700}.row-actions{display:flex;align-items:center;flex-wrap:wrap}.modal-panel{width:min(920px,96vw);max-height:92vh;overflow:auto;background:#fff}.word-editor-container{border:1px solid rgba(29,86,201,.15);border-radius:14px;background:#f8fafc;overflow:hidden;margin-top:8px;box-shadow:0 2px 12px rgba(29,86,201,.08)}.word-editor-toolbar{background:linear-gradient(90deg,#f0f4ff,#e8f0ff);border-bottom:1px solid rgba(29,86,201,.12);padding:8px 12px;display:flex;flex-wrap:wrap;align-items:center;gap:6px}.toolbar-btn{width:30px;height:30px;border:1px solid transparent;background:0 0;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;color:#1e3a8a;font-size:13px;transition:all .15s ease}.toolbar-btn.active,.toolbar-btn:hover{background:#dbeafe;color:#1d4ed8;border-color:#bfdbfe}.toolbar-btn.active{border-color:#93c5fd}.menu-group{margin:2px 0}.group-toggle,.group-toggle .left{display:flex;align-items:center;gap:10px}.group-toggle{width:100%;justify-content:space-between;border:0;cursor:pointer;font:inherit}.group-toggle .left{font-weight:900}.group-toggle .chev{transition:transform .18s ease;opacity:.7}.group-items{margin:4px 0 0;list-style:none;overflow:hidden;max-height:0;transition:max-height .22s ease}.menu-group.open .group-items{max-height:560px}.menu-group.open .group-toggle .chev{transform:rotate(180deg)}.group-items .nav-link{padding:7px 10px;border-radius:12px;font-size:13px}@media (max-width:1023px){.admin-shell{grid-template-columns:1fr;padding:0 14px 32px}.admin-side{position:fixed;top:12px;left:12px;bottom:12px;width:min(360px,calc(100vw - 24px));height:auto;transform:translateX(calc(-100% - 24px));transition:transform .22s ease;z-index:100000}body.admin-menu-open .admin-side{transform:translateX(0)}body.admin-menu-open{overflow:hidden}#adminMenuBackdrop{display:block;position:fixed;inset:0;background:rgba(2,6,23,.5);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:99999}body.admin-menu-open #adminMenuBackdrop{opacity:1;pointer-events:auto}.admin-metrics{grid-template-columns:1fr 1fr}.admin-top{flex-wrap:wrap}.admin-top .top-actions{width:100%}.laporan-grid{grid-template-columns:1fr}}@media (max-width:520px){.admin-metrics{grid-template-columns:1fr}}.side-head h3{margin:0!important;font-size:14px!important;font-weight:900!important;font-family:"Plus Jakarta Sans",sans-serif!important;display:flex!important;align-items:center!important;gap:8px!important;position:relative;z-index:1}.side-menu li:last-child a,.side-menu li:nth-last-child(2) a{color:rgba(255,150,150,.7)!important}.side-menu li:last-child a:hover,.side-menu li:nth-last-child(2) a:hover{background:rgba(239,68,68,.15)!important;color:#fca5a5!important}.section-head h2,[class*=-top] h1{font-family:"Plus Jakarta Sans",sans-serif!important}[class*=-top] h1{margin:0!important;font-size:20px!important;font-weight:900!important;color:#0a2a66!important}.section-head h2{color:#0f2f76!important;font-weight:800!important}.table thead tr th{background:linear-gradient(90deg,#f0f4ff,#e8f0ff)!important;color:#1e3a8a!important;font-size:11.5px!important;font-weight:900!important;text-transform:uppercase!important;letter-spacing:.06em!important;padding:12px 14px!important}.table tbody tr{transition:background .18s ease!important}.table tbody tr:hover{background:rgba(29,86,201,.04)!important}.table tbody tr td{padding:13px 14px!important;border-bottom:1px solid rgba(29,86,201,.06)!important;font-size:13.5px!important;font-weight:600!important;color:#1e293b!important}body.is-staf #footer,body.is-staf #header{display:none}body.is-staf{background-color:#edf2fb;background-image:radial-gradient(circle,rgba(29,86,201,.1) 1px,transparent 1px);background-size:28px 28px;background-attachment:fixed}.staf-shell{max-width:var(--container);margin:0 auto;padding:22px 24px 56px;display:grid;grid-template-columns:280px 1fr;gap:18px}.staf-side{background:#0d1526!important;border-radius:20px!important;box-shadow:0 8px 32px rgba(6,13,31,.4)!important;border:1px solid rgba(255,255,255,.06)!important;overflow:hidden;position:sticky;top:18px;height:calc(100vh - 44px)}.staf-main,.staf-side,.staf-side .side-menu{display:flex;flex-direction:column}.staf-side .side-menu{list-style:none;gap:2px}.staf-main{gap:16px}.staf-top{display:flex;align-items:center;justify-content:space-between;gap:14px}#stafMenuBackdrop,.staf-top [data-action=toggleStafMenu]{display:none}@media (max-width:1023px){.staf-top [data-action=toggleStafMenu]{display:inline-flex}}.staf-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.list-row,.list-side{display:flex;align-items:center}.list-row{justify-content:space-between;gap:12px;padding:14px 16px}.list-side{gap:10px}.table,.table-wrap{width:100%}.table{border-collapse:collapse;min-width:820px}.chat-shell{display:grid;grid-template-columns:320px 1fr;gap:14px}.chat-list,.chat-room{background:#fff;border:1px solid rgba(29,86,201,.1);border-radius:18px;box-shadow:0 2px 12px rgba(29,86,201,.08);overflow:hidden}.chat-list-head,.chat-room-head{padding:14px 16px;border-bottom:1px solid rgba(29,86,201,.1);background:linear-gradient(90deg,#f0f4ff,#e8f0ff);font-weight:800;color:#0f2f76}.chat-thread-list{display:flex;flex-direction:column;max-height:calc(100vh - 220px);overflow:auto}.chat-thread{background:0 0;border:0;text-align:left;padding:13px 16px;border-bottom:1px solid rgba(29,86,201,.07);cursor:pointer;transition:background .18s}.chat-thread:hover{background:rgba(29,86,201,.06)}.chat-thread.active{background:rgba(29,86,201,.1);border-left:3px solid #1d56c9}.chat-thread-title{font-weight:900;color:#0f2f76}.chat-thread-sub{font-size:12px;margin-top:2px;color:#64748b}.chat-thread-time{font-size:11px;margin-top:5px;color:#94a3b8}.chat-messages{height:calc(100vh - 300px)}.msg{display:flex;margin-bottom:10px}.bubble{max-width:76%;padding:10px 14px;border-radius:16px;border:1px solid rgba(29,86,201,.1);background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.04)}.bubble .msg-meta{font-size:11px;font-weight:800;color:#94a3b8;margin-bottom:5px}.bubble-me{margin-left:auto}.bubble-system{background:rgba(148,163,184,.1);border-color:rgba(148,163,184,.2)}.chat-input input{flex:1;height:46px;border-radius:14px;border:1.5px solid rgba(29,86,201,.2);padding:0 14px;outline:0;transition:border-color .2s,box-shadow .2s;font-weight:600;background:#f8faff}.sis-step,.sisurat-step-bar{display:flex;align-items:center;gap:0}.sis-step{gap:8px;opacity:.45;transition:opacity .2s}.sis-step.active{opacity:1}.sis-step.done{opacity:.75}.sis-step-num{width:30px;height:30px;border-radius:50%;border:2px solid rgba(29,86,201,.2);display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;transition:background .2s,border-color .2s,color .2s}.sis-step.done .sis-step-num{color:#fff}.sis-step-label{font-size:12px;font-weight:800;color:#64748b}.sis-step.active .sis-step-label{color:#1d56c9}.sis-step-line{width:32px;height:2px;background:rgba(29,86,201,.15);margin:0 6px}.sisurat-jenis-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}.sisurat-jenis-card{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:16px;cursor:pointer;text-align:left;position:relative}.sis-jenis-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}.sis-jenis-nama{font-size:13px;font-weight:900;color:#0f2f76;line-height:1.35;flex:1}.sis-jenis-kode{font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.4px;background:rgba(29,86,201,.08);color:#1d56c9;padding:2px 9px;border-radius:999px}.sis-jenis-chevron{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:#94a3b8;font-size:12px;opacity:0;transition:opacity .18s,right .18s}.sisurat-jenis-card:hover .sis-jenis-chevron{opacity:1;right:12px;color:#1d56c9}.sis-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sis-field-wide{grid-column:span 2}.sis-check-item{display:flex;align-items:flex-start;gap:10px;padding:9px 0;border-bottom:1px dashed rgba(29,86,201,.1);cursor:pointer;font-size:13px;font-weight:700;user-select:none;transition:color .15s}.sis-check-item:last-child{border-bottom:0}.sis-check-item:hover{color:#1d56c9}.sis-check-item input[type=checkbox]{width:18px;height:18px;min-width:18px;border-radius:6px;cursor:pointer;accent-color:#1d56c9}.sisurat-loading{grid-column:1/-1;text-align:center;color:#94a3b8;padding:40px;font-weight:700}.arsip-filter-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}@media (max-width:1023px){.staf-shell{grid-template-columns:1fr;padding:18px 14px 48px}.staf-side{position:fixed;top:12px;left:12px;bottom:12px;width:min(360px,calc(100vw - 24px));height:auto;transform:translateX(calc(-100% - 24px));transition:transform .22s ease;z-index:100000}body.staf-menu-open .staf-side{transform:translateX(0)}body.staf-menu-open{overflow:hidden}#stafMenuBackdrop{display:block;position:fixed;inset:0;background:rgba(2,6,23,.5);opacity:0;pointer-events:none;transition:opacity .18s;z-index:99999}body.staf-menu-open #stafMenuBackdrop{opacity:1;pointer-events:auto}.staf-top{flex-wrap:wrap}.staf-top .top-actions{width:100%}.chat-shell,.staf-metrics{grid-template-columns:1fr}.chat-messages{height:420px}.chat-thread-list{max-height:280px}}@media (max-width:768px){.surat-detail-grid{grid-template-columns:1fr!important;gap:16px!important}}@media (max-width:640px){.sis-form-grid{grid-template-columns:1fr}.sis-field-wide{grid-column:span 1}.sisurat-jenis-grid{grid-template-columns:1fr 1fr}.sis-step-label{display:none}}.metric{border-radius:18px!important;padding:20px!important;border:0!important;position:relative;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease!important;cursor:default}.metric::after,.metric::before{content:"";position:absolute;border-radius:50%;pointer-events:none}.metric::before{top:-30px;right:-30px;width:110px;height:110px;background:rgba(255,255,255,.1)}.metric::after{bottom:-40px;left:-20px;width:90px;height:90px;background:rgba(255,255,255,.06)}.metric:hover{transform:translateY(-5px)!important;box-shadow:0 16px 40px rgba(0,0,0,.2)!important}.metric .label{color:rgba(255,255,255,.8)!important;font-size:12px!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.06em!important;position:relative;z-index:1}.metric .value{font-size:34px!important;font-weight:900!important;color:#fff!important;margin-top:10px!important;line-height:1!important;font-family:"Plus Jakarta Sans",sans-serif!important;position:relative;z-index:1}.metric .metric-icon{position:absolute;top:16px;right:16px;width:48px;height:48px;border-radius:14px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff;z-index:1}.metric .metric-trend{font-size:11px;font-weight:700;color:rgba(255,255,255,.75);margin-top:8px;display:flex;align-items:center;gap:4px;position:relative;z-index:1}.metric:nth-child(1){background:linear-gradient(135deg,#1d56c9 0,#2f6df0 100%);box-shadow:0 8px 24px rgba(29,86,201,.3)}.metric:nth-child(2){background:linear-gradient(135deg,#7c3aed 0,#a855f7 100%);box-shadow:0 8px 24px rgba(124,58,237,.3)}.metric:nth-child(3){background:linear-gradient(135deg,#059669 0,#34d399 100%);box-shadow:0 8px 24px rgba(5,150,105,.3)}.metric:nth-child(4){background:linear-gradient(135deg,#d97706 0,#f59e0b 100%);box-shadow:0 8px 24px rgba(217,119,6,.3)}.metric:nth-child(5){background:linear-gradient(135deg,#1a52ad 0,#2f74dd 100%);box-shadow:0 8px 24px rgba(3,105,161,.3)}.metric:nth-child(6){background:linear-gradient(135deg,#db2777 0,#ec4899 100%);box-shadow:0 8px 24px rgba(219,39,119,.3)}.side-head{background:linear-gradient(135deg,#060d1f 0,#0a2a66 100%)!important;padding:20px 18px 16px!important;border-bottom:1px solid rgba(255,255,255,.08)!important;position:relative;overflow:hidden}.side-head::after{content:"";position:absolute;bottom:-30px;right:-20px;width:100px;height:100px;border-radius:50%;background:rgba(29,86,201,.2);pointer-events:none}.side-head h3 i,.side-menu .nav-link i,.side-menu a i{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.side-head h3 i{background:rgba(255,255,255,.15);font-size:14px}#adminUserLabel,#stafUserLabel,#wargaUserLabel,.side-head .muted{color:rgba(255,255,255,.55)!important;font-size:12px!important;font-weight:600!important;margin-top:8px!important;position:relative;z-index:1;display:block}.side-menu{padding:12px 10px!important;background:#0d1526!important;flex:1;overflow-y:auto!important}.side-menu .nav-link,.side-menu a{display:flex!important;gap:10px!important;align-items:center!important;padding:10px 12px!important;border-radius:12px!important;font-weight:700!important;font-size:13.5px!important;color:rgba(255,255,255,.65)!important;transition:background .2s,color .2s,transform .15s!important;font-family:"Plus Jakarta Sans",sans-serif!important;text-decoration:none!important}.side-menu .nav-link i,.side-menu a i{background:rgba(255,255,255,.06);font-size:13px;transition:background .2s,color .2s}.side-menu .nav-link:hover,.side-menu a:hover{background:rgba(29,86,201,.25)!important;color:#fff!important;transform:translateX(4px)!important}.side-menu .nav-link:hover i,.side-menu a:hover i{background:rgba(29,86,201,.5)!important;color:#93c5fd!important}.side-menu .nav-link.active,.side-menu a.active{background:linear-gradient(90deg,rgba(29,86,201,.6),rgba(29,86,201,.25))!important;color:#fff!important;box-shadow:0 4px 14px rgba(29,86,201,.3)!important}.side-menu .nav-link.active i,.side-menu a.active i{background:#1d56c9!important;color:#fff!important}.side-menu .divider{height:1px!important;background:rgba(255,255,255,.08)!important;margin:8px 4px!important}[class*=-top]{box-shadow:0 2px 16px rgba(29,86,201,.08)!important;padding:16px 20px!important;position:relative;overflow:hidden}[class*=-top]::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#1d56c9,#7c3aed,#2f74dd);border-radius:18px 18px 0 0}[class*=-top] .muted{color:#64748b!important;font-weight:600!important;font-size:13px!important;margin-top:3px!important}.admin-main>.card,.card,.staf-main>.card,.warga-card,[class*=-top]{background:#fff!important;border:1px solid rgba(29,86,201,.1)!important;border-radius:18px!important}.admin-main>.card,.card,.staf-main>.card,.warga-card{box-shadow:0 2px 16px rgba(29,86,201,.07)!important;transition:box-shadow .25s ease!important}.card:hover{box-shadow:0 6px 24px rgba(29,86,201,.12)!important}.table-wrap{border:1px solid rgba(29,86,201,.1)!important;border-radius:16px!important;overflow:hidden!important}.badge{display:inline-flex!important;align-items:center!important;padding:5px 12px!important;border-radius:999px!important;font-size:11.5px!important;font-weight:800!important;letter-spacing:.03em!important}.badge-wait{background:rgba(245,158,11,.12)!important;color:#92400e!important;border:1.5px solid rgba(245,158,11,.25)!important}.badge-new{background:rgba(29,86,201,.1)!important;color:#1e3a8a!important;border:1.5px solid rgba(29,86,201,.2)!important}.badge-proses{background:rgba(249,115,22,.12)!important;color:#9a3412!important;border:1.5px solid rgba(249,115,22,.25)!important}.badge-done{background:rgba(34,197,94,.12)!important;color:#166534!important;border:1.5px solid rgba(34,197,94,.22)!important}.badge-reject{background:rgba(239,68,68,.1)!important;color:#991b1b!important;border:1.5px solid rgba(239,68,68,.2)!important}.badge-neutral{background:rgba(100,116,139,.1)!important;color:#334155!important;border:1.5px solid rgba(100,116,139,.18)!important}.chat-box,.chat-shell{border-radius:18px!important;overflow:hidden!important}.chat-messages{background:#f8faff!important;background-image:radial-gradient(circle,rgba(29,86,201,.06) 1px,transparent 1px)!important;background-size:20px 20px!important}.bubble-me{background:linear-gradient(135deg,rgba(29,86,201,.12),rgba(46,145,250,.1))!important;border-color:rgba(29,86,201,.2)!important}.chat-input{background:#f0f4ff!important;border-top:1.5px solid rgba(29,86,201,.1)!important}.chat-input input:focus{border-color:#1d56c9!important;box-shadow:0 0 0 3px rgba(29,86,201,.15)!important}.list-row{border:1.5px solid rgba(29,86,201,.1)!important;border-radius:14px!important;background:#fff!important;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease!important}.list-row:hover{transform:translateX(4px)!important;border-color:rgba(29,86,201,.3)!important;box-shadow:0 4px 16px rgba(29,86,201,.1)!important}.list-title{color:#0f2f76!important;font-weight:800!important}.group-toggle{color:rgba(255,255,255,.65)!important;font-weight:700!important;border-radius:12px!important;padding:9px 12px!important;background:0 0!important;transition:background .2s!important}.group-toggle:hover{background:rgba(255,255,255,.08)!important}.group-toggle .left{color:rgba(255,255,255,.8)!important}.group-toggle .left i{width:28px;height:28px;background:rgba(255,255,255,.08);border-radius:8px;display:flex;align-items:center;justify-content:center}.menu-group.open .group-toggle{background:rgba(29,86,201,.2)!important;color:#fff!important}.group-items{padding-left:8px!important}.auth-card{background:#fff!important;border:1px solid rgba(29,86,201,.1)!important;border-radius:20px!important;box-shadow:0 8px 30px rgba(29,86,201,.12)!important;transition:transform .2s,box-shadow .2s!important}.auth-card:hover{transform:translateY(-4px)!important;box-shadow:0 16px 40px rgba(29,86,201,.18)!important}.pill{font-weight:800!important;font-size:11.5px!important;border-radius:999px!important;padding:5px 12px!important}.pill.green{background:rgba(34,197,94,.12)!important;color:#166534!important}.pill.yellow{background:rgba(245,158,11,.12)!important;color:#92400e!important}.pill.red{background:rgba(239,68,68,.1)!important;color:#991b1b!important}.pill.blue{background:rgba(29,86,201,.1)!important;color:#1e3a8a!important}.sisurat-jenis-card{border:1.5px solid rgba(29,86,201,.1)!important;border-radius:16px!important;background:#fff!important;transition:border-color .2s,transform .2s,box-shadow .2s!important}.sisurat-jenis-card:hover{border-color:#1d56c9!important;background:#f0f4ff!important;transform:translateY(-4px)!important;box-shadow:0 10px 28px rgba(29,86,201,.15)!important}.sis-step-num{background:rgba(29,86,201,.08)!important;border-color:rgba(29,86,201,.2)!important;color:#1d56c9!important}.sis-step.active .sis-step-num{background:#1d56c9!important;border-color:#1d56c9!important;color:#fff!important;box-shadow:0 0 0 4px rgba(29,86,201,.2)!important}.sis-step.done .sis-step-num{background:#059669!important;border-color:#059669!important}.side-menu::-webkit-scrollbar{width:4px}.side-menu::-webkit-scrollbar-track{background:rgba(255,255,255,.04)}.side-menu::-webkit-scrollbar-thumb{background:rgba(29,86,201,.3);border-radius:4px}body.is-warga{background:#f6f8fc}body.is-warga #footer,body.is-warga #header{display:none}.warga-shell{display:grid;grid-template-columns:260px 1fr;gap:18px;max-width:1200px;margin:24px auto;padding:0 16px}.warga-side{background:#fff;border-radius:16px;padding:14px;height:fit-content;position:sticky;top:16px}.warga-side .side-head,.warga-table td,.warga-table th{padding:16px 16px 12px;border-bottom:1px solid rgba(148,163,184,.25)}.warga-side .side-head h3{margin:0;font-size:14px;letter-spacing:.2px}.warga-side .side-menu{margin:0;padding:10px;list-style:none;display:flex;flex-direction:column;gap:6px}.warga-side a{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;text-decoration:none;font-weight:900;color:var(--text)}.warga-side a.active,.warga-side a:hover{background:rgba(30,99,255,.12);color:var(--primary)}.warga-main{min-width:0}.warga-metrics,.warga-top{gap:12px;margin-bottom:14px}.warga-top{display:flex;align-items:flex-start;justify-content:space-between}.warga-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.warga-metrics .metric{background:#fff;padding:14px}.warga-metrics .value{font-size:28px;font-weight:900;margin-top:6px}.warga-card{}.warga-card .card-pad{padding:16px}.warga-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.warga-table{width:100%;border-collapse:collapse}.warga-table td,.warga-table th{padding:10px;text-align:left;vertical-align:top}.warga-table th{font-size:12px;color:#64748b;text-transform:uppercase;letter-spacing:.04em}.pill{display:inline-block;background:rgba(148,163,184,.18);color:#334155}.pill.green{}.pill.yellow{background:rgba(245,158,11,.14)}.pill.red{background:rgba(239,68,68,.12)}.pill.blue{background:rgba(59,130,246,.12)}.chat-box,.chat-input textarea{border:1px solid rgba(148,163,184,.35)}.chat-messages{max-height:420px;overflow:auto;padding:12px;background:#fff}.chat-row{display:flex;margin:8px 0}.chat-row.me{justify-content:flex-end}.chat-bubble{max-width:72%;padding:10px 12px;border-radius:14px;background:rgba(148,163,184,.18)}.chat-row.me .chat-bubble{background:rgba(59,130,246,.12)}.chat-meta{font-size:11px;color:#64748b;margin-top:4px}.chat-input{display:flex;gap:10px;padding:12px;background:#f8fafc}.chat-input textarea{width:100%;min-height:44px;resize:vertical;padding:10px;border-radius:12px}#wargaMenuBackdrop,.warga-top [data-action=toggleWargaMenu]{display:none}@media (max-width:1023px){.warga-top [data-action=toggleWargaMenu]{display:inline-flex}}@media (max-width:1023px){.warga-shell{grid-template-columns:1fr;margin:18px auto}.warga-side{position:fixed;top:12px;left:12px;bottom:12px;width:min(360px,calc(100vw - 24px));height:auto;transform:translateX(calc(-100% - 24px));transition:transform .22s ease;z-index:100000}body.warga-menu-open .warga-side{transform:translateX(0)}body.warga-menu-open{overflow:hidden}#wargaMenuBackdrop{display:block;position:fixed;inset:0;background:rgba(2,6,23,.35);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:99999}body.warga-menu-open #wargaMenuBackdrop{opacity:1;pointer-events:auto}.warga-top{flex-wrap:wrap}.warga-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.warga-grid{grid-template-columns:1fr}}@media (max-width:480px){.warga-metrics{grid-template-columns:1fr}}.data-pagination{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:18px;flex-wrap:wrap}.data-pagination .page-btn{border:1px solid var(--border);background:var(--surface, #fff);color:var(--text);padding:8px 14px;border-radius:999px;font-weight:800;cursor:pointer;transition:.2s ease;display:inline-flex;align-items:center;gap:6px}.data-pagination .page-btn:hover:not(:disabled){background:var(--primary);color:#fff;border-color:var(--primary);transform:translateY(-1px)}.data-pagination .page-btn:disabled{opacity:.45;cursor:not-allowed}.data-pagination .page-info{font-size:13px;font-weight:800;color:var(--muted)}.hero-slider{position:relative;width:min(520px,100%);aspect-ratio:16/10;border-radius:20px;overflow:hidden;box-shadow:0 14px 34px rgba(0,0,0,.18)}.hero-slides-track{display:flex;width:100%;height:100%;transition:transform .6s cubic-bezier(.25,1,.5,1)}.hero-slide{flex:0 0 100%;width:100%;height:100%;position:relative;overflow:hidden}.hero-slide img{width:100%;height:100%;object-fit:cover;display:block;border-radius:0!important;box-shadow:none!important}.hero-slide-caption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.85));color:#fff;padding:20px 24px 35px;font-size:14px;font-weight:800;text-align:left;text-shadow:0 1px 4px rgba(0,0,0,.6)}.hero-slider-dots{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:10}.hero-slider-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.45);border:0;cursor:pointer;padding:0;transition:all .3s ease}.hero-slider-dot.active{background:#fff;transform:scale(1.3);width:18px;border-radius:4px}.btn,.btn-3d{box-shadow:none!important;transform:none!important}.btn{position:relative;transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .15s ease-out!important}.btn-3d{border-radius:8px!important;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;white-space:nowrap;border:0!important}.btn-3d.btn-primary,.btn-solid{background:#1e5fe3!important;color:#fff!important;border:0!important}.btn-3d.btn-primary:hover,.btn-solid:hover{background:#1552cc!important}.btn-3d.btn-primary:active,.btn-solid:active{transform:scale(.96)!important}.btn-3d.btn-warning{background:#d97706!important;color:#fff!important;border:0!important}.btn-3d.btn-warning:hover{background:#c26a05!important}.btn-3d.btn-warning:active{transform:scale(.96)!important}.btn-3d.btn-danger{background:#ef4444!important;color:#fff!important;border:0!important}.btn-3d.btn-danger:hover{background:#dc2626!important}.btn-3d.btn-danger:active{transform:scale(.96)!important}.btn-3d.btn-light{background:#f1f5f9!important;color:#1e293b!important;border:1px solid #cbd5e1!important}.btn-3d.btn-light:hover{background:#e2e8f0!important}.btn-3d.btn-light:active{transform:scale(.96)!important}.btn-3d.btn-sm{padding:6px 12px;font-size:12px;border-radius:6px!important}.btn-3d.btn-sm.btn-danger,.btn-3d.btn-sm.btn-warning{min-width:80px}.btn-3d.btn-tambah-data{min-width:140px}.btn-3d.btn-pilih-foto{min-width:125px}.btn-3d .btn-text{display:inline-block;transition:transform .2s ease,opacity .2s ease;opacity:1}.btn-3d i,.btn-3d svg{font-size:14px!important;transition:transform .2s ease!important}.btn-3d:hover i,.btn-3d:hover svg{transform:scale(1.15)}.btn-3d.btn-danger:not(:has(i)):not(:has(svg))::before,.btn-3d.btn-warning:not(:has(i)):not(:has(svg))::before{content:"";font-family:"Font Awesome 6 Free";font-weight:900;font-size:12px;display:inline-block;transition:transform .2s ease}.btn-3d.btn-danger:not(:has(i)):not(:has(svg))::before{content:""}.btn-ghost,.btn-outline{color:#fff!important;box-shadow:none!important;font-weight:600}.btn-ghost{background:#1e5fe3!important;border:0!important;border-radius:6px!important;transform:none!important;transition:background-color .2s ease,transform .15s ease-out!important}.btn-ghost:hover{background:#1552cc!important}.btn-ghost:active{transform:scale(.96)!important}.btn-ghost.btn-edit,.btn-ghost[data-action*=Edit],.btn-ghost[data-action*=edit],.btn-ghost[data-so-edit]{background:#d97706!important;color:#fff!important;border:0!important}.btn-ghost.btn-edit:hover,.btn-ghost[data-action*=Edit]:hover,.btn-ghost[data-action*=edit]:hover{background:#c26a05!important}.btn-ghost.btn-edit:active,.btn-ghost[data-action*=Edit]:active,.btn-ghost[data-action*=edit]:active{transform:scale(.96)!important}.btn-ghost.btn-hapus,.btn-ghost[data-action*=DeleteLaravel],.btn-ghost[data-action*=Delete],.btn-ghost[data-action*=deleteLaravel],.btn-ghost[data-action*=delete],.btn-ghost[data-so-del]{background:#ef4444!important;color:#fff!important;border:0!important}.btn-ghost.btn-hapus:hover,.btn-ghost[data-action*=DeleteLaravel]:hover,.btn-ghost[data-action*=Delete]:hover,.btn-ghost[data-action*=deleteLaravel]:hover,.btn-ghost[data-action*=delete]:hover{background:#dc2626!important}.btn-outline{background:rgba(255,255,255,.08)!important;border:2px solid rgba(255,255,255,.8)!important;border-radius:8px!important;text-shadow:0 1px 2px rgba(0,0,0,.15);backdrop-filter:blur(4px);transition:background-color .2s ease,border-color .2s ease,transform .15s ease-out!important;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px}.btn-outline:hover{background:rgba(255,255,255,.18)!important;border-color:#fff!important}.btn-ghost.btn-hapus:active,.btn-ghost[data-action*=DeleteLaravel]:active,.btn-ghost[data-action*=Delete]:active,.btn-ghost[data-action*=deleteLaravel]:active,.btn-ghost[data-action*=delete]:active,.btn-outline:active{transform:scale(.96)!important}/* =====================================================================
   FINAL UI RESPONSIVE FIX
   Fix ringan setelah bundle optimasi:
   1. Warna sidebar berita/pengumuman/agenda kembali hidup.
   2. Login/register kembali modern dan aman.
   3. Side menu admin/staf/warga <=1024px tidak mengunci layar.
   4. Hero berita/pengumuman/agenda dibuat seperti style Galeri Foto.
===================================================================== */

:root {
    --dm-navy: #082f49;
    --dm-navy-2: #0b3b63;
    --dm-blue: #2563eb;
    --dm-sky: #2f74dd;
    --dm-cyan: #9fc6f3;
    --dm-yellow: #fbbf24;
    --dm-bg: #eef8fb;
    --dm-text: #06172a;
    --dm-muted: #64748b;
    --dm-border: rgba(8, 47, 73, 0.14);
    --dm-shadow: 0 22px 60px -38px rgba(8, 47, 73, 0.55);
    --dm-bg-img: url('/assets/images/Background.png');
}

/* =========================================================
   A. HERO ATAS BERITA / PENGUMUMAN / AGENDA SEPERTI GALERI
========================================================= */
.berita-page .rds-simple-hero,
.pengumuman-page .rds-simple-hero,
.agenda-page .rds-simple-hero,
.berita-page .page-banner,
.pengumuman-page .page-banner,
.agenda-page .page-banner {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;
    min-height: clamp(220px, 28vw, 330px) !important;
    display: flex !important;
    align-items: center !important;
    color: #fff !important;
    background:
        linear-gradient(90deg, rgba(8, 47, 73, 0.94) 0%, rgba(8, 47, 73, 0.82) 42%, rgba(14, 116, 144, 0.58) 100%),
        var(--dm-bg-img) !important;
    background-size: cover !important;
    background-position: center !important;
    border-bottom: 0 !important;
}

.berita-page .rds-simple-hero::before,
.pengumuman-page .rds-simple-hero::before,
.agenda-page .rds-simple-hero::before,
.berita-page .page-banner::before,
.pengumuman-page .page-banner::before,
.agenda-page .page-banner::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    opacity: 0.16 !important;
    background-image: radial-gradient(rgba(255, 255, 255, 0.9) 1px, transparent 1px) !important;
    background-size: 18px 18px !important;
}

.berita-page .rds-simple-hero-inner,
.pengumuman-page .rds-simple-hero-inner,
.agenda-page .rds-simple-hero-inner,
.berita-page .page-banner-inner,
.pengumuman-page .page-banner-inner,
.agenda-page .page-banner-inner {
    width: min(1160px, calc(100% - 48px)) !important;
    margin-inline: auto !important;
    padding-block: clamp(54px, 8vw, 94px) !important;
}

.berita-page .rds-hero-row,
.pengumuman-page .rds-hero-row,
.agenda-page .rds-hero-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 28px !important;
}

.berita-page .rds-simple-hero h1,
.pengumuman-page .rds-simple-hero h1,
.agenda-page .rds-simple-hero h1,
.berita-page .page-banner h1,
.pengumuman-page .page-banner h1,
.agenda-page .page-banner h1 {
    color: #fff !important;
    max-width: 780px !important;
    margin: 0 !important;
    font-size: clamp(34px, 5vw, 62px) !important;
    line-height: 1.03 !important;
    font-weight: 1000 !important;
    letter-spacing: -0.055em !important;
    text-shadow: 0 10px 28px rgba(0, 0, 0, 0.35) !important;
}

.berita-page .rds-simple-hero p,
.pengumuman-page .rds-simple-hero p,
.agenda-page .rds-simple-hero p,
.berita-page .page-banner p,
.pengumuman-page .page-banner p,
.agenda-page .page-banner p {
    color: rgba(255, 255, 255, 0.92) !important;
    max-width: 700px !important;
    font-size: clamp(14px, 1.6vw, 17px) !important;
    font-weight: 760 !important;
    line-height: 1.65 !important;
    text-shadow: 0 8px 24px rgba(0, 0, 0, 0.26) !important;
}

.berita-page .rds-kicker-dark,
.pengumuman-page .rds-kicker-dark,
.agenda-page .rds-kicker-dark {
    color: var(--dm-navy) !important;
    background: var(--dm-yellow) !important;
    box-shadow: 0 14px 28px -22px rgba(251, 191, 36, 0.8) !important;
}

.berita-page .rds-breadcrumb-dark,
.pengumuman-page .rds-breadcrumb-dark,
.agenda-page .rds-breadcrumb-dark,
.berita-page .rds-breadcrumb-dark a,
.pengumuman-page .rds-breadcrumb-dark a,
.agenda-page .rds-breadcrumb-dark a {
    color: rgba(255, 255, 255, 0.86) !important;
}

.berita-page .rds-month-filter,
.pengumuman-page .rds-month-filter,
.agenda-page .rds-month-filter,
.berita-page .rds-search-pill,
.pengumuman-page .rds-search-pill,
.agenda-page .rds-search-pill {
    color: var(--dm-navy) !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid rgba(255, 255, 255, 0.56) !important;
    box-shadow: 0 18px 38px -28px rgba(0, 0, 0, 0.50) !important;
    backdrop-filter: blur(14px) !important;
}

/* =========================================================
   B. WARNA SIDEBAR BERITA / PENGUMUMAN / AGENDA
========================================================= */
.berita-integrated-sidebar,
.pengumuman-integrated-sidebar,
.agenda-integrated-sidebar,
.berita-modern-sidebar {
    gap: 20px !important;
}

.rds-side-card,
.berita-integrated-sidebar > aside,
.pengumuman-integrated-sidebar > aside,
.agenda-integrated-sidebar > aside,
.berita-modern-sidebar > aside {
    background: rgba(255, 255, 255, 0.96) !important;
    border: 1px solid rgba(8, 47, 73, 0.13) !important;
    border-radius: 20px !important;
    box-shadow: var(--dm-shadow) !important;
    padding: 22px !important;
    color: var(--dm-text) !important;
}

.rds-side-card h3,
.berita-integrated-sidebar h3,
.pengumuman-integrated-sidebar h3,
.agenda-integrated-sidebar h3 {
    color: var(--dm-text) !important;
    font-weight: 1000 !important;
    letter-spacing: -0.025em !important;
}

.rds-stat-card,
.pengumuman-integrated-sidebar .rds-stat-card,
.agenda-integrated-sidebar .rds-stat-card {
    color: #fff !important;
    background:
        radial-gradient(circle at 88% 8%, rgba(255, 255, 255, 0.28), transparent 30%),
        linear-gradient(135deg, #38bdf8 0%, #2563eb 100%) !important;
    border: 0 !important;
    box-shadow: 0 18px 40px -22px rgba(37, 99, 235, 0.55) !important;
}

.rds-stat-card * {
    color: inherit !important;
}

.rds-stat-card span,
.rds-stat-card small {
    color: rgba(255, 255, 255, 0.95) !important;
}

.rds-stat-card strong,
#pengumumanSidebarCount,
#agendaSidebarCount {
    color: #fff !important;
    font-size: clamp(34px, 4vw, 52px) !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
}

.rds-alert-item {
    border-left: 4px solid #ef4444 !important;
    background: linear-gradient(90deg, rgba(254, 226, 226, 0.90), rgba(255, 255, 255, 0.94)) !important;
    color: var(--dm-text) !important;
}

.rds-alert-item span {
    color: #dc2626 !important;
}

.rds-mini-agenda article {
    padding: 10px !important;
    border-radius: 14px !important;
    background: linear-gradient(90deg, rgba(224, 242, 254, 0.78), rgba(255, 255, 255, 0.94)) !important;
}

.rds-mini-agenda time,
.agenda-date-box,
.acf-date-box {
    color: var(--dm-navy) !important;
    background: linear-gradient(180deg, #e0f2fe, #bae6fd) !important;
    border: 1px solid rgba(47, 116, 221, 0.28) !important;
}

.rds-category-list span,
#pengumumanSidebarCategories span,
#beritaTabs button,
#beritaTabs .tab {
    color: var(--dm-navy) !important;
    background: #e0f2fe !important;
    border: 1px solid rgba(47, 116, 221, 0.20) !important;
    border-radius: 999px !important;
    padding: 7px 11px !important;
    font-weight: 900 !important;
}

#beritaTabs .active,
#beritaTabs button.active,
.rds-category-list span.active {
    color: #fff !important;
    background: linear-gradient(135deg, var(--dm-sky), var(--dm-blue)) !important;
}

/* =========================================================
   C. LOGIN / DAFTAR STABIL DAN BERWARNA
========================================================= */
.auth-page {
    min-height: calc(100vh - var(--header-h, 76px)) !important;
    display: grid !important;
    place-items: center !important;
    padding: clamp(40px, 7vw, 90px) 18px !important;
    background:
        radial-gradient(circle at 12% 10%, rgba(47, 116, 221, 0.18), transparent 28%),
        radial-gradient(circle at 88% 14%, rgba(37, 99, 235, 0.16), transparent 28%),
        linear-gradient(135deg, #f8fbff 0%, #e0f2fe 48%, #eef6ff 100%) !important;
}

.auth-page .auth-card {
    position: relative !important;
    width: min(980px, calc(100vw - 32px)) !important;
    min-height: 560px !important;
    display: grid !important;
    grid-template-columns: minmax(320px, 0.88fr) minmax(340px, 1fr) !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid rgba(191, 219, 254, 0.95) !important;
    box-shadow: 0 34px 90px -48px rgba(15, 23, 42, 0.62) !important;
}

.auth-page .auth-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 auto 0 !important;
    height: 7px !important;
    z-index: 5 !important;
    background: linear-gradient(90deg, var(--dm-sky), var(--dm-blue), #1e3a8a) !important;
}

.auth-page .auth-blue-side,
.auth-page .auth-side,
.auth-page .auth-brand-panel {
    position: relative !important;
    min-height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    gap: 28px !important;
    padding: clamp(28px, 4vw, 44px) !important;
    color: #fff !important;
    background:
        linear-gradient(135deg, rgba(47, 116, 221, 0.72), rgba(37, 99, 235, 0.86) 46%, rgba(8, 47, 73, 0.96)),
        var(--dm-bg-img) !important;
    background-size: cover !important;
    background-position: center !important;
}

.auth-page .auth-blue-side *,
.auth-page .auth-side *,
.auth-page .auth-brand-panel * {
    color: #fff !important;
}

.auth-page .auth-blue-logo,
.auth-page .auth-logo,
.auth-page .auth-brand-logo {
    width: 58px !important;
    height: 58px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    overflow: hidden !important;
}

.auth-page .auth-blue-logo img,
.auth-page .auth-logo img,
.auth-page .auth-brand-logo img {
    width: 46px !important;
    height: 46px !important;
    object-fit: contain !important;
}

.auth-page .auth-blue-form-wrap,
.auth-page .auth-form-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: clamp(30px, 5vw, 58px) !important;
    background: radial-gradient(circle at 100% 0%, rgba(56, 189, 248, 0.14), transparent 28%), linear-gradient(180deg, #fff, #f8fafc) !important;
}

.auth-page .auth-blue-form-inner,
.auth-page .auth-form-inner {
    width: min(430px, 100%) !important;
}

.auth-page .auth-icon {
    width: 58px !important;
    height: 58px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 20px !important;
    margin-bottom: 18px !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--dm-sky), var(--dm-blue), #1e3a8a) !important;
}

.auth-page .auth-card h1,
.auth-page .auth-card h2 {
    color: var(--dm-text) !important;
    font-size: clamp(24px, 3vw, 34px) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.04em !important;
    font-weight: 1000 !important;
}

.auth-page .auth-card input,
.auth-page .auth-card select,
.auth-page .auth-card textarea,
.auth-page .auth-card .input {
    min-height: 48px !important;
    color: #0f172a !important;
    background: #eef6ff !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 14px !important;
}

.auth-page .auth-card .btn-auth,
.auth-page .auth-card button[type="submit"] {
    width: 100% !important;
    min-height: 50px !important;
    border-radius: 14px !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--dm-sky), var(--dm-blue), #1e3a8a) !important;
}

/* Jika HTML auth belum punya panel kiri, tetap tampil bagus sebagai card tunggal */
.auth-page .auth-card:not(:has(.auth-blue-side)):not(:has(.auth-side)):not(:has(.auth-brand-panel)) {
    width: min(520px, calc(100vw - 32px)) !important;
    min-height: auto !important;
    display: block !important;
    padding: clamp(24px, 4vw, 36px) !important;
}

/* =========================================================
   D. SIDE MENU ADMIN / STAF / WARGA <=1024PX
========================================================= */
@media (max-width: 1024px) {
    body.is-admin,
    body.is-staf,
    body.is-warga {
        overflow-x: hidden !important;
    }

    .admin-shell,
    .staf-shell,
    .warga-shell {
        display: block !important;
        width: min(100% - 28px, 1180px) !important;
        margin-inline: auto !important;
    }

    .admin-main,
    .staf-main,
    .warga-main {
        width: 100% !important;
        margin-left: 0 !important;
        padding-inline: 0 !important;
    }

    .admin-side,
    .staf-side,
    .warga-side {
        position: fixed !important;
        inset: 0 auto 0 0 !important;
        z-index: 4000 !important;
        width: min(320px, 86vw) !important;
        max-width: 86vw !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        transform: translateX(-105%) !important;
        transition: transform 0.26s ease !important;
        border-radius: 0 24px 24px 0 !important;
        background: linear-gradient(180deg, #163f8a 0%, #082f49 100%) !important;
        color: #fff !important;
        box-shadow: 28px 0 80px -48px rgba(0, 0, 0, 0.80) !important;
    }

    body.side-open .admin-side,
    body.side-open .staf-side,
    body.side-open .warga-side,
    body.is-admin.side-open .admin-side,
    body.is-staf.side-open .staf-side,
    body.is-warga.side-open .warga-side {
        transform: translateX(0) !important;
    }

    body.side-open::after,
    body.is-admin.side-open::after,
    body.is-staf.side-open::after,
    body.is-warga.side-open::after {
        content: "" !important;
        position: fixed !important;
        inset: 0 !important;
        z-index: 3990 !important;
        background: rgba(2, 6, 23, 0.45) !important;
        backdrop-filter: blur(3px) !important;
    }

    .admin-side *,
    .staf-side *,
    .warga-side * {
        color: inherit !important;
    }

    .admin-side a,
    .staf-side a,
    .warga-side a,
    .admin-side button,
    .staf-side button,
    .warga-side button {
        color: rgba(255, 255, 255, 0.88) !important;
    }

    .admin-side a.active,
    .staf-side a.active,
    .warga-side a.active,
    .admin-side a:hover,
    .staf-side a:hover,
    .warga-side a:hover {
        color: #fff !important;
        background: rgba(255, 255, 255, 0.13) !important;
    }

    .admin-side .side-head,
    .staf-side .side-head,
    .warga-side .side-head {
        position: sticky !important;
        top: 0 !important;
        z-index: 2 !important;
        background: rgba(8, 47, 73, 0.96) !important;
        backdrop-filter: blur(12px) !important;
    }

    .admin-side .side-menu,
    .staf-side .side-menu,
    .warga-side .side-menu {
        padding-bottom: 40px !important;
    }

    .admin-toggle,
    .staf-toggle,
    .warga-toggle,
    .mobile-side-toggle,
    .sidebar-toggle,
    .hamburger,
    .mobile-menu-btn {
        position: relative !important;
        z-index: 4100 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

@media (max-width: 760px) {
    .berita-page .rds-hero-row,
    .pengumuman-page .rds-hero-row,
    .agenda-page .rds-hero-row {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    .berita-page .rds-month-filter,
    .pengumuman-page .rds-month-filter,
    .agenda-page .rds-month-filter,
    .berita-page .rds-search-pill,
    .pengumuman-page .rds-search-pill,
    .agenda-page .rds-search-pill {
        width: 100% !important;
        min-width: 0 !important;
    }

    .auth-page .auth-card {
        width: min(520px, calc(100vw - 24px)) !important;
        min-height: auto !important;
        display: block !important;
    }

    .auth-page .auth-blue-side,
    .auth-page .auth-side,
    .auth-page .auth-brand-panel {
        min-height: 260px !important;
    }

    .auth-page .auth-blue-form-wrap,
    .auth-page .auth-form-wrap {
        padding: 26px !important;
    }
}

/* =====================================================================
   DASHBOARD ROLE FIX v2 (admin / staf / warga) - digabung ke app.min.css
   1. Kartu metric & panel putih -> diberi warna agar terlihat.
   2. >800px : sidebar tampil sebagai kolom normal (sticky).
   3. <=800px: sidebar jadi drawer yang dibuka tombol hamburger (.side-toggle).
   4. Tombol "Menu" & "Kembali ke Publik" dirapikan (jarak + style).
   ===================================================================== */

/* ---- 1. KARTU METRIC: beri warna gradient + teks putih ---- */
.admin-shell .metric,.staf-shell .metric,.warga-shell .metric{border:0!important;color:#fff!important;box-shadow:0 10px 26px -12px rgba(15,23,42,.45)!important}
.admin-shell .metric:nth-child(1),.staf-shell .metric:nth-child(1),.warga-shell .metric:nth-child(1){background:linear-gradient(135deg,#1d56c9 0%,#2f6df0 100%)!important}
.admin-shell .metric:nth-child(2),.staf-shell .metric:nth-child(2),.warga-shell .metric:nth-child(2){background:linear-gradient(135deg,#7c3aed 0%,#a855f7 100%)!important}
.admin-shell .metric:nth-child(3),.staf-shell .metric:nth-child(3),.warga-shell .metric:nth-child(3){background:linear-gradient(135deg,#059669 0%,#34d399 100%)!important}
.admin-shell .metric:nth-child(4),.staf-shell .metric:nth-child(4),.warga-shell .metric:nth-child(4){background:linear-gradient(135deg,#d97706 0%,#f59e0b 100%)!important}
.admin-shell .metric:nth-child(5),.staf-shell .metric:nth-child(5),.warga-shell .metric:nth-child(5){background:linear-gradient(135deg,#1a52ad 0%,#2f74dd 100%)!important}
.admin-shell .metric:nth-child(6),.staf-shell .metric:nth-child(6),.warga-shell .metric:nth-child(6){background:linear-gradient(135deg,#db2777 0%,#ec4899 100%)!important}
.admin-shell .metric .label,.staf-shell .metric .label,.warga-shell .metric .label{color:rgba(255,255,255,.85)!important}
.admin-shell .metric .value,.staf-shell .metric .value,.warga-shell .metric .value{color:#fff!important}
.admin-shell .metric .metric-icon,.staf-shell .metric .metric-icon,.warga-shell .metric .metric-icon{background:rgba(255,255,255,.18)!important;color:#fff!important}

/* ---- PANEL/CARD putih: beri border & bayangan jelas ---- */
.admin-main .card,.staf-main .card,.warga-main .card,.warga-card,.admin-shell .card,.staf-shell .card,.warga-shell .card{background:#fff!important;border:1px solid rgba(29,86,201,.22)!important;box-shadow:0 8px 26px -16px rgba(15,23,42,.30)!important}
.admin-main .card h1,.admin-main .card h2,.admin-main .card h3,.admin-main .card h4,.staf-main .card h1,.staf-main .card h2,.staf-main .card h3,.staf-main .card h4,.warga-main .card h1,.warga-main .card h2,.warga-main .card h3,.warga-main .card h4{color:#0f172a!important}

/* ---- 4. TOMBOL TOP BAR: hamburger "Menu" + "Kembali ke Publik" ---- */
.side-toggle{display:none;align-items:center;gap:8px;border:0;cursor:pointer;font-weight:700;font-size:14px;line-height:1;color:#fff;background:linear-gradient(135deg,#1d56c9,#2f6df0);padding:11px 16px;border-radius:12px;box-shadow:0 8px 20px -8px rgba(29,86,201,.6);transition:transform .15s ease,box-shadow .15s ease}
.side-toggle:hover{transform:translateY(-1px);box-shadow:0 12px 26px -8px rgba(29,86,201,.72)}
.side-toggle:active{transform:translateY(0)}
.side-toggle i{font-size:16px}
.admin-top .top-actions,.staf-top .top-actions,.warga-top .top-actions{display:flex!important;align-items:center;gap:12px!important;flex-wrap:wrap}
.admin-top .top-actions .btn,.staf-top .top-actions .btn,.warga-top .top-actions .btn{border-radius:12px;font-weight:600;display:inline-flex;align-items:center;gap:8px}
.admin-top .top-actions .btn-ghost,.staf-top .top-actions .btn-ghost,.warga-top .top-actions .btn-ghost{background:#eef3ff!important;color:#1d56c9!important;border:1px solid rgba(29,86,201,.20)!important;padding:11px 16px!important;box-shadow:0 6px 16px -10px rgba(29,86,201,.45)!important}
.admin-top .top-actions .btn-ghost:hover,.staf-top .top-actions .btn-ghost:hover,.warga-top .top-actions .btn-ghost:hover{background:#e0e9ff!important;color:#1741a6!important;transform:translateY(-1px)}

/* ---- 2. >800px : sidebar tampil sebagai kolom normal ---- */
@media (min-width:801px){
  .admin-shell{grid-template-columns:268px minmax(0,1fr)!important;align-items:flex-start}
  .staf-shell{grid-template-columns:280px minmax(0,1fr)!important;align-items:flex-start}
  .warga-shell{grid-template-columns:260px minmax(0,1fr)!important;align-items:flex-start}
  .admin-side,.staf-side{position:sticky!important;top:86px!important;left:auto!important;right:auto!important;bottom:auto!important;inset:auto!important;transform:none!important;width:auto!important;max-width:none!important;height:auto!important;max-height:calc(100vh - 104px)!important;z-index:auto!important;overflow:auto!important;margin:0!important}
  .warga-side{position:sticky!important;top:16px!important;left:auto!important;right:auto!important;bottom:auto!important;inset:auto!important;transform:none!important;width:auto!important;max-width:none!important;height:fit-content!important;z-index:auto!important;margin:0!important}
  .side-toggle{display:none!important}
  #adminMenuBackdrop,#stafMenuBackdrop,#wargaMenuBackdrop{display:none!important}
}

/* ---- 3. <=800px : sidebar jadi drawer (dibuka tombol hamburger) ---- */
@media (max-width:800px){
  .admin-shell,.staf-shell,.warga-shell{grid-template-columns:1fr!important}
  .admin-side,.staf-side,.warga-side{position:fixed!important;top:0!important;left:0!important;right:auto!important;bottom:0!important;inset:0 auto 0 0!important;height:100vh!important;max-height:100vh!important;width:min(290px,84vw)!important;max-width:84vw!important;margin:0!important;border-radius:0 18px 18px 0!important;transform:translateX(-105%)!important;transition:transform .25s ease!important;z-index:100050!important;overflow-y:auto!important}
  body.side-open .admin-side,body.side-open .staf-side,body.side-open .warga-side,body.admin-menu-open .admin-side,body.staf-menu-open .staf-side,body.warga-menu-open .warga-side{transform:translateX(0)!important}
  .side-toggle{display:inline-flex!important}
  body.side-open::before{content:"";position:fixed;inset:0;background:rgba(8,17,31,.55);z-index:100040;pointer-events:none}
  #adminMenuBackdrop,#stafMenuBackdrop,#wargaMenuBackdrop{display:none!important}
  .admin-top .top-actions,.staf-top .top-actions,.warga-top .top-actions{width:auto!important;justify-content:flex-start}
}

/* =====================================================================
   DASHBOARD ADMIN - REDESAIN BAGIAN MAIN (sidebar tidak diubah)
   ===================================================================== */
.admin-shell .dash-topbar{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:16px;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:14px;box-shadow:0 8px 24px -18px rgba(15,23,42,.4);margin-bottom:18px}
.dash-topbar-title{font-weight:800;font-size:18px;color:#0f172a}
.dash-topbar-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.dash-icon-btn{width:40px;height:40px;border-radius:11px;border:1px solid rgba(15,23,42,.1);background:#f8fafc;color:#334155;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:16px;transition:.15s}
.dash-icon-btn:hover{background:#eef3ff;color:#1d56c9;border-color:rgba(29,86,201,.25)}
.dash-divider{width:1px;height:28px;background:rgba(15,23,42,.12)}
.dash-user{display:flex;align-items:center;gap:10px}
.dash-user-meta{display:flex;flex-direction:column;line-height:1.2;text-align:right}
.dash-user-name{font-weight:700;color:#0f172a;font-size:14px}
.dash-user-role{font-size:12px;color:#64748b}
.dash-user-avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#1d56c9,#2f6df0);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:18px}

.dash-breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:#64748b;margin-bottom:10px}
.dash-breadcrumb a{color:#64748b;text-decoration:none}
.dash-breadcrumb a:hover{color:#1d56c9}
.dash-breadcrumb strong{color:#1d56c9}

.dash-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:22px;flex-wrap:wrap}
.dash-hero-text h1{margin:0 0 8px;font-size:34px;font-weight:800;color:#0f172a}
.dash-hero-text p{margin:0;max-width:560px;color:#64748b;font-size:14.5px;line-height:1.6}
.dash-hero-btn{display:inline-flex;align-items:center;gap:9px;background:#0d1526;color:#fff;border:0;padding:13px 20px;border-radius:13px;font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap;box-shadow:0 12px 26px -14px rgba(13,21,38,.8);transition:.15s}
.dash-hero-btn:hover{background:#16243f;transform:translateY(-1px);color:#fff}

.dash-section-title{font-size:18px;font-weight:800;color:#0f172a;margin:0 0 14px}

.admin-main .dash-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:24px}
.dash-metric{background:#fff!important;border:1px solid rgba(15,23,42,.08)!important;border-left:5px solid #2f6df0!important;border-radius:16px;padding:18px;box-shadow:0 10px 26px -20px rgba(15,23,42,.5);display:flex;flex-direction:column;gap:8px;color:#0f172a!important}
.dash-metric.m-purple{border-left-color:#7c3aed!important}
.dash-metric.m-green{border-left-color:#059669!important}
.dash-metric.m-amber{border-left-color:#d97706!important}
.dash-metric-top{display:flex;align-items:center;justify-content:space-between}
.dash-metric-icon{width:42px;height:42px;border-radius:12px;background:#eef3ff;color:#1d56c9;display:inline-flex;align-items:center;justify-content:center;font-size:18px}
.dash-metric.m-purple .dash-metric-icon{background:#f3ecff;color:#7c3aed}
.dash-metric.m-green .dash-metric-icon{background:#e7f7f0;color:#059669}
.dash-metric.m-amber .dash-metric-icon{background:#fdf1de;color:#d97706}
.dash-badge{font-size:11px;font-weight:700;padding:5px 10px;border-radius:999px;white-space:nowrap}
.badge-blue{background:#eef3ff;color:#1d56c9}
.badge-pink{background:#fde7f1;color:#db2777}
.badge-green{background:#e7f7f0;color:#059669}
.dash-metric-label{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b!important}
.dash-metric-value{font-size:34px;font-weight:800;color:#0f172a!important;line-height:1}
.dash-metric-link{font-size:13px;font-weight:600;color:#1d56c9;text-decoration:none;display:inline-flex;align-items:center;gap:6px;margin-top:2px}
.dash-metric-link:hover{gap:9px}

.admin-main .dash-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:18px;align-items:start;margin-bottom:24px}
.admin-main .dash-card{background:#fff!important;border:1px solid rgba(15,23,42,.08)!important;border-radius:18px!important;padding:18px!important;box-shadow:0 10px 26px -20px rgba(15,23,42,.4)!important}
.dash-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.dash-card-head h3{margin:0;font-size:18px;font-weight:800;color:#0f172a}
.dash-link{font-size:13px;font-weight:600;color:#1d56c9;text-decoration:none}
.dash-news-list{display:flex;flex-direction:column;gap:12px}
.dash-news-item{display:flex;align-items:flex-start;gap:14px;padding:12px;border:1px solid rgba(15,23,42,.07);border-radius:14px;transition:.15s}
.dash-news-item:hover{border-color:rgba(29,86,201,.25);box-shadow:0 10px 24px -20px rgba(15,23,42,.5)}
.dash-news-thumb{width:74px;height:64px;flex:0 0 auto;border-radius:12px;background:linear-gradient(135deg,#dbe6ff,#eef3ff);display:flex;align-items:center;justify-content:center;color:#1d56c9;font-size:22px}
.dash-news-body{flex:1;min-width:0}
.dash-news-meta{display:flex;gap:8px;align-items:center;font-size:12px;color:#94a3b8;margin-bottom:4px;flex-wrap:wrap}
.dash-news-cat{color:#1d56c9;font-weight:700;letter-spacing:.04em}
.dash-news-cat.cat-green{color:#059669}
.dash-news-body h4{margin:0 0 4px;font-size:15.5px;font-weight:700;color:#0f172a}
.dash-news-body p{margin:0;font-size:13px;color:#64748b}
.dash-news-actions{display:flex;flex-direction:column;gap:8px}
.dash-ico-edit,.dash-ico-del{width:34px;height:34px;border-radius:9px;border:1px solid rgba(15,23,42,.1);background:#f8fafc;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:13px;transition:.15s}
.dash-ico-edit{color:#1d56c9}
.dash-ico-edit:hover{background:#eef3ff}
.dash-ico-del{color:#dc2626}
.dash-ico-del:hover{background:#fdeaea}

.dash-col-side{display:flex;flex-direction:column;gap:18px}
.dash-agenda-card{background:linear-gradient(160deg,#0f1f3d 0%,#0d1526 100%);border-radius:18px;padding:22px;color:#fff;box-shadow:0 18px 40px -22px rgba(13,21,38,.9)}
.dash-agenda-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.dash-agenda-head h3{margin:0;font-size:18px;font-weight:800;color:#fff}
.dash-dot{width:10px;height:10px;border-radius:50%;background:#5e9bea;box-shadow:0 0 0 4px rgba(56,189,248,.25)}
.dash-agenda-badge{display:inline-block;background:#1d56c9;color:#fff;font-size:11px;font-weight:700;letter-spacing:.06em;padding:5px 12px;border-radius:999px;margin-bottom:12px}
.dash-agenda-title{margin:0 0 10px;font-size:24px;font-weight:800;line-height:1.2;color:#fff}
.dash-agenda-desc{margin:0 0 16px;font-size:13.5px;color:rgba(255,255,255,.7);line-height:1.6;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:16px}
.dash-agenda-row{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.dash-agenda-ico{width:40px;height:40px;flex:0 0 auto;border-radius:11px;background:rgba(255,255,255,.1);color:#5e9bea;display:inline-flex;align-items:center;justify-content:center;font-size:16px}
.dash-agenda-row>div{display:flex;flex-direction:column;line-height:1.3}
.dash-agenda-k{font-size:11px;letter-spacing:.06em;color:rgba(255,255,255,.55);font-weight:700}
.dash-agenda-row strong{font-size:14.5px;color:#fff}
.dash-agenda-btn{display:block;text-align:center;margin-top:8px;background:#2f6df0;color:#fff;text-decoration:none;font-weight:700;padding:13px;border-radius:13px;transition:.15s}
.dash-agenda-btn:hover{background:#1d56c9;color:#fff}

.admin-main .dash-quick{background:#fff!important;border:1px solid rgba(15,23,42,.08)!important;border-radius:18px!important;padding:18px!important;box-shadow:0 10px 26px -20px rgba(15,23,42,.4)!important}
.dash-quick-title{margin:0 0 12px;font-size:12px;letter-spacing:.08em;font-weight:800;color:#64748b}
.dash-quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dash-quick-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:18px 10px;border:1px solid rgba(15,23,42,.1);border-radius:13px;text-decoration:none;color:#334155;font-size:13px;font-weight:600;transition:.15s}
.dash-quick-item i{font-size:20px;color:#1d56c9}
.dash-quick-item:hover{background:#eef3ff;border-color:rgba(29,86,201,.3);color:#1d56c9;transform:translateY(-2px)}

.dash-footer{margin-top:8px;padding:22px;background:#0d1526;border-radius:18px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;color:rgba(255,255,255,.7)}
.dash-footer-brand{display:flex;flex-direction:column;gap:4px}
.dash-footer-brand strong{color:#fff;font-size:16px}
.dash-footer-brand span{font-size:13px}
.dash-footer-links{display:flex;gap:18px;flex-wrap:wrap}
.dash-footer-links a{color:rgba(255,255,255,.75);text-decoration:none;font-size:13px}
.dash-footer-links a:hover{color:#fff}
.dash-footer-copy{font-size:12px;color:rgba(255,255,255,.5);width:100%;border-top:1px solid rgba(255,255,255,.1);padding-top:14px}

@media (max-width:1100px){.admin-main .dash-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-main .dash-grid{grid-template-columns:1fr}}
@media (max-width:560px){.admin-main .dash-metrics{grid-template-columns:1fr}.dash-hero-text h1{font-size:28px}.admin-shell .dash-topbar{flex-direction:column;align-items:flex-start}.dash-quick-grid{grid-template-columns:1fr}.dash-news-item{flex-wrap:wrap}}

/* =====================================================================
   WORD EDITOR TEMPLATE SURAT - toolbar menyamping (ribbon) +
   viewport lebih luas + dropdown variabel tidak terpotong
   ===================================================================== */
.word-editor-container{overflow:visible!important}
.word-editor-toolbar{display:flex!important;flex-wrap:nowrap!important;align-items:center;gap:6px!important;overflow-x:auto;overflow-y:visible;padding:8px 10px!important;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.word-editor-toolbar::-webkit-scrollbar{height:7px}
.word-editor-toolbar::-webkit-scrollbar-track{background:transparent}
.word-editor-toolbar::-webkit-scrollbar-thumb{background:rgba(29,86,201,.35);border-radius:6px}
.word-editor-toolbar .toolbar-group{flex:0 0 auto;display:flex;align-items:center;gap:4px}
.word-editor-toolbar .toolbar-divider{flex:0 0 auto}
.word-editor-toolbar .editor-select{flex:0 0 auto;max-width:160px}
.word-editor-toolbar .dropdown-container{flex:0 0 auto}
/* viewport area editing lebih tinggi/luas */
.word-editor-viewport{min-height:480px!important;max-height:none!important}
@media (max-width:800px){.word-editor-viewport{min-height:400px!important}}
/* dropdown Sisipkan Variabel: tampil penuh & bisa scroll, tidak menyusut ke viewport */
#varDropdownMenu{max-height:360px!important;overflow-y:auto!important;overscroll-behavior:contain}
#varDropdownMenu::-webkit-scrollbar{width:8px}
#varDropdownMenu::-webkit-scrollbar-thumb{background:rgba(29,86,201,.35);border-radius:6px}
#varDropdownMenu .dropdown-header{position:sticky;top:0;background:#fff;z-index:1;padding:6px 14px;font-size:11px;font-weight:800;letter-spacing:.06em;color:#64748b;text-transform:uppercase}
#varDropdownMenu .dropdown-item{display:block;padding:8px 14px;font-size:13px;color:#334155;text-decoration:none;white-space:nowrap}
#varDropdownMenu .dropdown-item:hover{background:#eef3ff;color:#1d56c9}

/* ---- Dashboard feed: state kosong / loading + chevron item ---- */
.dash-empty,.dash-agenda-empty{color:#94a3b8;font-size:13.5px;padding:18px;text-align:center}
.dash-agenda-empty{color:rgba(255,255,255,.75)}
.dash-agenda-empty i{font-size:26px;display:block;margin-bottom:8px;color:rgba(255,255,255,.6)}
.dash-news-item{position:relative}
.dash-news-go{margin-left:auto;align-self:center;color:#cbd5e1;font-size:13px;flex:0 0 auto}
.dash-news-item:hover .dash-news-go{color:#1d56c9}

/* ================= DASHBOARD REVISI 2 (header, jam, akses cepat, toast, hero) ================= */
/* Sembunyikan header publik saat berada di panel admin/staf/warga */
body.dash-hide-header #header{display:none!important}

/* Hero & breadcrumb: biru muda, tidak polos putih */
.admin-main .dash-breadcrumb{background:#eaf2ff;border:1px solid rgba(29,86,201,.14);border-radius:12px;padding:9px 14px;margin-bottom:12px}
.admin-main .dash-hero{background:linear-gradient(135deg,#eaf2ff 0%,#dbe9ff 100%)!important;border:1px solid rgba(29,86,201,.16);border-radius:18px;padding:24px 26px;box-shadow:0 12px 30px -24px rgba(29,86,201,.55)}
.admin-main .dash-hero .dash-hero-text h1{color:#0f2a6b}
.admin-main .dash-hero .dash-hero-text p{color:#3a558f}

/* Jam & tanggal realtime (kotak merah) */
.dash-clock{display:inline-flex;align-items:center;gap:10px;background:#eef3ff;border:1px solid rgba(29,86,201,.18);border-radius:12px;padding:7px 13px;color:#1d56c9}
.dash-clock>i{font-size:16px}
.dash-clock-meta{display:flex;flex-direction:column;line-height:1.2}
.dash-clock-time{font-weight:800;font-size:15px;color:#0f172a;font-variant-numeric:tabular-nums;letter-spacing:.3px}
.dash-clock-date{font-size:11px;color:#64748b}

/* Akses cepat dipindah ke top bar (kotak hijau) */
.dash-quick-top{display:inline-flex;align-items:center;gap:8px}
.dash-quick-top-btn{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid rgba(29,86,201,.18);border-radius:11px;padding:8px 12px;font-size:13px;font-weight:600;color:#334155;text-decoration:none;white-space:nowrap;transition:.15s}
.dash-quick-top-btn i{color:#1d56c9}
.dash-quick-top-btn:hover{background:#eef3ff;border-color:rgba(29,86,201,.35);color:#1d56c9;transform:translateY(-1px)}

/* Toast notifikasi sukses */
.dash-toast-host{position:fixed;right:20px;bottom:20px;z-index:99999;display:flex;flex-direction:column;gap:10px;pointer-events:none}
.dash-toast{display:flex;align-items:center;gap:11px;min-width:240px;max-width:360px;background:#fff;border:1px solid rgba(15,23,42,.1);border-left:5px solid #16a34a;border-radius:12px;padding:13px 16px;box-shadow:0 18px 40px -16px rgba(15,23,42,.45);font-size:14px;font-weight:500;color:#0f172a;opacity:0;transform:translateX(20px);transition:.3s ease;pointer-events:auto}
.dash-toast.show{opacity:1;transform:translateX(0)}
.dash-toast i{font-size:18px;color:#16a34a;flex:0 0 auto}
.dash-toast.error{border-left-color:#dc2626}
.dash-toast.error i{color:#dc2626}

@media (max-width:560px){
  .dash-clock-date{display:none}
  .dash-quick-top-btn span{display:none}
  .dash-quick-top-btn{padding:9px 11px}
  .dash-toast-host{left:14px;right:14px;bottom:14px}
  .dash-toast{max-width:none}
}
/* ================= END REVISI 2 ================= */

/* ================= TOP BAR DASHBOARD: rapikan susunan + hamburger ================= */
/* Hamburger benar-benar hilang di layar > 800px (desktop) */
@media (min-width:801px){
  .dash-topbar .side-toggle,
  .admin-top .side-toggle,
  .admin-top [data-action="toggleAdminMenu"]{display:none!important}
}

/* Susunan rapi: judul di kiri, semua aksi rata kanan dalam satu baris */
.admin-main .dash-topbar{flex-wrap:wrap;gap:12px 14px}
.admin-main .dash-topbar-actions{margin-left:auto;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.admin-main .dash-topbar-actions .side-toggle{order:-1}
.admin-main .dash-topbar-actions .dash-user{padding-left:4px}

/* Layar <= 900px: tata jadi blok vertikal yang rapi (tidak acak) */
@media (max-width:900px){
  .admin-main .dash-topbar{flex-direction:column;align-items:stretch}
  .admin-main .dash-topbar-title{width:100%}
  .admin-main .dash-topbar-actions{width:100%;margin-left:0;justify-content:flex-start;align-items:center;row-gap:10px}
  .admin-main .dash-topbar-actions .dash-user{margin-left:auto}
  .admin-main .dash-topbar-actions .dash-divider{display:none}
}
/* ================= END TOP BAR ================= */

/* ================= DASH TOPBAR v3: gradient biru muda->biru tua + isi penuh ================= */
.dash-topbar{
  background:linear-gradient(135deg,#dbe9ff 0%,#3f74e6 55%,#143b8f 100%)!important;
  border:1px solid rgba(29,86,201,.35)!important;
  box-shadow:0 14px 32px -20px rgba(20,59,143,.75)!important;
}
.dash-topbar-title{color:#fff!important;text-shadow:0 1px 2px rgba(8,17,31,.28)}
.dash-user-name{color:#fff!important}
.dash-user-role{color:rgba(255,255,255,.85)!important}
.dash-divider{background:rgba(255,255,255,.45)!important}
/* tombol Kembali ke Publik tetap kontras di atas gradient */
.dash-topbar .btn-ghost{background:rgba(255,255,255,.94)!important;color:#1741a6!important;border-color:rgba(255,255,255,.65)!important;box-shadow:0 6px 16px -10px rgba(8,17,31,.4)!important}
.dash-topbar .btn-ghost:hover{background:#fff!important;color:#13347f!important;transform:translateY(-1px)}

/* >800px: item disebar memenuhi bar => tidak ada ruang kosong besar */
@media (min-width:801px){
  .admin-main .dash-topbar,.staf-main .dash-topbar,.warga-main .dash-topbar{flex-direction:row!important;justify-content:space-between!important;align-items:center;flex-wrap:nowrap!important;gap:14px}
  .admin-main .dash-topbar-actions,.staf-main .dash-topbar-actions,.warga-main .dash-topbar-actions{display:contents!important}
  .dash-topbar .dash-divider{display:none!important}
  .dash-topbar .side-toggle,.dash-topbar [data-action="toggleAdminMenu"]{display:none!important}
}

/* <=800px: tata vertikal rapi, tanpa banyak ruang kosong */
@media (max-width:800px){
  .admin-main .dash-topbar,.staf-main .dash-topbar,.warga-main .dash-topbar{flex-direction:column;align-items:stretch;gap:10px}
  .admin-main .dash-topbar-title,.staf-main .dash-topbar-title,.warga-main .dash-topbar-title{width:100%}
  .admin-main .dash-topbar-actions,.staf-main .dash-topbar-actions,.warga-main .dash-topbar-actions{width:100%;margin-left:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;justify-content:flex-start}
  .dash-topbar-actions .dash-user{margin-left:auto}
}
/* ================= END DASH TOPBAR v3 ================= */

/* ===================== FIX10: kontak/home/auth/staf-warga ===================== */
/* Auth: hilangkan logo Kota Depok */
.auth-page .auth-blue-logo,.auth-page .auth-logo,.auth-page .auth-brand-logo,.auth-blue-logo{display:none!important}

/* Home: pindahkan lokasi pill ke bawah (inline, bukan absolute) */
.home-page .hero-loc-link{display:inline-flex!important;margin-top:20px!important;text-decoration:none!important}
.home-page .hero-locpill.hero-locpill--inline{position:static!important;inset:auto!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;width:auto!important;max-width:none!important;min-height:0!important;display:inline-flex!important;align-items:center!important;gap:12px!important;padding:10px 16px!important;border-radius:14px!important;background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.24)!important;box-shadow:none!important;backdrop-filter:blur(10px) saturate(160%)!important;pointer-events:auto!important;transform:none!important}
.home-page .hero-locpill.hero-locpill--inline::before{display:none!important}
.home-page .hero-locpill.hero-locpill--inline .hero-locpill-icon,.home-page .hero-locpill.hero-locpill--inline i{position:static!important;width:34px!important;height:34px!important;min-width:34px!important;border-radius:12px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:var(--kelurahan-yellow,#fbbf24)!important;color:#134e4a!important;box-shadow:none!important}
.home-page .hero-locpill.hero-locpill--inline>span:last-child{padding-top:0!important;min-width:0!important}
.home-page .hero-locpill.hero-locpill--inline strong{display:block!important;color:#fff!important;font-size:13px!important;line-height:1.2!important;font-weight:800!important}
.home-page .hero-locpill.hero-locpill--inline small{display:block!important;color:rgba(255,255,255,.86)!important;font-size:11px!important;line-height:1.3!important}
@media (max-width:680px){.home-page .hero-locpill.hero-locpill--inline{display:inline-flex!important}}

/* Home: sudut kartu statistik lebih halus & menyesuaikan */
.home-page .home-stats .stat-card{border-radius:16px!important;padding:12px 14px!important;background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.22)!important;backdrop-filter:blur(12px) saturate(150%)!important}

/* Kontak: kartu media sosial */
.kontak-page .kb-sosial-list{margin-top:4px}
.kontak-page #kSosialEmpty{margin:2px 0 0}

/* Staf & Warga: sidebar tampil >800px, hamburger hanya <800px (rapi seperti admin) */
@media (min-width:801px){
  .staf-top [data-action=toggleStafMenu],.warga-top [data-action=toggleWargaMenu]{display:none!important}
  .staf-shell{grid-template-columns:280px minmax(0,1fr)!important}
  .warga-shell{grid-template-columns:260px minmax(0,1fr)!important}
  .staf-side{position:sticky!important;transform:none!important;inset:auto!important;top:18px!important;left:auto!important;bottom:auto!important;width:auto!important;height:calc(100vh - 44px)!important;z-index:auto!important}
  .warga-side{position:sticky!important;transform:none!important;inset:auto!important;top:16px!important;left:auto!important;bottom:auto!important;width:auto!important;height:fit-content!important;z-index:auto!important}
  body.staf-menu-open,body.warga-menu-open{overflow:auto!important}
  #stafMenuBackdrop,#wargaMenuBackdrop{display:none!important}
}
@media (max-width:800px){
  .staf-shell,.warga-shell{grid-template-columns:1fr!important}
  .staf-top [data-action=toggleStafMenu],.warga-top [data-action=toggleWargaMenu]{display:inline-flex!important}
  .staf-side,.warga-side{position:fixed!important;top:12px!important;left:12px!important;bottom:12px!important;width:min(360px,calc(100vw - 24px))!important;height:auto!important;transform:translateX(calc(-100% - 24px))!important;z-index:100000!important}
  body.staf-menu-open .staf-side,body.warga-menu-open .warga-side{transform:translateX(0)!important}
}
/* ===================== END FIX10 ===================== */

/* ===================== FIX11: dash topbar readability + tidy buttons ===================== */
/* Judul portal: chip kontras gelap agar tulisan putih terbaca di atas gradient terang */
.dash-topbar .dash-topbar-title{
  color:#fff!important;
  background:rgba(11,37,89,.55);
  border:1px solid rgba(255,255,255,.30);
  padding:9px 16px;
  border-radius:12px;
  line-height:1.1;
  display:inline-flex;
  align-items:center;
  white-space:nowrap;
  text-shadow:0 1px 2px rgba(8,17,31,.40);
  box-shadow:0 8px 18px -12px rgba(8,17,31,.55);
}

/* Samakan tinggi & sudut semua kontrol agar terlihat rapih sejajar */
.dash-topbar .dash-clock,
.dash-topbar .dash-quick-top-btn,
.dash-topbar .btn.btn-ghost{
  height:42px!important;
  border-radius:11px!important;
  box-sizing:border-box!important;
  align-items:center!important;
}
.dash-topbar .dash-clock{padding:0 14px!important;background:#fff!important;border:1px solid rgba(255,255,255,.70)!important}
.dash-topbar .dash-quick-top{gap:10px!important}
.dash-topbar .dash-quick-top-btn{
  padding:0 14px!important;font-size:13px!important;font-weight:600!important;
  background:#fff!important;border:1px solid rgba(255,255,255,.70)!important;color:#16408f!important;
}
.dash-topbar .dash-quick-top-btn i{color:#1d56c9!important}
.dash-topbar .dash-quick-top-btn:hover{background:#eef3ff!important;color:#0f348a!important}
.dash-topbar .btn.btn-ghost{padding:0 16px!important;font-size:13px!important;font-weight:700!important}

/* Avatar selaras dengan tinggi kontrol */
.dash-topbar .dash-user-avatar{width:42px!important;height:42px!important}
/* ===================== END FIX11 ===================== */

/* ===================== FIX12: laporan cards 7-12 color + home badge no-box ===================== */
/* Kartu laporan 7-12 sebelumnya putih (teks putih tak terbaca) -> beri warna */
.admin-metrics .metric:nth-child(n+7){
  border:0!important;
  color:#fff!important;
  box-shadow:0 10px 26px -12px rgba(15,23,42,.45)!important;
}
.admin-metrics .metric:nth-child(n+7) .label{color:rgba(255,255,255,.85)!important}
.admin-metrics .metric:nth-child(n+7) .value{color:#fff!important}
.admin-metrics .metric:nth-child(7){background:linear-gradient(135deg,#1f5fc4 0%,#5e9bea 100%)!important}
.admin-metrics .metric:nth-child(8){background:linear-gradient(135deg,#4338ca 0%,#6366f1 100%)!important}
.admin-metrics .metric:nth-child(9){background:linear-gradient(135deg,#be123c 0%,#fb7185 100%)!important}
.admin-metrics .metric:nth-child(10){background:linear-gradient(135deg,#15803d 0%,#4ade80 100%)!important}
.admin-metrics .metric:nth-child(11){background:linear-gradient(135deg,#b45309 0%,#fbbf24 100%)!important}
.admin-metrics .metric:nth-child(12){background:linear-gradient(135deg,#6d28d9 0%,#c084fc 100%)!important}
.admin-metrics .metric:nth-child(7)::after{background:rgba(255,255,255,.10)!important}
.admin-metrics .metric:nth-child(n+7)::after{background:rgba(255,255,255,.10)!important}

/* Home hero badge: hilangkan kotak, sisakan tulisan Selamat Datang */
.home-page .hero-badge{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  color:#fff!important;
  font-size:15px!important;
  font-weight:700!important;
  text-shadow:0 1px 3px rgba(0,0,0,.35)!important;
}
/* ===================== END FIX12 ===================== */

/* ===================== FIX13: dash topbar judul jelas + tombol rapih ===================== */
/* Judul portal: chip gelap solid agar tulisan putih SELALU terbaca di atas gradient terang */
.dash-topbar .dash-topbar-title{
  color:#fff!important;
  background:linear-gradient(135deg,#0b2559 0%,#143b8f 100%)!important;
  border:1px solid rgba(255,255,255,.22)!important;
  padding:0 18px!important;
  height:44px!important;
  display:inline-flex!important;
  align-items:center!important;
  border-radius:12px!important;
  font-weight:800!important;
  font-size:15px!important;
  letter-spacing:.2px!important;
  white-space:nowrap!important;
  text-shadow:0 1px 2px rgba(8,17,31,.55)!important;
  box-shadow:0 10px 22px -14px rgba(8,17,31,.70)!important;
}
/* Baris kontrol: sejajar di tengah dengan jarak konsisten */
.dash-topbar .dash-topbar-actions{align-items:center!important;gap:12px!important}
/* Seragamkan tinggi semua kontrol agar sejajar rapih */
.dash-topbar .dash-clock,
.dash-topbar .dash-quick-top-btn,
.dash-topbar .btn.btn-ghost,
.dash-topbar .dash-user{height:44px!important;box-sizing:border-box!important;align-items:center!important}
/* Jam: rapikan teks, posisi, dan kontras */
.dash-topbar .dash-clock{
  display:inline-flex!important;gap:10px!important;padding:0 16px!important;border-radius:12px!important;
  background:#fff!important;border:1px solid rgba(255,255,255,.75)!important;color:#15347e!important;
  box-shadow:0 8px 18px -12px rgba(8,17,31,.45)!important;
}
.dash-topbar .dash-clock i{font-size:15px!important;color:#1d56c9!important}
.dash-topbar .dash-clock-meta{display:flex!important;flex-direction:column!important;line-height:1.15!important;text-align:left!important}
.dash-topbar .dash-clock-time{font-weight:800!important;font-size:14px!important;color:#0f2f73!important;font-variant-numeric:tabular-nums!important;letter-spacing:.5px!important}
.dash-topbar .dash-clock-date{font-size:11px!important;color:#5b6b86!important;font-weight:600!important}
/* Grup Upload/Kelola: segmented rapih dengan ukuran seragam */
.dash-topbar .dash-quick-top{display:inline-flex!important;gap:10px!important;align-items:center!important}
.dash-topbar .dash-quick-top-btn{
  height:44px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  gap:8px!important;padding:0 16px!important;border-radius:12px!important;
  font-size:13px!important;font-weight:700!important;white-space:nowrap!important;
  background:#fff!important;border:1px solid rgba(255,255,255,.75)!important;color:#15347e!important;
  box-shadow:0 8px 18px -12px rgba(8,17,31,.45)!important;
}
.dash-topbar .dash-quick-top-btn i{color:#1d56c9!important;font-size:14px!important}
.dash-topbar .dash-quick-top-btn:hover{background:#eef3ff!important;color:#0f348a!important;transform:translateY(-1px)}
/* Tombol "Kembali ke Publik" selaras */
.dash-topbar .btn.btn-ghost{height:44px!important;display:inline-flex!important;align-items:center!important;gap:8px!important;border-radius:12px!important;padding:0 18px!important;font-weight:700!important}
/* Avatar selaras tinggi kontrol */
.dash-topbar .dash-user-avatar{width:44px!important;height:44px!important}
@media(max-width:800px){
  .dash-topbar .dash-topbar-title{white-space:normal!important;height:auto!important;min-height:44px!important;padding:9px 16px!important;width:auto!important;align-self:flex-start!important}
}
/* ===================== END FIX13 ===================== */

/* ===================== FIX14: desktop (>800px) sembunyikan hamburger + anti-terpotong ===================== */
@media(min-width:801px){
  /* Hilangkan tombol hamburger "Menu" di layar desktop (sidebar sudah selalu tampil) */
  .dash-topbar .side-toggle,
  .admin-top .side-toggle{display:none!important}

  /* Izinkan topbar membungkus ke baris berikutnya, jangan dipaksa satu baris (penyebab teks terpotong) */
  .dash-topbar,
  .staf-main .dash-topbar,
  .warga-main .dash-topbar{
    flex-wrap:wrap!important;
    justify-content:flex-start!important;
    row-gap:12px!important;
    column-gap:14px!important;
  }

  /* Judul portal: tampil penuh, tidak menyusut, tidak terpotong */
  .dash-topbar .dash-topbar-title{
    flex:0 0 auto!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
  }

  /* Semua kontrol memakai lebar natural, tidak menyusut */
  .dash-topbar .dash-clock,
  .dash-topbar .dash-quick-top,
  .dash-topbar .btn.btn-ghost,
  .dash-topbar .dash-user{flex:0 0 auto!important}

  /* Tombol Upload Foto & Kelola User: teks tampil penuh */
  .dash-topbar .dash-quick-top-btn{
    flex:0 0 auto!important;
    max-width:none!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
  }
  .dash-topbar .dash-quick-top-btn span{
    display:inline!important;
    max-width:none!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
  }

  /* Blok user didorong ke kanan */
  .dash-topbar .dash-user{margin-left:auto!important}
}
/* ===================== END FIX14 ===================== */

/* ===================== FIX15: auth logo + hamburger admin ===================== */
/* Hamburger admin (tombol .btn.btn-ghost[data-action=toggleAdminMenu] yang di-inject admin.js) HANYA muncul di <=800px */
@media (min-width:801px){
  .dash-topbar .top-actions .btn.btn-ghost[data-action="toggleAdminMenu"],
  .admin-top .top-actions .btn.btn-ghost[data-action="toggleAdminMenu"],
  .dash-topbar .btn.btn-ghost[data-action="toggleAdminMenu"],
  .admin-top .btn.btn-ghost[data-action="toggleAdminMenu"],
  .dash-topbar [data-action="toggleAdminMenu"],
  .admin-top [data-action="toggleAdminMenu"],
  .dash-topbar .side-toggle,
  .admin-top .side-toggle{display:none!important}
}
@media (max-width:800px){
  .admin-top .top-actions .btn.btn-ghost[data-action="toggleAdminMenu"],
  .dash-topbar .btn.btn-ghost[data-action="toggleAdminMenu"]{display:inline-flex!important}
}
/* Auth: pastikan logo/lambang Kota Depok tersembunyi di SEMUA ukuran layar */
.auth-page .auth-blue-logo,.auth-blue-logo,.auth-blue-brand .auth-blue-logo,.auth-blue-side .auth-blue-logo,.auth-blue-side .auth-blue-logo img,.auth-blue-side img{display:none!important}
/* ===================== END FIX15 ===================== */

/* ===================== FIX16: topbar muat penuh >1024px + logo auth (header) ===================== */
@media (min-width:801px){
  /* Override DASH TOPBAR v3 (flex-wrap:nowrap) penyebab tombol "Kembali ke Publik" & blok user terpotong */
  .admin-main .dash-topbar,
  .staf-main .dash-topbar,
  .warga-main .dash-topbar{
    flex-wrap:wrap!important;
    justify-content:flex-start!important;
    align-items:center!important;
    row-gap:12px!important;
    column-gap:14px!important;
    overflow:visible!important;
  }
  /* Blok user didorong ke kanan, lebar natural, tidak menyusut/terpotong */
  .admin-main .dash-topbar .dash-user,
  .staf-main .dash-topbar .dash-user,
  .warga-main .dash-topbar .dash-user{
    flex:0 0 auto!important;
    margin-left:auto!important;
    overflow:visible!important;
  }
  /* Tombol "Kembali ke Publik" tampil penuh */
  .admin-main .dash-topbar .btn.btn-ghost,
  .staf-main .dash-topbar .btn.btn-ghost,
  .warga-main .dash-topbar .btn.btn-ghost{
    flex:0 0 auto!important;
    white-space:nowrap!important;
    overflow:visible!important;
    max-width:none!important;
  }
  /* Nama & role user tampil penuh */
  .admin-main .dash-topbar .dash-user-meta,
  .staf-main .dash-topbar .dash-user-meta,
  .warga-main .dash-topbar .dash-user-meta{overflow:visible!important;max-width:none!important}
  .admin-main .dash-topbar .dash-user-name,
  .admin-main .dash-topbar .dash-user-role,
  .staf-main .dash-topbar .dash-user-name,
  .staf-main .dash-topbar .dash-user-role,
  .warga-main .dash-topbar .dash-user-name,
  .warga-main .dash-topbar .dash-user-role{
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    max-width:none!important;
  }
}
/* ===================== END FIX16 ===================== */

/* ===================== FIX17: hapus foto gedung + lambang Kota Depok dari panel biru auth (logo header dikembalikan) ===================== */
.auth-page .auth-blue-side,
.auth-page .auth-brand-panel,
.auth-page .auth-side{
  background-image:linear-gradient(135deg,#2f74dd 0%,#2563eb 46%,#082f49 100%)!important;
}
/* ===================== END FIX17 ===================== */

/* ===================== FIX18: Sembunyikan hamburger Menu toggles di layar desktop (>800px) untuk staf/warga/admin ===================== */
@media (min-width: 801px) {
  .staf-top .side-toggle,
  .warga-top .side-toggle,
  .admin-top .side-toggle,
  .dash-topbar .side-toggle {
    display: none !important;
  }
}


/* FIX-ROLE-SIDEBAR-DESKTOP-1024 */
@media (min-width:1024px){
  .admin-top [data-action="toggleAdminMenu"],
  .staf-top [data-action="toggleStafMenu"],
  .warga-top [data-action="toggleWargaMenu"],
  .dash-topbar [data-action="toggleAdminMenu"]{
    display:none!important;
  }

  .admin-shell{
    display:grid!important;
    grid-template-columns:268px minmax(0,1fr)!important;
    max-width:1200px!important;
    width:100%!important;
    margin:24px auto 48px!important;
    padding:0 24px 48px!important;
    column-gap:20px!important;
    align-items:flex-start!important;
  }

  .staf-shell{
    display:grid!important;
    grid-template-columns:280px minmax(0,1fr)!important;
    max-width:var(--container)!important;
    margin:0 auto!important;
    padding:22px 24px 56px!important;
    gap:18px!important;
    align-items:flex-start!important;
  }

  .warga-shell{
    display:grid!important;
    grid-template-columns:260px minmax(0,1fr)!important;
    max-width:1200px!important;
    margin:24px auto!important;
    padding:0 16px!important;
    gap:18px!important;
    align-items:flex-start!important;
  }

  .admin-side,
  .staf-side,
  .warga-side{
    position:sticky!important;
    left:auto!important;
    bottom:auto!important;
    width:auto!important;
    transform:none!important;
    z-index:auto!important;
  }

  .admin-side{
    top:86px!important;
    height:calc(100vh - 110px)!important;
  }

  .staf-side{
    top:18px!important;
    height:calc(100vh - 44px)!important;
  }

  .warga-side{
    top:16px!important;
    height:fit-content!important;
  }

  #adminMenuBackdrop,
  #stafMenuBackdrop,
  #wargaMenuBackdrop{
    display:none!important;
  }

  body.admin-menu-open,
  body.staf-menu-open,
  body.warga-menu-open{
    overflow:auto!important;
  }
}

/* FIX-ROLE-SIDEBAR-DESKTOP-1024-V2 */
@media (min-width:1024px){
  body.is-admin .admin-top [data-action="toggleAdminMenu"],
  body.is-staf .staf-top [data-action="toggleStafMenu"],
  body.is-warga .warga-top [data-action="toggleWargaMenu"],
  body.is-admin .dash-topbar [data-action="toggleAdminMenu"]{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
  body.is-admin .admin-shell{grid-template-columns:268px minmax(0,1fr)!important;}
  body.is-staf .staf-shell{grid-template-columns:280px minmax(0,1fr)!important;}
  body.is-warga .warga-shell{grid-template-columns:260px minmax(0,1fr)!important;}
  body.is-admin .admin-side,
  body.is-staf .staf-side,
  body.is-warga .warga-side{
    position:sticky!important;
    left:auto!important;right:auto!important;bottom:auto!important;
    transform:none!important;
    width:auto!important;max-width:none!important;
    z-index:auto!important;
  }
  body.is-admin .admin-side{top:86px!important;height:calc(100vh - 110px)!important;}
  body.is-staf .staf-side{top:18px!important;height:calc(100vh - 44px)!important;}
  body.is-warga .warga-side{top:16px!important;height:fit-content!important;}
}
@media (max-width:1023px){
  body.is-admin .admin-top [data-action="toggleAdminMenu"],
  body.is-staf .staf-top [data-action="toggleStafMenu"],
  body.is-warga .warga-top [data-action="toggleWargaMenu"]{display:inline-flex!important;visibility:visible!important;pointer-events:auto!important;}
}

/* ---- app-auth-split.css ---- */
/* ===========================================================================
   AUTH DUA-KOLOM — panel biru di samping untuk SEMUA halaman auth
   (login, register, lupa password, verify OTP, reset password)
   Markup di-tanam langsung di tiap HTML (class .auth-card.has-blue-side),
   jadi tidak bergantung pada injeksi JS.
   Catatan: warna teks putih & gaya kicker panel sudah diatur oleh app.min.css
   (selektor .auth-page .auth-blue-side ...). File ini menambahkan LAYOUT.
=========================================================================== */

.auth-page .auth-card.has-blue-side {
    width: min(960px, calc(100% - 32px));
    max-width: 960px;
    padding: 0;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1.02fr 0.98fr;
    align-items: stretch;
}

.auth-page .auth-card.has-blue-side.wide {
    width: min(1040px, calc(100% - 32px));
    max-width: 1040px;
}

/* ---------- Panel biru kiri ---------- */
.auth-blue-side {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 28px;
    padding: 42px 38px;
    min-height: 560px;
    isolation: isolate;
    background-color: #1e40af;
}

.auth-blue-side::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: 
        linear-gradient(135deg, rgba(37, 99, 235, 0.68) 0%, rgba(14, 58, 138, 0.88) 100%),
        url('../images/Background.png') center center / cover no-repeat;
}

/* watermark logo (gambar gedung tidak tersedia) */
.auth-blue-side::after {
    content: "";
    position: absolute;
    right: -36px;
    bottom: -26px;
    width: 250px;
    height: 200px;
    z-index: -1;
    opacity: 0.16;
    display: none !important; /* hide the large watermark logo */
}

.auth-blue-brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.auth-page .auth-blue-side .auth-blue-brand .auth-blue-logo,
.auth-blue-side .auth-blue-logo {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background: #ffffff !important;
    border-radius: 50% !important;
    padding: 6px !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
    flex-shrink: 0;
}

.auth-page .auth-blue-side .auth-blue-brand .auth-blue-logo img,
.auth-blue-side .auth-blue-logo img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

.auth-blue-name {
    display: block;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
}

.auth-blue-address {
    display: block;
    font-size: 12px;
    opacity: 0.92;
}

.auth-blue-copy {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: auto;
}

.auth-blue-kicker {
    align-self: flex-start;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.4px;
    padding: 5px 13px;
    border-radius: 999px;
}

.auth-blue-title {
    font-size: 30px;
    font-weight: 900;
    line-height: 1.16;
    margin: 0;
}

.auth-blue-desc {
    font-size: 14px;
    line-height: 1.65;
    opacity: 0.95;
    margin: 0;
    max-width: 44ch;
}

.auth-blue-security {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.auth-blue-sec-item {
    display: flex;
    align-items: center;
    gap: 11px;
}

.auth-blue-sec-item i {
    font-size: 19px;
}

.auth-blue-sec-item strong {
    display: block;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.15;
}

.auth-blue-sec-item small {
    display: block;
    font-size: 11px;
    opacity: 0.9;
}

/* ---------- Kolom form kanan ---------- */
.auth-blue-form-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 34px;
    background: var(--surface, #fff);
}

.auth-blue-form-inner {
    width: 100%;
    max-width: 400px;
}

.auth-card.has-blue-side .auth-blue-form-inner > .auth-icon {
    margin-bottom: 6px;
}

/* ---------- Responsif: tumpuk & sembunyikan panel di layar kecil ---------- */
@media (max-width: 860px) {
    .auth-page .auth-card.has-blue-side,
    .auth-page .auth-card.has-blue-side.wide {
        grid-template-columns: 1fr;
        width: min(540px, calc(100% - 28px));
    }
    .auth-blue-side {
        display: none;
    }
    .auth-blue-form-wrap {
        padding: 28px 22px;
    }
}

/* =====================================================================
   DASHBOARD TWEAKS: Hide hamburger Menu toggles on desktop (> 800px)
   ===================================================================== */
@media (min-width: 801px) {
    .staf-top .side-toggle,
    .warga-top .side-toggle,
    .admin-top .side-toggle,
    .dash-topbar .side-toggle {
        display: none !important;
    }
}


/* ---- KELURAHAN ENHANCE (chat + scroll + theme) ---- */
body.is-admin .table-wrap,body.is-admin .table-wrapper,body.is-staf .table-wrap,body.is-staf .table-wrapper,body.is-warga .table-wrap,body.is-warga .table-wrapper{display:block!important;width:100%!important;max-width:100%!important;max-height:72vh!important;overflow-x:auto!important;overflow-y:auto!important;border:1px solid rgba(29,86,201,.14)!important;border-radius:16px!important;-webkit-overflow-scrolling:touch!important}
body.is-admin .table-wrap .table,body.is-admin .table-wrapper .table,body.is-staf .table-wrap .table,body.is-staf .table-wrapper .table,body.is-warga .table-wrap .warga-table,body.is-warga .table-wrapper .warga-table{display:table!important;width:max-content!important;min-width:1040px!important;max-width:none!important;table-layout:auto!important}
body.is-admin .table-wrap .table tr,body.is-staf .table-wrap .table tr,body.is-warga .table-wrap .warga-table tr{display:table-row!important;width:auto!important}
body.is-admin .table-wrap .table th,body.is-admin .table-wrap .table td,body.is-staf .table-wrap .table th,body.is-staf .table-wrap .table td,body.is-warga .table-wrap .warga-table th,body.is-warga .table-wrap .warga-table td{display:table-cell!important;white-space:nowrap!important;vertical-align:middle!important}
.table-wrap::-webkit-scrollbar,.table-wrapper::-webkit-scrollbar{width:12px;height:12px}
.table-wrap::-webkit-scrollbar-thumb,.table-wrapper::-webkit-scrollbar-thumb{background:#93c5fd;border-radius:999px;border:3px solid #eff6ff}
.table-wrap::-webkit-scrollbar-track,.table-wrapper::-webkit-scrollbar-track{background:#eff6ff;border-radius:999px}
.kel-thread{padding:12px 14px;border:1px solid rgba(29,86,201,.14);border-radius:14px;margin-bottom:8px;cursor:pointer;transition:.15s;display:block}
.kel-thread:hover{background:#f4f8ff}
.kel-thread.active{background:rgba(31,95,224,.1);border-color:#2563eb;box-shadow:inset 3px 0 0 #2563eb}
.kel-thread b{display:block;font-weight:800}
.kel-thread small{display:block;color:#64748b;font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kel-unread{float:right;background:#2563eb;color:#fff;border-radius:999px;font-size:11px;padding:1px 8px;font-weight:800}
.kel-line{display:flex;margin:8px 0}
.kel-line.is-me{justify-content:flex-end}
.kel-bubble{max-width:78%;padding:10px 14px;border-radius:16px;background:#eff6ff;color:#0f172a}
.kel-line.is-me .kel-bubble{background:#2563eb;color:#fff}
.kel-text{white-space:pre-wrap;word-break:break-word}
.kel-meta{display:flex;gap:8px;align-items:center;justify-content:flex-end;font-size:11px;opacity:.75;margin-top:4px}
.kel-read.is-read{color:#aacdf5}
/* ---- chat lampiran + edit/hapus ---- */
.kel-clip{border:1px solid rgba(29,86,201,.25);background:#eff6ff;color:#1d56c9;border-radius:12px;width:42px;height:42px;font-size:18px;cursor:pointer;flex:0 0 auto;margin-right:8px}
.kel-clip:hover{background:#dbeafe}
.kel-filetag{align-items:center;gap:8px;background:#eff6ff;border:1px solid rgba(29,86,201,.25);color:#1d56c9;border-radius:10px;padding:6px 10px;font-size:13px;margin-top:8px;width:100%}
.kel-filetag-x{border:none;background:#2563eb;color:#fff;border-radius:8px;cursor:pointer;padding:1px 7px;margin-left:auto}
.kel-att-img img{max-width:220px;max-height:220px;border-radius:12px;display:block;margin-top:4px}
.kel-att-file{display:inline-block;margin-top:4px;padding:8px 12px;border-radius:10px;background:rgba(255,255,255,.18);color:inherit;text-decoration:none;font-weight:700}
.kel-line.is-other .kel-att-file{background:#e2e8f0;color:#0f172a}
.kel-edited{font-style:italic;opacity:.7;margin-left:6px}
.kel-tools{display:flex;gap:6px;justify-content:flex-end;margin-top:4px;opacity:0;transition:.15s}
.kel-bubble:hover .kel-tools{opacity:1}
.kel-act{border:none;background:rgba(255,255,255,.25);color:inherit;border-radius:8px;font-size:11px;padding:2px 8px;cursor:pointer;font-weight:700}
.kel-line.is-other .kel-act{background:#e2e8f0;color:#0f172a}
.kel-act:hover{background:rgba(255,255,255,.45)}

/* ====== THEME REFRESH (clean5): palet biru-muda clean & modern ====== */
:root{--bg:#eef4ff;--primary:#2563eb;--primary-500:#4f8bef;--primary-700:#1a4fb0;--primary-800:#15408f;--primary-soft:#e9f1ff;--field-bg:#f5f9ff;--border:#e3ebf7;--dm-bg:#eef4ff;--dm-sky:#2f74dd;--dm-cyan:#9fc6f3}
body{background:var(--bg);color:var(--text)}
.svc-icon--purple,.svc-icon--orange,.svc-icon--green,.svc-icon--blue{background:linear-gradient(135deg,#2563eb 0%,#4f8bef 100%);color:#fff}

/* ====== THEME REFRESH (clean6): seragamkan kartu/ikon berwarna -> biru ====== */
.home-pengumuman-card{background:linear-gradient(135deg,#1d4ed8 0,#2563eb 60%,#3b82f6 100%)!important;color:#fff!important}
.home-galeri-card{background:linear-gradient(135deg,#1e40af 0,#2f74dd 60%,#5e9bea 100%)!important;color:#fff!important}
.panel-news,.home-page .panel-news{background:linear-gradient(150deg,#0f2a6b 0,#1e3a8a 50%,#0b1f4d 100%)!important}
.home-page .panel-news .section-head h2::after{background:#60a5fa!important}
.home-page .panel-news .link-more{color:#bfdbfe!important}
.svc-icon--blue,.svc-icon--purple,.svc-icon--green,.svc-icon--orange{background:linear-gradient(135deg,#3b82f6,#2563eb)!important}
.feat-icon--blue,.feat-icon--purple,.feat-icon--green,.feat-icon--orange{background:linear-gradient(135deg,#3b82f6,#1d4ed8)!important}

/* ====== THEME REFRESH (clean7): seragamkan SEMUA elemen warna-warni -> biru (dashboard, layanan, dll). Warna tombol/badge status TIDAK diubah. ====== */
.metric:nth-child(n),.admin-metrics .metric:nth-child(n),.staf-metrics .metric:nth-child(n),.warga-metrics .metric:nth-child(n),.dash-metrics .metric:nth-child(n),.admin-shell .metric:nth-child(n),.staf-shell .metric:nth-child(n),.warga-shell .metric:nth-child(n){background:linear-gradient(135deg,#1e40af 0%%,#2563eb 100%%)!important;box-shadow:0 8px 24px rgba(37,99,235,.28)!important}
.metric:nth-child(even),.admin-metrics .metric:nth-child(even),.staf-metrics .metric:nth-child(even),.warga-metrics .metric:nth-child(even),.dash-metrics .metric:nth-child(even),.admin-shell .metric:nth-child(even),.staf-shell .metric:nth-child(even),.warga-shell .metric:nth-child(even){background:linear-gradient(135deg,#1a52ad 0%%,#2f74dd 100%%)!important}
.dash-metric.m-amber,.dash-metric.m-green,.dash-metric.m-purple,.dash-metric.m-red,.dash-metric.m-blue,.m-amber,.m-green,.m-purple,.m-red{border-left-color:#2563eb!important}
.dash-metric.m-amber .dash-metric-icon,.dash-metric.m-green .dash-metric-icon,.dash-metric.m-purple .dash-metric-icon,.dash-metric.m-red .dash-metric-icon,.m-amber .dash-metric-icon,.m-green .dash-metric-icon,.m-purple .dash-metric-icon{background:#e9f1ff!important;color:#2563eb!important}
.icon.blue,.icon.green,.icon.purple,.icon.red,.icon.orange{background:linear-gradient(135deg,#2563eb,#2f74dd)!important;color:#fff!important}
.home-page .service-card h4,.panel-services .service-card h4,.home-page .service-card p,.panel-services .service-card p{color:#fff!important}
.svc-icon--blue,.svc-icon--purple,.svc-icon--green,.svc-icon--orange,.svc-icon--red,.feat-icon--blue,.feat-icon--purple,.feat-icon--green,.feat-icon--orange,.feat-icon--red,.feature-icon--blue,.feature-icon--purple,.feature-icon--green,.feature-icon--orange,.feature-icon--red,.panel-services .svc-icon--blue,.panel-services .svc-icon--purple,.panel-services .svc-icon--green,.panel-services .svc-icon--orange{background:linear-gradient(135deg,#3b82f6,#2563eb)!important;color:#fff!important}
.home-news-item:nth-child(n){border-left-color:#2563eb!important}
.home-news-item:nth-child(n) .hni-thumb-empty{background:linear-gradient(135deg,#1e40af,#2563eb)!important;color:#dbeafe!important}
.visimisi-icon,.featured-no-img{background:linear-gradient(135deg,#2563eb,#3b82f6)!important}
.visimisi-misi h4{color:#93c5fd!important}.visimisi-misi-list li i{color:#60a5fa!important}

/* ====== THEME REFRESH (clean8): Pengumuman/Galeri -> biru; Sidebar admin/staf/warga -> biru muda ====== */
/* 1) Kartu Pengumuman & Galeri (kalahkan .home-card.home-*-card hijau/oranye) */
.home-card.home-pengumuman-card{background:radial-gradient(circle at 88% 14%,rgba(255,255,255,.18),transparent 28%),linear-gradient(135deg,#1d4ed8 0,#2563eb 60%,#3b82f6 100%)!important;color:#fff!important}
.home-card.home-galeri-card{background:radial-gradient(circle at 88% 14%,rgba(255,255,255,.20),transparent 28%),linear-gradient(135deg,#1e40af 0,#2f74dd 60%,#5e9bea 100%)!important;color:#fff!important}

/* 2) SIDEBAR -> biru muda */
.admin-side,.staf-side,.warga-side{background:linear-gradient(180deg,#eef5ff 0,#dce9fb 100%)!important;border:1px solid #cdddf6!important;box-shadow:0 18px 44px -28px rgba(37,99,235,.45)!important}
/* header brand */
.side-head{background:linear-gradient(135deg,#d4e4fc 0,#bcd5f7 100%)!important;border-bottom:1px solid #c3d8f5!important}
.side-head h3{color:#122a55!important}
.side-head h3 i{background:rgba(37,99,235,.16)!important;color:#1d4ed8!important}
.side-head .muted{color:#46618f!important}
/* menu area */
.side-menu{background:transparent!important}
.side-menu a{color:#1e3a6e!important}
.side-menu a i{background:#d3e3fb!important;color:#2563eb!important}
.side-menu a:hover{background:#cfe0fb!important;color:#102a57!important}
.side-menu a:hover i{background:#b6d2f7!important;color:#1d4ed8!important}
.side-menu a.active{background:linear-gradient(90deg,#2563eb,#3b82f6)!important;color:#fff!important;box-shadow:0 6px 16px rgba(37,99,235,.32)!important}
.side-menu a.active i{background:#1d4ed8!important;color:#fff!important}
.side-menu .divider{background:rgba(15,40,90,.12)!important}
/* item "Ke Publik" (kedua dari bawah) -> normal biru; Logout (terakhir) -> merah */
.side-menu li:nth-last-child(2) a{color:#1e3a6e!important}
.side-menu li:nth-last-child(2) a:hover{background:#cfe0fb!important;color:#102a57!important}
.side-menu li:last-child a{color:#dc2626!important}
.side-menu li:last-child a i{background:rgba(220,38,38,.12)!important;color:#dc2626!important}
.side-menu li:last-child a:hover{background:rgba(220,38,38,.12)!important;color:#b91c1c!important}
/* scrollbar */
.side-menu::-webkit-scrollbar-track{background:rgba(37,99,235,.06)!important}
.side-menu::-webkit-scrollbar-thumb{background:rgba(37,99,235,.32)!important}

/* ====== THEME REFRESH (clean9): perbaiki kontras teks sidebar (nav-link & group-toggle) supaya terbaca di latar biru muda ====== */
.side-menu .nav-link,.side-menu a{color:#1e3a6e!important}
.side-menu .nav-link i,.side-menu a i{background:#d3e3fb!important;color:#2563eb!important}
.side-menu .nav-link:hover,.side-menu a:hover{background:#cfe0fb!important;color:#102a57!important}
.side-menu .nav-link:hover i,.side-menu a:hover i{background:#b6d2f7!important;color:#1d4ed8!important}
.side-menu .nav-link.active,.side-menu a.active{background:linear-gradient(90deg,#2563eb,#3b82f6)!important;color:#fff!important;box-shadow:0 6px 16px rgba(37,99,235,.32)!important}
.side-menu .nav-link.active i,.side-menu a.active i{background:#1d4ed8!important;color:#fff!important}
/* grup "Konten" dll */
.group-toggle{color:#1e3a6e!important}
.group-toggle .left{color:#1e3a6e!important}
.group-toggle .chev{color:#3b6fd4!important;opacity:.85}
.group-toggle:hover{background:#cfe0fb!important;color:#102a57!important}
.menu-group.open .group-toggle{background:#cfe0fb!important;color:#102a57!important}
.menu-group.open .group-toggle .left{color:#102a57!important}
/* logout tetap merah, item lain biru tua (versi nav-link) */
.side-menu li:last-child .nav-link,.side-menu li:last-child a{color:#dc2626!important}
.side-menu li:last-child .nav-link i,.side-menu li:last-child a i{background:rgba(220,38,38,.12)!important;color:#dc2626!important}



/* =============================================================
   FIX: Modal / form panjang bisa di-scroll ke bawah
   - Sebelumnya .modal .modal-panel{overflow:hidden} membuat form
     yang lebih tinggi dari layar terpotong & tombol Simpan tdk terlihat.
   - Aturan di bawah membatasi tinggi panel & mengaktifkan scroll vertikal
     pada SEMUA modal (berita, agenda, galeri, dll) tanpa mengubah tata letak.
   ============================================================= */
.modal{align-items:flex-start}
.modal .modal-panel{
  display:flex;
  flex-direction:column;
  max-height:calc(100vh - 36px)!important;
  overflow:hidden!important;
}
/* Header tetap di atas, isi form (body) yang bergulir */
.modal .modal-panel .modal-head{flex:0 0 auto}
.modal .modal-panel .modal-body{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
}

/* Kontras nama & jabatan struktur organisasi (override final) */
#soOrgChart .org-card{background:#ffffff !important;border:2px solid #d6e0f5 !important;box-shadow:0 4px 16px rgba(15,47,118,.10) !important}
#soOrgChart .org-card:hover{border-color:#1d56c9 !important;box-shadow:0 10px 28px rgba(29,86,201,.18) !important}
#soOrgChart .org-root>.org-card{background:#f4f8ff !important;border-color:#1d56c9 !important}
#soOrgChart .org-name{color:#0f2f76 !important;font-weight:900 !important;text-shadow:none !important;max-width:100% !important}
#soOrgChart .org-jabatan{color:#1d56c9 !important;background:rgba(29,86,201,.12) !important;border:1px solid rgba(29,86,201,.25) !important;font-weight:800 !important;white-space:normal !important;overflow:visible !important;text-overflow:clip !important;line-height:1.3 !important;max-width:100% !important;word-break:break-word !important}
#soOrgChart .org-photo{border-color:#1d56c9 !important;background:#eef4ff !important}
#soOrgChart .so-ph-icon{color:#9aa6bd !important}


/* ================================================================
   HOME PAGE FINAL OVERRIDES — tambahkan di akhir file
   ================================================================ */

/* 1. HERO BACKGROUND: pakai foto kelurahan + overlay biru teal */
body #app .home-page .home-hero,
body main .home-page .home-hero,
.home-page .home-hero {
  background-image: linear-gradient(90deg,rgba(3,78,96,.94) 0%,rgba(3,78,96,.80) 48%,rgba(3,78,96,.48) 100%), var(--kelurahan-bg) !important;
  background-size: cover !important;
  background-position: center !important;
  background-color: #034e60 !important;
}

/* 2. STAT CARDS — 4 warna berbeda (merah / kuning / biru / hijau) */
.home-page .home-stats {
  display: grid !important;
  grid-template-columns: repeat(4,1fr) !important;
  gap: 12px !important;
  width: 100% !important;
  margin-top: 20px !important;
}
@media(max-width:900px){ .home-page .home-stats{ grid-template-columns:repeat(2,1fr) !important; } }

.home-page .home-stats .stat-card { border-radius:14px !important; padding:12px 14px !important; border:none !important; }
.home-page .home-stats .stat-card:nth-child(1) { background:linear-gradient(135deg,#e53935,#b71c1c) !important; box-shadow:0 4px 16px rgba(229,57,53,.40) !important; }
.home-page .home-stats .stat-card:nth-child(2) { background:linear-gradient(135deg,#f9a825,#e65100) !important; box-shadow:0 4px 16px rgba(249,168,37,.40) !important; }
.home-page .home-stats .stat-card:nth-child(3) { background:linear-gradient(135deg,#1e88e5,#1565c0) !important; box-shadow:0 4px 16px rgba(30,136,229,.40) !important; }
.home-page .home-stats .stat-card:nth-child(4) { background:linear-gradient(135deg,#2e7d32,#1b5e20) !important; box-shadow:0 4px 16px rgba(46,125,50,.40) !important; }
.home-page .home-stats .stat-card .stat-icon { background:rgba(255,255,255,.22) !important; color:#fff !important; }
.home-page .home-stats .stat-card strong,
.home-page .home-stats .stat-card small,
.home-page .home-stats .stat-card span { color:#fff !important; text-shadow:0 1px 3px rgba(0,0,0,.25) !important; }

/* 3. OUTER CARDS — tetap BIRU (container utama) */
.home-card.home-pengumuman-card {
  background: radial-gradient(circle at 88% 14%,rgba(255,255,255,.18),transparent 28%),
              linear-gradient(135deg,#1d4ed8 0,#2563eb 60%,#3b82f6 100%) !important;
  color: #fff !important;
}
.home-card.home-galeri-card {
  background: radial-gradient(circle at 88% 14%,rgba(255,255,255,.20),transparent 28%),
              linear-gradient(135deg,#1e40af 0,#2f74dd 60%,#5e9bea 100%) !important;
  color: #fff !important;
}
.home-card.home-agenda-card,
.home-page .home-agenda-card {
  background: radial-gradient(circle at 86% 12%,rgba(37,99,235,.1),transparent 26%),
              linear-gradient(135deg,#0c4a6e 0,#1a52ad 100%) !important;
  color: #fff !important;
  border-color: transparent !important;
}
.panel-services {
  background: linear-gradient(145deg,#1e3a8a 0,#1d4ed8 100%) !important;
  border-radius: 18px !important;
  padding: 22px !important;
  border: 0 !important;
}
.panel-news {
  background: radial-gradient(circle at 88% 14%,rgba(255,255,255,.18),transparent 28%),
              linear-gradient(135deg,#172554 0,#1d4ed8 58%,#2563eb 100%) !important;
  border-radius: 18px !important;
  padding: 22px !important;
  border: 0 !important;
}
/* Judul & link-more di outer cards -> putih */
.panel-services .section-head h2,
.panel-news .section-head h2,
.home-card.home-pengumuman-card .section-head h2,
.home-card.home-galeri-card .section-head h2,
.home-card.home-agenda-card .section-head h2 { color:#fff !important; }
.panel-services .link-more,
.panel-news .link-more,
.home-card.home-pengumuman-card .link-more,
.home-card.home-galeri-card .link-more,
.home-card.home-agenda-card .link-more { color:rgba(255,255,255,.90) !important; }

/* 4. INNER: SERVICE CARDS — PUTIH */
.panel-services .service-card,
.home-page .service-card {
  background: #ffffff !important;
  border: 1px solid #e0e8f5 !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.07) !important;
  color: #1a1a2e !important;
  padding: 18px 14px 48px !important;
}
.panel-services .service-card h4,
.home-page .service-card h4 { color: #0d1b3e !important; font-size:13px !important; }
.panel-services .service-card p,
.home-page .service-card p  { color: #555 !important; font-size:12px !important; }
.panel-services .service-card .svc-icon,
.home-page .service-card .svc-icon { background:rgba(29,86,201,.10) !important; border:none !important; }
.panel-services .svc-icon--blue  { color:#2563eb !important; }
.panel-services .svc-icon--purple { color:#7c3aed !important; }
.panel-services .svc-icon--green  { color:#059669 !important; }
.panel-services .svc-icon--orange { color:#ea580c !important; }
.panel-services .service-card .svc-go,
.home-page .service-card .svc-go {
  background:#eff6ff !important; color:#1d56c9 !important;
  border:none !important;
  position:absolute !important; bottom:14px !important; left:14px !important;
}
.panel-services .service-card:hover .svc-go,
.home-page .service-card:hover .svc-go { background:#1d56c9 !important; color:#fff !important; }
.panel-services .service-card:hover,
.home-page .service-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.12) !important;
  border-color: #bfdbfe !important;
}

/* 5. INNER: PENGUMUMAN ITEMS — PUTIH */
.home-peng-item {
  background: #ffffff !important;
  border: 1px solid #e0e8f5 !important;
  border-radius: 10px !important;
  backdrop-filter: none !important;
}
.home-peng-title     { color: #0d1b3e !important; }
.home-peng-date      { color: #555    !important; }
.home-peng-arrow     { color: #1565c0 !important; }
.home-peng-badge     { background:rgba(29,86,201,.10) !important; color:#1565c0 !important; }
.home-peng-item:hover{ background: #f0f5ff !important; transform:translateX(3px) !important; }

/* 6. INNER: GALERI ITEMS — tetap natural (gambar/foto) */
.home-galeri-item {
  background: transparent !important;
  border: 2px solid rgba(255,255,255,.4) !important;
  border-radius: 10px !important;
}
.home-galeri-caption { color:#fff !important; }

/* 7. INNER: BERITA/NEWS LIST — PUTIH */
.home-news-list {
  background: #ffffff !important;
  border: 1px solid #e0e8f5 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.home-news-item {
  background: #ffffff !important;
  border-bottom: 1px solid #edf2fb !important;
  border-left: none !important;
}
.home-news-item:nth-child(1),
.home-news-item:nth-child(2),
.home-news-item:nth-child(3),
.home-news-item:nth-child(4) { border-left: none !important; }
.home-news-item:hover { background: #f8faff !important; }
.home-news-item.active { background: #eff6ff !important; border-left: 3px solid #1d56c9 !important; }
.hni-title  { color: #0d1b3e !important; }
.hni-cat    { color: #1565c0 !important; background: rgba(21,101,192,.10) !important; }
.hni-date   { color: #666 !important; }

/* 8. INNER: AGENDA ROWS — PUTIH */
.home-page .home-agenda-card .agenda-row,
.home-page .home-agenda-card .agenda-list .agenda-row {
  background: #ffffff !important;
  border: 1px solid #e0e8f5 !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.06) !important;
  color: #1a1a2e !important;
  padding: 11px 12px !important;
}
.home-page .home-agenda-card .agenda-title   { color: #0d1b3e !important; }
.home-page .home-agenda-card .agenda-detail  { color: #555 !important; }
.home-page .home-agenda-card .agenda-detail i { color: #1565c0 !important; }
.home-page .home-agenda-card .agenda-date-box {
  background: linear-gradient(135deg,#2563eb,#2f74dd) !important;
  color: #fff !important;
}
.home-page .home-agenda-card .adb-day { color:#fff !important; }
.home-page .home-agenda-card .adb-mon  { color:rgba(255,255,255,.88) !important; }

/* 9. CTA SECTION — PUTIH */
#heroGuestCta,
.home-cta {
  background: #ffffff !important;
  color: #0d1b3e !important;
  border: 1px solid #e0e8f5 !important;
  border-radius: 16px !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.07) !important;
}
.home-cta h3 { color: #0d1b3e !important; }
.home-cta p  { color: #555 !important; opacity:1 !important; }

/* 10. BUTTONS — BIRU, ICON ONLY */
/* Semua btn -> biru */
.hero-actions .btn-light,
.hero-actions .btn-outline,
.cta-actions .btn,
.cta-actions .btn-primary,
.cta-actions .btn-secondary {
  background: #1565c0 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(21,101,192,.30) !important;
}
/* Icon-only: sembunyikan teks */
.hero-actions .btn-light,
.hero-actions .btn-outline,
.cta-actions .btn,
.cta-actions .btn-primary,
.cta-actions .btn-secondary,
.section-head .link-more,
.galeri-more-btn .btn,
.peng-more-btn .btn {
  font-size: 0 !important;
  padding: 10px 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}
.hero-actions .btn-light i,
.hero-actions .btn-outline i,
.cta-actions .btn i,
.cta-actions .btn-primary i,
.cta-actions .btn-secondary i,
.section-head .link-more i,
.galeri-more-btn .btn i,
.peng-more-btn .btn i {
  font-size: 16px !important;
  color: #fff !important;
  display: inline-block !important;
}
/* link-more biru */
.section-head .link-more {
  background: #1565c0 !important;
  color: #fff !important;
  border-radius: 8px !important;
  border: none !important;
}
/* galeri/peng more btn */
.galeri-more-btn .btn,
.peng-more-btn .btn {
  background: #1565c0 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  margin-top: 14px !important;
}
/* Jarak button dari konten */
.hero-actions { gap:12px !important; margin-bottom:20px !important; }
.cta-actions  { gap:14px !important; margin-top:20px !important; justify-content:center !important; }
.section-head { gap:10px !important; margin-bottom:14px !important; }

/* =====================================================================
   HOME OVERRIDE v20260704c — sesuai referensi gambar
   (ditambahkan di akhir agar override rule-rule di atas)
   ===================================================================== */

/* 1. HERO — sembunyikan stat cards di dalam hero (dipindah ke stat-row) */
.home-page .home-hero .home-stats { display:none !important; }

/* 2. STAT ROW — 4 kartu di bawah hero */
.home-stats-row {
  background: #f4f7fd;
  padding: 0 0 8px;
  margin-top: -2px;
}
.home-stats-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 16px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px 24px 10px;
  box-sizing: border-box;
}
@media(max-width:860px){ .home-stats-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:480px){ .home-stats-grid{ grid-template-columns:1fr; } }
.home-stats-grid .stat-card {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  border-radius: 12px !important;
  padding: 16px 20px !important;
  border: none !important;
  color: #fff !important;
}
.home-stats-grid .stat-card .stat-icon {
  width: 48px !important; height: 48px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  background: rgba(255,255,255,.22) !important;
  border-radius: 50% !important;
  font-size: 1.3rem !important;
  color: #fff !important;
  flex-shrink: 0 !important;
}
.home-stats-grid .stat-card .stat-text { display:flex !important; flex-direction:column !important; }
.home-stats-grid .stat-card .stat-text strong { font-size:1.5rem !important; font-weight:700 !important; color:#fff !important; line-height:1.1 !important; }
.home-stats-grid .stat-card .stat-text small  { font-size:.78rem !important; color:rgba(255,255,255,.85) !important; }
.stat-card--layanan { background:linear-gradient(135deg,#0ea5e9,#0369a1) !important; box-shadow:0 4px 16px rgba(14,165,233,.35) !important; }
.stat-card--surat   { background:linear-gradient(135deg,#14b8a6,#0f766e) !important; box-shadow:0 4px 16px rgba(20,184,166,.35) !important; }
.stat-card--warga   { background:linear-gradient(135deg,#3b82f6,#1d4ed8) !important; box-shadow:0 4px 16px rgba(59,130,246,.35) !important; }
.stat-card--rtrw    { background:linear-gradient(135deg,#6366f1,#4338ca) !important; box-shadow:0 4px 16px rgba(99,102,241,.35) !important; }

/* 3. HOME BODY — background abu muda */
.home-page .home-body {
  background: #f4f7fd !important;
  padding: 16px 0 32px !important;
}

/* 4. PANEL SERVICES — putih */
.home-page .panel-services,
.panel-services {
  background: #fff !important;
  border: 1px solid #e8edf5 !important;
  border-radius: 16px !important;
  padding: 22px !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.07) !important;
  color: #1e293b !important;
}
.panel-services .section-head h2,
.panel-services .section-head h3  { color:#1e293b !important; text-shadow:none !important; }
.panel-services .link-more {
  color: #2563eb !important;
  background: transparent !important;
  border: 1px solid #2563eb !important;
  border-radius: 6px !important;
  padding: 4px 12px !important;
  font-size: 0 !important;
}
.panel-services .link-more i { font-size:14px !important; color:#2563eb !important; }

/* 5. SERVICE CARDS — putih dengan border */
.panel-services .service-card,
.home-page .service-card {
  background: #f8faff !important;
  border: 1.5px solid #e0e7ff !important;
  border-radius: 12px !important;
  color: #1e293b !important;
  box-shadow: 0 2px 8px rgba(30,64,175,.08) !important;
  padding: 18px 14px 48px !important;
  position: relative !important;
  overflow: hidden !important;
  transition: transform .2s, box-shadow .2s !important;
}
.panel-services .service-card h4,
.home-page .service-card h4 { color:#1e293b !important; font-size:13px !important; font-weight:700 !important; }
.panel-services .service-card p,
.home-page .service-card p  { color:#64748b !important; font-size:12px !important; }
.panel-services .service-card .svc-icon,
.home-page .service-card .svc-icon { background:rgba(29,86,201,.10) !important; border:none !important; }
.panel-services .svc-icon--blue   { color:#2563eb !important; background:#dbeafe !important; }
.panel-services .svc-icon--purple { color:#7c3aed !important; background:#ede9fe !important; }
.panel-services .svc-icon--green  { color:#16a34a !important; background:#dcfce7 !important; }
.panel-services .svc-icon--orange { color:#ea580c !important; background:#ffedd5 !important; }
.panel-services .service-card .svc-go,
.home-page .service-card .svc-go {
  background: #2563eb !important; color: #fff !important; border: none !important;
  position: absolute !important; bottom: 14px !important; left: 14px !important;
  width: 30px !important; height: 30px !important; border-radius: 50% !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
}
.panel-services .service-card:hover,
.home-page .service-card:hover {
  background: #eff6ff !important;
  border-color: #3b82f6 !important;
  box-shadow: 0 4px 16px rgba(59,130,246,.18) !important;
  transform: translateY(-4px) !important;
}
.panel-services .service-card:hover .svc-go,
.home-page .service-card:hover .svc-go { background:#1d4ed8 !important; }

/* 6. SEMUA OUTER CARDS — putih */
.home-page .panel-news,
.panel-news,
.home-page .home-card,
.home-page .home-agenda-card,
.home-page .home-galeri-card,
.home-page .home-pengumuman-card,
.home-page .home-visimisi-card,
.home-page .home-staf-card {
  background: #fff !important;
  border: 1px solid #e8edf5 !important;
  border-radius: 16px !important;
  padding: 22px !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.07) !important;
  color: #1e293b !important;
}
.home-page .home-card h2, .home-page .home-card h3, .home-page .home-card h4,
.panel-news .section-head h2, .panel-news .section-head h3,
.home-page .home-agenda-card .section-head h2,
.home-page .home-galeri-card .section-head h2,
.home-page .home-pengumuman-card .section-head h2 { color:#1e293b !important; text-shadow:none !important; }
.home-page .home-card .link-more,
.panel-news .link-more {
  color: #2563eb !important; background: transparent !important;
  border: 1px solid #2563eb !important; border-radius: 6px !important;
  padding: 4px 12px !important; font-size: 0 !important;
}
.home-page .home-card .link-more i, .panel-news .link-more i { font-size:14px !important; color:#2563eb !important; }

/* 7. PENGUMUMAN ITEMS */
.home-peng-item {
  background: #f8faff !important;
  border: 1px solid #e0e7ff !important;
  border-radius: 10px !important;
}
.home-peng-title  { color:#1e293b !important; font-weight:700 !important; }
.home-peng-date   { color:#64748b !important; }
.home-peng-arrow  { color:#2563eb !important; }
.home-peng-badge  { background:#dbeafe !important; color:#1d4ed8 !important; }
.home-peng-item:hover { background:#eff6ff !important; transform:translateX(3px) !important; }
.galeri-more-btn .btn, .peng-more-btn .btn {
  background: #2563eb !important; color: #fff !important;
  border: none !important; border-radius: 8px !important;
  font-size: 0 !important; padding: 9px 14px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
}
.galeri-more-btn .btn i, .peng-more-btn .btn i { font-size:15px !important; color:#fff !important; }
.galeri-more-btn .btn:hover, .peng-more-btn .btn:hover { background:#1d4ed8 !important; }

/* 8. GALERI ITEMS */
.home-galeri-item {
  border: 2px solid #e0e7ff !important;
  border-radius: 10px !important; overflow: hidden !important;
}
.home-galeri-caption { color:#64748b !important; }

/* 9. NEWS ITEMS */
.home-news-list {
  background: #f8faff !important;
  border: 1px solid #e0e7ff !important;
  border-radius: 12px !important; overflow: hidden !important;
}
.home-news-item { background: transparent !important; border-bottom: 1px solid #e0e7ff !important; }
.home-news-item:hover  { background:#eff6ff !important; }
.home-news-item.active { background:#eff6ff !important; border-left:3px solid #2563eb !important; }
.home-news-item:nth-child(1) { border-left-color: #e0e7ff !important; }
.home-news-item:nth-child(2) { border-left-color: #e0e7ff !important; }
.home-news-item:nth-child(3) { border-left-color: #e0e7ff !important; }
.home-news-item:nth-child(4) { border-left-color: #e0e7ff !important; }
.hni-title { color:#1e293b !important; font-weight:700 !important; }
.hni-date  { color:#64748b !important; }
.hni-cat   { color:#2563eb !important; background:#dbeafe !important; }
.hni-thumb-empty { background:linear-gradient(135deg,#dbeafe,#ede9fe) !important; color:#2563eb !important; }

/* 10. AGENDA ITEMS */
.home-page .home-agenda-card .agenda-row {
  background: #f8faff !important;
  border: 1px solid #e0e7ff !important;
  border-radius: 12px !important;
  color: #1e293b !important;
  padding: 11px 12px !important;
}
.home-page .home-agenda-card .agenda-title  { color:#1e293b !important; font-weight:700 !important; }
.home-page .home-agenda-card .agenda-detail { color:#64748b !important; }
.home-page .home-agenda-card .agenda-detail i { color:#2563eb !important; }
.home-page .home-agenda-card .agenda-date-box {
  background: #2563eb !important; color:#fff !important; border-radius:10px !important;
  border: none !important; box-shadow: none !important;
}
.home-page .home-agenda-card .adb-day { color:#fff !important; }
.home-page .home-agenda-card .adb-mon { color:rgba(255,255,255,.85) !important; }
.home-page .home-agenda-card .agenda-row:hover { background:#eff6ff !important; transform:translateY(-1px) !important; }

/* 11. FEATURES STRIP — inline di dalam home-body, SEMBUNYIKAN yang lama */
/* .home-page > .home-features — rule dihapus */
.home-features--inline {
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 16px;
  margin-bottom: 16px;
  padding: 20px 24px;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.home-features--inline .features-inner {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 16px;
}
@media(max-width:860px){ .home-features--inline .features-inner{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:480px){ .home-features--inline .features-inner{ grid-template-columns:1fr; } }
.home-features--inline .feature-item { display:flex; align-items:flex-start; gap:12px; }
.home-features--inline .feature-item h4 { color:#1e293b; font-size:.92rem; margin:0 0 2px; }
.home-features--inline .feature-item p  { color:#64748b; font-size:.80rem; margin:0; }
.home-features--inline .feature-icon {
  width:40px; height:40px;
  display:flex; align-items:center; justify-content:center;
  border-radius:10px; font-size:1.1rem; flex-shrink:0;
}
.home-features--inline .feature-icon--blue   { background:#dbeafe; color:#2563eb; }
.home-features--inline .feature-icon--green  { background:#dcfce7; color:#16a34a; }
.home-features--inline .feature-icon--purple { background:#ede9fe; color:#7c3aed; }
.home-features--inline .feature-icon--orange { background:#ffedd5; color:#ea580c; }

/* 12. CTA — putih */
#heroGuestCta, .home-cta {
  background: #fff !important; color:#0d1b3e !important;
  border: 1px solid #e0e8f5 !important; border-radius:16px !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.07) !important;
}
.home-cta h3 { color:#0d1b3e !important; }
.home-cta p  { color:#555 !important; opacity:1 !important; }
.cta-actions .btn {
  background: #2563eb !important; color:#fff !important; border:none !important;
  border-radius:8px !important; font-size:0 !important;
  padding:10px 14px !important; display:inline-flex !important;
  align-items:center !important; justify-content:center !important;
}
.cta-actions .btn i { font-size:16px !important; color:#fff !important; }

/* 13. DUO ROW & PANELS LAYOUT */
.home-duo-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
}
@media(max-width:768px){ .home-duo-row{ grid-template-columns:1fr !important; } }
.home-panels--full { margin-bottom:16px !important; }

/* 14. VISI MISI — teks gelap */
.home-page .home-visimisi-card h2,
.home-page .home-visimisi-card h3,
.home-page .home-visimisi-card h4   { color:#1e293b !important; }
.home-page .home-visimisi-card .visimisi-misi h4 { color:#16a34a !important; }
.home-page .home-visimisi-card .visimisi-visi h4 { color:#2563eb !important; }
.home-page .home-visimisi-card #homeVisiText {
  background:#f0f7ff !important; border-left:3px solid #2563eb !important; color:#1e293b !important;
}
.home-page .home-visimisi-card .visimisi-misi-list li { color:#374151 !important; }
.home-page .home-visimisi-card .visimisi-misi-list li i { color:#16a34a !important; }

/* 15. SECTION-HEAD LINK-MORE global — outline biru */
.section-head .link-more {
  font-size: 0 !important;
  padding: 7px 10px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #2563eb !important;
  border: 1px solid #2563eb !important;
}
.section-head .link-more i { font-size:14px !important; color:#2563eb !important; }

/* =====================================================================
   FINAL FIX v20260704d — fix font readability, full-width layanan, CTA guest
   ===================================================================== */

/* ── 1. LAYANAN KAMI: FULL WIDTH (reset grid ke 1 kolom) ── */
.home-page .home-panels--full,
.home-panels--full {
  display: block !important;
  grid-template-columns: none !important;
  max-width: 1200px !important;
  margin: 0 auto 16px !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}
.home-page .home-panels--full .panel-services,
.home-panels--full .panel-services {
  width: 100% !important;
  max-width: 100% !important;
}

/* service-grid: 4 kolom di panel layanan kami */
.home-panels--full .service-grid,
.panel-services .service-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 14px !important;
  margin-top: 16px !important;
}
@media (max-width: 860px) {
  .home-panels--full .service-grid,
  .panel-services .service-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 480px) {
  .home-panels--full .service-grid,
  .panel-services .service-grid {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* ── 2. DUO ROW: juga di dalam container ── */
.home-page .home-duo-row,
.home-duo-row {
  max-width: 1200px !important;
  margin: 0 auto 16px !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
}
@media (max-width: 860px) {
  .home-page .home-duo-row,
  .home-duo-row {
    grid-template-columns: 1fr !important;
  }
}

/* ── 3. HOME BODY WRAPPER ── */
.home-page .home-body {
  max-width: none !important;
  padding: 16px 0 32px !important;
  background: #f2f6fc !important;
}

/* ── 4. PANEL SERVICES: putih, teks gelap, terbaca ── */
.home-panels--full .panel-services {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  padding: 22px !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.06) !important;
  color: #0f172a !important;
}
.home-panels--full .panel-services .section-head h2 {
  color: #0f172a !important;
  text-shadow: none !important;
  font-size: 20px !important;
  font-weight: 900 !important;
}
.home-panels--full .panel-services .section-head h2::after {
  background: #2563eb !important;
}
.home-panels--full .panel-services .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  border-radius: 999px !important;
  font-size: inherit !important;
  padding: 6px 14px !important;
  font-weight: 700 !important;
}
.home-panels--full .panel-services .link-more i {
  font-size: 12px !important;
  color: #2563eb !important;
}

/* ── 5. SERVICE CARDS: putih terang, teks terbaca ── */
.home-panels--full .service-card {
  background: #f8faff !important;
  border: 1.5px solid #e0e7ff !important;
  border-radius: 14px !important;
  color: #0f172a !important;
  box-shadow: 0 2px 10px rgba(37,99,235,.08) !important;
  padding: 18px 14px 50px !important;
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.home-panels--full .service-card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 3px !important;
  background: #2563eb !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .2s !important;
}
.home-panels--full .service-card:hover::before {
  transform: scaleX(1) !important;
}
.home-panels--full .service-card h4 {
  color: #0f172a !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  margin: 0 !important;
}
.home-panels--full .service-card p {
  color: #64748b !important;
  font-size: 12px !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}
.home-panels--full .service-card .svc-icon {
  border: none !important;
  font-size: 20px !important;
  width: 44px !important; height: 44px !important;
  border-radius: 12px !important;
  flex-shrink: 0 !important;
}
.home-panels--full .service-card .svc-icon.svc-icon--blue   { background: #dbeafe !important; color: #2563eb !important; }
.home-panels--full .service-card .svc-icon.svc-icon--purple { background: #ede9fe !important; color: #7c3aed !important; }
.home-panels--full .service-card .svc-icon.svc-icon--green  { background: #dcfce7 !important; color: #16a34a !important; }
.home-panels--full .service-card .svc-icon.svc-icon--orange { background: #ffedd5 !important; color: #ea580c !important; }
.home-panels--full .service-card .svc-go {
  position: absolute !important; bottom: 14px !important; left: 14px !important;
  width: 30px !important; height: 30px !important;
  border-radius: 50% !important;
  background: #eff6ff !important; color: #2563eb !important;
  border: none !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: 12px !important;
  transition: background .2s, color .2s !important;
}
.home-panels--full .service-card:hover {
  border-color: #93c5fd !important;
  background: #eff6ff !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 6px 20px rgba(37,99,235,.14) !important;
}
.home-panels--full .service-card:hover .svc-go {
  background: #2563eb !important; color: #fff !important;
}

/* ── 6. DUO CARDS: semua putih teks terbaca ── */
.home-duo-row .home-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  padding: 22px !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.06) !important;
  color: #0f172a !important;
}
.home-duo-row .home-card .section-head h2 {
  color: #0f172a !important;
  font-size: 19px !important; font-weight: 900 !important;
  text-shadow: none !important;
}
.home-duo-row .home-card .section-head h2::after {
  background: #2563eb !important;
}
.home-duo-row .home-card .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-size: 13px !important; font-weight: 700 !important;
}
.home-duo-row .home-card .link-more i { color: #2563eb !important; font-size: 12px !important; }

/* Pengumuman card: hijau ── */
.home-duo-row .home-pengumuman-card {
  background: linear-gradient(135deg,#065f46 0,#059669 62%,#34d399 100%) !important;
  color: #fff !important;
}
.home-duo-row .home-pengumuman-card .section-head h2 {
  color: #fff !important;
}
.home-duo-row .home-pengumuman-card .link-more {
  color: rgba(255,255,255,.9) !important;
  background: rgba(255,255,255,.18) !important;
  border: 1px solid rgba(255,255,255,.3) !important;
}
.home-duo-row .home-pengumuman-card .link-more i { color: #fff !important; }

/* Panel news: biru gelap ── */
.home-duo-row .panel-news {
  background: linear-gradient(135deg,#172554 0,#1d4ed8 58%,#2563eb 100%) !important;
  color: #fff !important;
  border: none !important;
}
.home-duo-row .panel-news .section-head h2 {
  color: #fff !important; text-shadow: none !important;
}
.home-duo-row .panel-news .link-more {
  color: #c4b5fd !important;
  background: rgba(255,255,255,.14) !important;
  border: 1px solid rgba(255,255,255,.2) !important;
}
.home-duo-row .panel-news .link-more i { color: #c4b5fd !important; }
.home-duo-row .home-news-item { border-bottom: 1px solid rgba(255,255,255,.1) !important; }
.home-duo-row .home-news-item:hover { background: rgba(255,255,255,.1) !important; }
.home-duo-row .hni-title { color: #f1f5f9 !important; }
.home-duo-row .hni-date  { color: rgba(255,255,255,.55) !important; }

/* Galeri: orange/amber */
.home-duo-row .home-galeri-card {
  background: linear-gradient(135deg,#b45309 0,#f59e0b 62%,#fcd34d 100%) !important;
  color: #fff !important;
}
.home-duo-row .home-galeri-card .section-head h2 { color: #fff !important; }
.home-duo-row .home-galeri-card .link-more {
  color: rgba(255,255,255,.9) !important;
  background: rgba(255,255,255,.2) !important;
  border: 1px solid rgba(255,255,255,.3) !important;
}
.home-duo-row .home-galeri-card .link-more i { color: #fff !important; }

/* Agenda: putih bersih */
.home-duo-row .home-agenda-card {
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e2e8f0 !important;
}
.home-duo-row .home-agenda-card .section-head h2 {
  color: #0f172a !important; text-shadow: none !important;
}
.home-duo-row .home-agenda-card .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
}
.home-duo-row .home-agenda-card .link-more i { color: #2563eb !important; }
.home-duo-row .home-agenda-card .agenda-title { color: #0f172a !important; font-weight: 800 !important; }
.home-duo-row .home-agenda-card .agenda-detail { color: #64748b !important; }
.home-duo-row .home-agenda-card .agenda-detail i { color: #2563eb !important; }
.home-duo-row .home-agenda-card .agenda-date-box {
  background: linear-gradient(135deg,#2563eb,#2f74dd) !important;
  border: none !important; box-shadow: none !important;
}
.home-duo-row .home-agenda-card .adb-day { color: #fff !important; }
.home-duo-row .home-agenda-card .adb-mon  { color: rgba(255,255,255,.85) !important; }
.home-duo-row .home-agenda-card .agenda-row {
  border-bottom: 1px solid #e8edf5 !important;
  padding: 10px 0 !important;
}
.home-duo-row .home-agenda-card .agenda-row:last-child { border-bottom: none !important; }
.home-duo-row .home-agenda-card .agenda-row:hover {
  background: #f0f7ff !important;
  border-radius: 10px !important;
  padding-left: 8px !important; padding-right: 8px !important;
}

/* ── 7. FEATURES STRIP ── */
.home-features--inline {
  max-width: 1200px !important;
  margin: 0 auto 16px !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}
.home-features--inline > * {
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  padding: 20px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.05) !important;
}
.home-features--inline .feature-item h4 { color: #0f172a !important; }
.home-features--inline .feature-item p  { color: #64748b !important; }
.home-features--inline .feature-icon--blue   { background: #dbeafe !important; color: #2563eb !important; }
.home-features--inline .feature-icon--green  { background: #dcfce7 !important; color: #16a34a !important; }
.home-features--inline .feature-icon--purple { background: #ede9fe !important; color: #7c3aed !important; }
.home-features--inline .feature-icon--orange { background: #ffedd5 !important; color: #ea580c !important; }

/* ── 8. CTA GUEST (konten bawah saat belum login) ── */
#heroGuestCta,
.home-cta,
.home-page .home-cta {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-width: 1200px !important;
  margin: 0 auto 16px !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.home-cta .cta-content,
#heroGuestCta .cta-content {
  background: linear-gradient(135deg,#0f172a 0,#1e3a8a 60%,#2563eb 100%) !important;
  border-radius: 20px !important;
  padding: 32px 40px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  box-shadow: 0 8px 32px rgba(37,99,235,.25) !important;
}
@media (max-width: 640px) {
  .home-cta .cta-content, #heroGuestCta .cta-content {
    flex-direction: column !important;
    padding: 24px 20px !important;
    text-align: center !important;
  }
}
.home-cta .cta-text, #heroGuestCta .cta-text {
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 4px rgba(0,0,0,.2) !important;
}
.home-cta .cta-text p,
.home-cta p,
#heroGuestCta p {
  color: rgba(255,255,255,.82) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  margin-top: 6px !important;
  opacity: 1 !important;
}
.home-cta h3, #heroGuestCta h3 {
  color: #fff !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  margin-bottom: 8px !important;
}
.home-cta .cta-btn, #heroGuestCta .cta-btn,
.home-cta .cta-actions .btn, #heroGuestCta .cta-actions .btn {
  background: #fbbf24 !important;
  color: #082f49 !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 13px 24px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: background .2s, transform .15s !important;
}
.home-cta .cta-btn:hover, #heroGuestCta .cta-btn:hover,
.home-cta .cta-actions .btn:hover, #heroGuestCta .cta-actions .btn:hover {
  background: #f59e0b !important;
  transform: translateY(-2px) !important;
}
.home-cta .cta-btn i, #heroGuestCta .cta-btn i,
.home-cta .cta-actions .btn i, #heroGuestCta .cta-actions .btn i {
  font-size: 15px !important;
  color: #082f49 !important;
}

/* CTA fallback jika tidak ada .cta-content ── */
#heroGuestCta:not(:has(.cta-content)),
.home-cta:not(:has(.cta-content)) {
  background: linear-gradient(135deg,#0f172a,#1e3a8a) !important;
  border-radius: 20px !important;
  padding: 28px 32px !important;
  text-align: center !important;
  border: none !important;
  box-shadow: 0 8px 32px rgba(37,99,235,.25) !important;
}

/* ── 9. STAT CARDS BAWAH HERO ── */
.home-stats-row {
  background: #f2f6fc !important;
}
.home-stats-grid {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 16px 24px 8px !important;
}

/* ── 10. SECTION HEAD global di home ── */
.home-page .section-head h2 {
  font-size: 19px !important;
  font-weight: 900 !important;
}
.home-page .panel-services .section-head h2,
.home-page .panel-news .section-head h2 {
  font-size: 19px !important;
}

/* =====================================================================
   WHITE FIX v20260704e — semua section home jadi putih bersih
   ===================================================================== */

/* Reset semua home card jadi putih */
.home-duo-row .home-card,
.home-duo-row .home-pengumuman-card,
.home-duo-row .home-galeri-card,
.home-duo-row .home-agenda-card,
.home-duo-row .home-visimisi-card,
.home-duo-row .panel-news,
.home-duo-row .panel-services,
.home-card.home-pengumuman-card,
.home-card.home-galeri-card,
.home-card.home-visimisi-card,
.home-card.home-staf-card,
.panel-news,
.panel-services {
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.06) !important;
  border-radius: 16px !important;
}

/* Semua heading di home card putih */
.home-duo-row .home-card .section-head h2,
.home-duo-row .home-card h2,
.home-duo-row .home-card h3,
.home-duo-row .home-card h4,
.home-duo-row .home-card p,
.home-duo-row .home-card span,
.home-duo-row .home-card small,
.home-card.home-pengumuman-card .section-head h2,
.home-card.home-pengumuman-card *,
.home-card.home-galeri-card .section-head h2,
.home-card.home-galeri-card *,
.home-card.home-visimisi-card .section-head h2,
.home-card.home-staf-card .section-head h2,
.panel-news .section-head h2,
.panel-news h2, .panel-news h3, .panel-news h4,
.panel-news p, .panel-news small, .panel-news span {
  color: #0f172a !important;
  text-shadow: none !important;
}

/* link-more di semua home card */
.home-duo-row .home-card .link-more,
.home-card.home-pengumuman-card .link-more,
.home-card.home-galeri-card .link-more,
.home-card.home-visimisi-card .link-more,
.home-card.home-staf-card .link-more,
.panel-news .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-weight: 700 !important;
}
.home-duo-row .home-card .link-more i,
.home-card.home-pengumuman-card .link-more i,
.home-card.home-galeri-card .link-more i,
.panel-news .link-more i {
  color: #2563eb !important;
}

/* section head h2 accent line */
.home-duo-row .home-card .section-head h2::after,
.panel-news .section-head h2::after {
  background: #2563eb !important;
}

/* Pengumuman items jadi putih */
.home-peng-item {
  background: #f8faff !important;
  border: 1px solid #e0e7ff !important;
  border-radius: 10px !important;
}
.home-peng-item:hover {
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
}
.home-peng-title { color: #0f172a !important; }
.home-peng-date  { color: #64748b !important; }
.home-peng-badge { background: rgba(37,99,235,.1) !important; color: #1e3a8a !important; }
.home-peng-arrow { color: #94a3b8 !important; }

/* Peng more btn */
.peng-more-btn .btn,
.galeri-more-btn .btn {
  background: rgba(37,99,235,.08) !important;
  color: #2563eb !important;
  border: 1.5px solid rgba(37,99,235,.2) !important;
  font-weight: 800 !important;
}
.peng-more-btn .btn:hover,
.galeri-more-btn .btn:hover {
  background: rgba(37,99,235,.15) !important;
}

/* Galeri item */
.home-galeri-item {
  background: #f0f4ff !important;
  border: 1px solid #e0e7ff !important;
}
.home-galeri-caption { color: #fff !important; }

/* News items */
.home-news-list {
  background: #f8faff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
}
.home-news-item {
  border-bottom: 1px solid #f0f4ff !important;
}
.home-news-item:hover { background: #f0f6ff !important; }
.home-news-item.active { background: #eff6ff !important; border-left: 3px solid #2563eb !important; }
.hni-title { color: #0f172a !important; }
.hni-date  { color: #64748b !important; }
.hni-cat   { color: #2563eb !important; background: #dbeafe !important; }

/* Staf card jadi putih */
.home-card.home-staf-card {
  background: #ffffff !important;
  color: #0f172a !important;
}
.home-card.home-staf-card .section-head h2 { color: #0f172a !important; }
.staf-card {
  background: #f8faff !important;
  border: 1px solid #e0e7ff !important;
  border-radius: 12px !important;
  backdrop-filter: none !important;
}
.staf-nama     { color: #0f172a !important; }
.staf-jabatan  { color: #64748b !important; }
.staf-photo {
  background: #e0e7ff !important;
  border: 3px solid #bfdbfe !important;
}
.staf-nav {
  background: rgba(37,99,235,.12) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  color: #2563eb !important;
}
.staf-dot { background: rgba(37,99,235,.25) !important; }
.staf-dot.active { background: #2563eb !important; }

/* Visimisi card jadi putih */
.home-card.home-visimisi-card {
  background: #ffffff !important;
  color: #0f172a !important;
}
.home-card.home-visimisi-card * {
  color: #0f172a !important;
  text-shadow: none !important;
}
.home-card.home-visimisi-card .visimisi-misi h4 { color: #059669 !important; }
.home-card.home-visimisi-card .visimisi-visi h4 { color: #2563eb !important; }
#homeVisiText {
  color: #334155 !important;
  background: #f0f7ff !important;
  border-left: 3px solid #2563eb !important;
  font-style: italic !important;
}
.visimisi-misi-list li { color: #334155 !important; }
.visimisi-misi-list li i { color: #059669 !important; }

/* Panel news */
.panel-news {
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e2e8f0 !important;
}
.panel-news .section-head h2 { color: #0f172a !important; }
.panel-news .section-head h2::after { background: #2563eb !important; }
.panel-news .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.18) !important;
}
.panel-news .link-more i { color: #2563eb !important; }

/* Panel services */
.panel-services {
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e2e8f0 !important;
}
.panel-services .section-head h2 { color: #0f172a !important; }
.panel-services .section-head h2::after { background: #2563eb !important; }
.panel-services .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.18) !important;
}
.panel-services .link-more i { color: #2563eb !important; }

/* Service cards dalam panel services jadi putih */
.panel-services .service-card,
.home-panels--full .panel-services .service-card,
.home-page .panel-services .service-card,
.home-page .service-card {
  background: #f8faff !important;
  border: 1.5px solid #e0e7ff !important;
  color: #0f172a !important;
  box-shadow: 0 1px 6px rgba(37,99,235,.07) !important;
}
.panel-services .service-card h4,
.home-panels--full .panel-services .service-card h4,
.home-page .service-card h4 {
  color: #0f172a !important;
}
.panel-services .service-card p,
.home-panels--full .panel-services .service-card p,
.home-page .service-card p {
  color: #64748b !important;
}
.panel-services .service-card:hover,
.home-page .service-card:hover {
  background: #eff6ff !important;
  border-color: #93c5fd !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 6px 20px rgba(37,99,235,.12) !important;
}
.panel-services .svc-icon--blue,
.home-page .service-card .svc-icon.svc-icon--blue { background: #dbeafe !important; color: #2563eb !important; box-shadow: none !important; }
.panel-services .svc-icon--purple,
.home-page .service-card .svc-icon.svc-icon--purple { background: #ede9fe !important; color: #7c3aed !important; box-shadow: none !important; }
.panel-services .svc-icon--green,
.home-page .service-card .svc-icon.svc-icon--green { background: #dcfce7 !important; color: #16a34a !important; box-shadow: none !important; }
.panel-services .svc-icon--orange,
.home-page .service-card .svc-icon.svc-icon--orange { background: #ffedd5 !important; color: #ea580c !important; box-shadow: none !important; }
.panel-services .svc-go,
.home-page .service-card .svc-go {
  background: #eff6ff !important;
  color: #2563eb !important;
  border: none !important;
  box-shadow: none !important;
}
.panel-services .service-card:hover .svc-go,
.home-page .service-card:hover .svc-go {
  background: #2563eb !important;
  color: #fff !important;
}

/* Agenda card putih */
.home-duo-row .home-agenda-card,
.home-card.home-agenda-card,
.home-page .home-agenda-card {
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e2e8f0 !important;
}
.home-agenda-card .section-head h2 { color: #0f172a !important; }
.home-agenda-card .agenda-title    { color: #0f172a !important; font-weight: 800 !important; }
.home-agenda-card .agenda-detail   { color: #64748b !important; }
.home-agenda-card .agenda-detail i { color: #2563eb !important; }
.home-agenda-card .agenda-empty    { color: #94a3b8 !important; }
.home-agenda-card .agenda-date-box {
  background: linear-gradient(135deg,#2563eb,#2f74dd) !important;
  border: none !important; box-shadow: none !important;
}
.home-agenda-card .adb-day { color: #fff !important; }
.home-agenda-card .adb-mon { color: rgba(255,255,255,.85) !important; }
.home-agenda-card .agenda-row {
  border-bottom: 1px solid #f1f5f9 !important;
}
.home-agenda-card .agenda-row:hover {
  background: #f8faff !important;
  border-radius: 8px !important;
}

/* Features strip putih */
.home-features-inner,
.home-features--inline > * {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 1px 8px rgba(0,0,0,.04) !important;
}
.feature-item h4, .home-features-inner .feature-item h4 { color: #0f172a !important; }
.feature-item p,  .home-features-inner .feature-item p  { color: #64748b !important; }


/* =====================================================================
   VISIBILITY FIX v20260704f — perbaiki elemen tidak terlihat
   ===================================================================== */

/* ── STAT CARDS (4 kotak bawah hero) ── */
.home-stats-grid .stat-card,
.home-stats-row .stat-card {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  border-radius: 16px !important;
  padding: 18px 20px !important;
  box-shadow: 0 4px 18px rgba(0,0,0,.12) !important;
  border: none !important;
  background: linear-gradient(135deg,#2563eb,#1d4ed8) !important;
}
.home-stats-grid .stat-card:nth-child(1),
.home-stats-row .stat-card:nth-child(1) {
  background: linear-gradient(135deg,#0ea5e9,#0369a1) !important;
  box-shadow: 0 4px 18px rgba(14,165,233,.35) !important;
}
.home-stats-grid .stat-card:nth-child(2),
.home-stats-row .stat-card:nth-child(2) {
  background: linear-gradient(135deg,#10b981,#059669) !important;
  box-shadow: 0 4px 18px rgba(16,185,129,.35) !important;
}
.home-stats-grid .stat-card:nth-child(3),
.home-stats-row .stat-card:nth-child(3) {
  background: linear-gradient(135deg,#3b82f6,#1d4ed8) !important;
  box-shadow: 0 4px 18px rgba(59,130,246,.35) !important;
}
.home-stats-grid .stat-card:nth-child(4),
.home-stats-row .stat-card:nth-child(4) {
  background: linear-gradient(135deg,#8b5cf6,#6d28d9) !important;
  box-shadow: 0 4px 18px rgba(139,92,246,.35) !important;
}
.home-stats-grid .stat-card .stat-icon,
.home-stats-row .stat-card .stat-icon {
  background: rgba(255,255,255,.22) !important;
  color: #fff !important;
  width: 46px !important; height: 46px !important;
  border-radius: 12px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: 20px !important; flex-shrink: 0 !important;
}
.home-stats-grid .stat-card .stat-text strong,
.home-stats-grid .stat-card strong,
.home-stats-row .stat-card .stat-text strong,
.home-stats-row .stat-card strong {
  font-size: 22px !important;
  font-weight: 900 !important;
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.2) !important;
  line-height: 1 !important;
  display: block !important;
}
.home-stats-grid .stat-card .stat-text small,
.home-stats-grid .stat-card small,
.home-stats-grid .stat-card span,
.home-stats-row .stat-card .stat-text small,
.home-stats-row .stat-card small,
.home-stats-row .stat-card span {
  font-size: 12px !important;
  color: rgba(255,255,255,.85) !important;
  font-weight: 600 !important;
  display: block !important;
  margin-top: 2px !important;
}

/* Juga fix stat card pakai class spesifik */
.stat-card--layanan { background: linear-gradient(135deg,#0ea5e9,#0369a1) !important; }
.stat-card--surat   { background: linear-gradient(135deg,#10b981,#059669) !important; }
.stat-card--warga   { background: linear-gradient(135deg,#3b82f6,#1d4ed8) !important; }
.stat-card--rtrw    { background: linear-gradient(135deg,#8b5cf6,#6d28d9) !important; }
.stat-card--layanan strong, .stat-card--surat strong,
.stat-card--warga strong,   .stat-card--rtrw strong,
.stat-card--layanan small,  .stat-card--surat small,
.stat-card--warga small,    .stat-card--rtrw small,
.stat-card--layanan span,   .stat-card--surat span,
.stat-card--warga span,     .stat-card--rtrw span {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.2) !important;
}
.stat-card--layanan .stat-icon, .stat-card--surat .stat-icon,
.stat-card--warga .stat-icon,   .stat-card--rtrw .stat-icon {
  background: rgba(255,255,255,.22) !important;
  color: #fff !important;
}

/* ── FEATURES STRIP (Pelayanan Cepat, Data Aman, dst) ── */
.home-features--inline {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 24px !important;
  margin: 0 auto 16px !important;
  max-width: 1200px !important;
}
.home-features--inline .features-inner,
.home-features-inner {
  display: grid !important;
  grid-template-columns: repeat(4,1fr) !important;
  gap: 16px !important;
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  padding: 20px 24px !important;
  box-shadow: 0 1px 8px rgba(0,0,0,.05) !important;
}
@media (max-width: 860px) {
  .home-features--inline .features-inner, .home-features-inner {
    grid-template-columns: repeat(2,1fr) !important;
  }
}
@media (max-width: 480px) {
  .home-features--inline .features-inner, .home-features-inner {
    grid-template-columns: 1fr !important;
  }
}
.home-features--inline .feature-item,
.home-features-inner .feature-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
}
.home-features--inline .feature-item h4,
.home-features-inner .feature-item h4 {
  color: #0f172a !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  margin: 0 0 4px !important;
}
.home-features--inline .feature-item p,
.home-features-inner .feature-item p {
  color: #64748b !important;
  font-size: 12px !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}
/* icon feat strip */
.home-features--inline .feat-icon--blue,
.home-features-inner .feat-icon--blue,
.feature-icon--blue, .feat-icon--blue {
  background: linear-gradient(135deg,#3b82f6,#1d4ed8) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.home-features--inline .feat-icon--green,
.home-features-inner .feat-icon--green,
.feature-icon--green, .feat-icon--green {
  background: linear-gradient(135deg,#10b981,#059669) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.home-features--inline .feat-icon--purple,
.home-features-inner .feat-icon--purple,
.feature-icon--purple, .feat-icon--purple {
  background: linear-gradient(135deg,#8b5cf6,#6d28d9) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.home-features--inline .feat-icon--orange,
.home-features-inner .feat-icon--orange,
.feature-icon--orange, .feat-icon--orange {
  background: linear-gradient(135deg,#f97316,#ea580c) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.home-features--inline .feat-icon--red,
.home-features-inner .feat-icon--red,
.feature-icon--red, .feat-icon--red {
  background: linear-gradient(135deg,#ef4444,#dc2626) !important;
  color: #fff !important;
  box-shadow: none !important;
}
/* ukuran icon feat */
.home-features--inline .feat-icon,
.home-features-inner .feat-icon,
.feature-item .feat-icon,
.feature-item .feature-icon {
  width: 46px !important; height: 46px !important;
  min-width: 46px !important;
  border-radius: 12px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: 20px !important; flex-shrink: 0 !important;
}

/* ── SECTION head link-more button visibility ── */
.section-head .link-more {
  color: #2563eb !important;
  font-weight: 700 !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.18) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-size: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}
.section-head .link-more i {
  font-size: 12px !important;
  color: #2563eb !important;
}
.home-card .section-head .link-more {
  color: #2563eb !important;
}
/* Di dark cards: panel-news, pengumuman, galeri tetap putih */
.panel-news .section-head .link-more,
.home-card.home-pengumuman-card .section-head .link-more,
.home-card.home-galeri-card .section-head .link-more {
  color: rgba(255,255,255,.9) !important;
  background: rgba(255,255,255,.18) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
}
.panel-news .section-head .link-more i,
.home-card.home-pengumuman-card .section-head .link-more i,
.home-card.home-galeri-card .section-head .link-more i {
  color: rgba(255,255,255,.9) !important;
}


/* =====================================================================
   ALL WHITE FINAL v20260704h — SEMUA section putih, teks hitam
   ===================================================================== */

/* === FORCE SEMUA HOME CARD, PANEL, DUO-ROW JADI PUTIH === */
.home-card,
.home-duo-row .home-card,
.home-duo-row > *,
.home-panels > *,
.home-panels--full > *,
.panel-services,
.panel-news,
.home-card.home-pengumuman-card,
.home-card.home-galeri-card,
.home-card.home-visimisi-card,
.home-card.home-staf-card,
.home-card.home-agenda-card,
.home-page .panel-services,
.home-page .panel-news {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 8px rgba(0,0,0,.06) !important;
  border-radius: 16px !important;
}

/* === FORCE SEMUA TEKS DI HOME JADI HITAM === */
.home-card *,
.home-duo-row *,
.home-panels *,
.home-panels--full *,
.panel-services *,
.panel-news * {
  color: #111827 !important;
  text-shadow: none !important;
}

/* === KECUALIKAN elemen yang memang perlu warna lain === */
/* Icon svc */
.svc-icon.svc-icon--blue   { background: #dbeafe !important; color: #2563eb !important; }
.svc-icon.svc-icon--purple { background: #ede9fe !important; color: #7c3aed !important; }
.svc-icon.svc-icon--green  { background: #dcfce7 !important; color: #16a34a !important; }
.svc-icon.svc-icon--orange { background: #ffedd5 !important; color: #ea580c !important; }
.svc-icon.svc-icon--red    { background: #fee2e2 !important; color: #dc2626 !important; }

/* Icon feat */
.feat-icon--blue,   .feature-icon--blue   { background: linear-gradient(135deg,#3b82f6,#1d4ed8) !important; color: #fff !important; }
.feat-icon--green,  .feature-icon--green  { background: linear-gradient(135deg,#10b981,#059669) !important; color: #fff !important; }
.feat-icon--purple, .feature-icon--purple { background: linear-gradient(135deg,#8b5cf6,#6d28d9) !important; color: #fff !important; }
.feat-icon--orange, .feature-icon--orange { background: linear-gradient(135deg,#f97316,#ea580c) !important; color: #fff !important; }
.feat-icon--red,    .feature-icon--red    { background: linear-gradient(135deg,#ef4444,#dc2626) !important; color: #fff !important; }
.feat-icon, .feature-icon { width:46px !important; height:46px !important; min-width:46px !important; border-radius:12px !important; display:flex !important; align-items:center !important; justify-content:center !important; font-size:20px !important; flex-shrink:0 !important; }

/* Agenda date box tetap biru */
.agenda-date-box, .adb-day, .adb-mon { background: transparent !important; }
.home-agenda-card .agenda-date-box,
.agenda-date-box {
  background: linear-gradient(135deg,#2563eb,#1d4ed8) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  width: 52px !important; height: 52px !important; min-width: 52px !important;
  display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important;
}
.agenda-date-box .adb-day { color: #fff !important; font-size: 20px !important; font-weight: 900 !important; }
.agenda-date-box .adb-mon { color: rgba(255,255,255,.85) !important; font-size: 10px !important; font-weight: 700 !important; }

/* Badge/pill tetap berwarna */
.peng-badge, .hni-cat, .tag-pill, .badge {
  color: #1d4ed8 !important;
  background: #dbeafe !important;
  border-radius: 4px !important;
}
.badge-penting { color: #92400e !important; background: #fef3c7 !important; }
.badge-darurat { color: #991b1b !important; background: #fee2e2 !important; }

/* svc go arrow */
.service-card .svc-go {
  background: #eff6ff !important; color: #2563eb !important;
  border: none !important;
  position: absolute !important; bottom: 14px !important; left: 14px !important;
  width: 30px !important; height: 30px !important; border-radius: 50% !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
}
.service-card:hover .svc-go { background: #2563eb !important; color: #fff !important; }

/* === SECTION HEAD H2 === */
.home-card .section-head h2,
.panel-services .section-head h2,
.panel-news .section-head h2,
.home-duo-row .section-head h2 {
  color: #111827 !important;
  font-size: 19px !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}
.home-card .section-head h2::after,
.panel-services .section-head h2::after,
.panel-news .section-head h2::after {
  background: #2563eb !important;
}

/* === LINK MORE / LIHAT SEMUA === */
.home-card .link-more,
.panel-services .link-more,
.panel-news .link-more,
.home-duo-row .link-more,
.section-head .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}
.home-card .link-more i,
.panel-services .link-more i,
.panel-news .link-more i,
.section-head .link-more i {
  color: #2563eb !important;
  font-size: 12px !important;
}

/* === TOMBOL DI GALERI & PENGUMUMAN === */
.peng-more-btn .btn,
.galeri-more-btn .btn,
.home-card .btn {
  background: rgba(37,99,235,.08) !important;
  color: #2563eb !important;
  border: 1.5px solid rgba(37,99,235,.25) !important;
  border-radius: 10px !important;
  padding: 9px 18px !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: background .2s !important;
}
.peng-more-btn .btn:hover,
.galeri-more-btn .btn:hover {
  background: rgba(37,99,235,.15) !important;
}
.peng-more-btn .btn i,
.galeri-more-btn .btn i,
.home-card .btn i {
  color: #2563eb !important;
  font-size: 12px !important;
}

/* === PENGUMUMAN ITEMS PUTIH === */
.home-peng-item {
  background: #f8faff !important;
  border: 1px solid #e0e7ff !important;
  border-radius: 10px !important;
}
.home-peng-item:hover { background: #eff6ff !important; }
.home-peng-title  { color: #111827 !important; }
.home-peng-date   { color: #6b7280 !important; }
.home-peng-arrow  { color: #9ca3af !important; }
.home-peng-badge  { background: #dbeafe !important; color: #1d4ed8 !important; border-radius: 4px !important; }

/* === NEWS ITEMS PUTIH === */
.home-news-list {
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
}
.home-news-item {
  border-bottom: 1px solid #f0f4ff !important;
}
.home-news-item:hover { background: #f0f6ff !important; }
.home-news-item.active {
  background: #eff6ff !important;
  border-left: 3px solid #2563eb !important;
}
.hni-title { color: #111827 !important; }
.hni-date  { color: #6b7280 !important; }
.hni-cat   { color: #2563eb !important; background: #dbeafe !important; }
.hni-thumb-empty { background: #e0e7ff !important; color: #6366f1 !important; }

/* === GALERI ITEMS === */
.home-galeri-item {
  background: #f0f4ff !important;
  border: 1px solid #e0e7ff !important;
  border-radius: 8px !important;
}
.home-galeri-caption { color: #fff !important; }

/* === STAF CARD INNER PUTIH === */
.staf-card {
  background: #f8faff !important;
  border: 1px solid #e0e7ff !important;
  border-radius: 12px !important;
  backdrop-filter: none !important;
}
.staf-nama    { color: #111827 !important; }
.staf-jabatan { color: #6b7280 !important; }
.staf-photo   { background: #e0e7ff !important; border: 3px solid #bfdbfe !important; }
.staf-nav {
  background: rgba(37,99,235,.12) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  color: #2563eb !important;
}
.staf-dot        { background: rgba(37,99,235,.2) !important; }
.staf-dot.active { background: #2563eb !important; }

/* === VISIMISI INNER PUTIH === */
#homeVisiText {
  background: #f0f7ff !important;
  border-left: 3px solid #2563eb !important;
  color: #334155 !important;
  font-style: italic !important;
}
.visimisi-misi h4 { color: #059669 !important; }
.visimisi-visi h4 { color: #2563eb !important; }
.visimisi-misi-list li   { color: #334155 !important; }
.visimisi-misi-list li i { color: #059669 !important; }
.visimisi-icon { background: linear-gradient(135deg,#2563eb,#7c3aed) !important; color: #fff !important; }

/* === AGENDA ROW === */
.home-agenda-card .agenda-row {
  border-bottom: 1px solid #f1f5f9 !important;
  padding: 10px 0 !important;
}
.home-agenda-card .agenda-row:hover {
  background: #f8faff !important;
  border-radius: 8px !important;
  padding-left: 8px !important; padding-right: 8px !important;
}
.home-agenda-card .agenda-title  { color: #111827 !important; font-weight: 800 !important; }
.home-agenda-card .agenda-detail { color: #6b7280 !important; }
.home-agenda-card .agenda-detail i { color: #2563eb !important; }
.home-agenda-card .agenda-detail span { color: #6b7280 !important; }
.home-agenda-card .agenda-empty { color: #9ca3af !important; }
.home-agenda-card .link-more { color: #2563eb !important; background: rgba(37,99,235,.08) !important; border: 1px solid rgba(37,99,235,.2) !important; }
.home-agenda-card .link-more i { color: #2563eb !important; }

/* === FEATURED NEWS TEKS (di panel-news) === */
.featured-title  { color: #fff !important; }
.featured-meta   { color: rgba(255,255,255,.75) !important; }
.featured-cat    { color: #fff !important; }
.featured-read   { color: #93c5fd !important; }


/* =====================================================================
   FINAL v20260704i — hero biru + berita putih teks hitam (max specificity)
   ===================================================================== */

/* ── HERO BIRU ── */
body .home-page .home-hero,
body .home-page section.home-hero,
body section.home-page .home-hero {
  background-color: #0f348c !important;
  background-image:
    linear-gradient(135deg,
      rgba(10,40,110,.95) 0%,
      rgba(29,86,201,.88) 50%,
      rgba(47,116,221,.60) 100%
    ),
    var(--kelurahan-bg, url('/assets/images/Background.png')) !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* ── PANEL NEWS / BERITA: PUTIH + TEKS HITAM ── */
body .home-page .panel-news,
body .panel-news,
body .home-duo-row .panel-news,
body .home-page .home-duo-row .panel-news {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 8px rgba(0,0,0,.06) !important;
  border-radius: 16px !important;
}

/* Semua teks di panel-news hitam */
body .panel-news h2,
body .panel-news h3,
body .panel-news h4,
body .panel-news p,
body .panel-news span,
body .panel-news small,
body .panel-news a,
body .panel-news .section-head h2,
body .panel-news .hni-title,
body .panel-news .hni-date,
body .home-duo-row .panel-news h2,
body .home-duo-row .panel-news h3,
body .home-duo-row .panel-news h4,
body .home-duo-row .panel-news p,
body .home-duo-row .panel-news span,
body .home-duo-row .panel-news small {
  color: #111827 !important;
  text-shadow: none !important;
}

body .panel-news .section-head h2::after,
body .home-duo-row .panel-news .section-head h2::after {
  background: #2563eb !important;
}

/* link-more di berita */
body .panel-news .link-more,
body .home-duo-row .panel-news .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-weight: 700 !important;
}
body .panel-news .link-more i,
body .home-duo-row .panel-news .link-more i {
  color: #2563eb !important;
}

/* news list */
body .panel-news .home-news-list {
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
}
body .panel-news .home-news-item {
  border-bottom: 1px solid #f0f4ff !important;
}
body .panel-news .home-news-item:hover {
  background: #f0f6ff !important;
}
body .panel-news .hni-title {
  color: #111827 !important;
}
body .panel-news .hni-date {
  color: #6b7280 !important;
}
body .panel-news .hni-cat {
  color: #2563eb !important;
  background: #dbeafe !important;
}

/* Featured news text overlay tetap putih (di atas gambar) */
body .panel-news .featured-title { color: #ffffff !important; }
body .panel-news .featured-meta  { color: rgba(255,255,255,.75) !important; }
body .panel-news .featured-cat   { color: #ffffff !important; }
body .panel-news .featured-read  { color: #93c5fd !important; }
body .panel-news .featured-overlay * { text-shadow: 0 1px 4px rgba(0,0,0,.6) !important; }

/* ── SEMUA KARTU LAIN TETAP PUTIH (override ulang) ── */
body .home-page .home-card,
body .home-page .home-duo-row .home-card,
body .home-page .panel-services,
body .home-page .home-panels--full .panel-services {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
}
body .home-page .home-card h2,
body .home-page .home-card h3,
body .home-page .home-card h4,
body .home-page .home-card p:not(.featured-meta),
body .home-page .home-card span:not(.adb-day):not(.adb-mon):not(.home-peng-badge),
body .home-page .home-card .section-head h2,
body .home-page .panel-services h2,
body .home-page .panel-services h4,
body .home-page .panel-services p {
  color: #111827 !important;
  text-shadow: none !important;
}
body .home-page .home-card .section-head h2::after,
body .home-page .panel-services .section-head h2::after {
  background: #2563eb !important;
}
body .home-page .home-card .link-more,
body .home-page .panel-services .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-weight: 700 !important;
}
body .home-page .home-card .link-more i,
body .home-page .panel-services .link-more i {
  color: #2563eb !important;
}

/* Buttons tetap terlihat */
body .home-page .peng-more-btn .btn,
body .home-page .galeri-more-btn .btn {
  background: rgba(37,99,235,.08) !important;
  color: #2563eb !important;
  border: 1.5px solid rgba(37,99,235,.25) !important;
  border-radius: 10px !important;
  padding: 9px 18px !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}
body .home-page .peng-more-btn .btn i,
body .home-page .galeri-more-btn .btn i { color: #2563eb !important; }


/* =====================================================================
   FIX v20260704j — berita teks hitam + hapus garis bawah Layanan Kami
   ===================================================================== */

/* Hapus garis biru di bawah judul "Layanan Kami" */
.panel-services .section-head h2::after,
.home-panels--full .section-head h2::after,
.home-page .panel-services .section-head h2::after {
  display: none !important;
  content: none !important;
  background: transparent !important;
  width: 0 !important;
  height: 0 !important;
}

/* Berita Terbaru: background putih, teks hitam */
body .home-page .panel-news,
body .home-duo-row .panel-news {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  padding: 22px !important;
  box-shadow: 0 1px 8px rgba(0,0,0,.06) !important;
}

/* SEMUA elemen teks di panel berita → hitam */
body .panel-news .section-head h2 {
  color: #111827 !important;
  text-shadow: none !important;
}
body .panel-news .section-head h2::after {
  background: #2563eb !important;
  display: block !important;
}
body .panel-news .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.08) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}
body .panel-news .link-more i { color: #2563eb !important; }

/* News list items */
body .panel-news .home-news-list {
  background: #f9fafb !important;
  border: 1px solid #f0f0f0 !important;
  border-radius: 10px !important;
}
body .panel-news .home-news-item {
  border-bottom: 1px solid #f3f4f6 !important;
}
body .panel-news .home-news-item:hover { background: #f0f6ff !important; }
body .panel-news .home-news-item.active {
  background: #eff6ff !important;
  border-left: 3px solid #2563eb !important;
}
body .panel-news .hni-title  { color: #111827 !important; font-weight: 700 !important; }
body .panel-news .hni-date   { color: #6b7280 !important; }
body .panel-news .hni-cat    { color: #2563eb !important; background: #dbeafe !important; }
body .panel-news .hni-thumb-empty { background: #e0e7ff !important; color: #6366f1 !important; }

/* Featured news overlay teks di atas foto tetap putih */
body .panel-news .featured-overlay .featured-title  { color: #ffffff !important; }
body .panel-news .featured-overlay .featured-meta   { color: rgba(255,255,255,.78) !important; }
body .panel-news .featured-overlay .featured-cat    { color: #ffffff !important; }
body .panel-news .featured-overlay .featured-read   { color: #93c5fd !important; }
body .panel-news .featured-overlay *                { text-shadow: 0 1px 4px rgba(0,0,0,.6) !important; }

/* News list di sebelah featured (teks kecil) */
body .panel-news .home-news-item .hni-body *  { color: #111827 !important; }
body .panel-news .home-news-item .hni-date    { color: #9ca3af !important; }
body .panel-news .home-news-item .hni-cat     { color: #2563eb !important; }

/* Peng-more-btn & galeri-more-btn: tetap biru outline */
body .peng-more-btn .btn,
body .galeri-more-btn .btn {
  background: transparent !important;
  color: #2563eb !important;
  border: 1.5px solid rgba(37,99,235,.35) !important;
  border-radius: 10px !important;
  padding: 9px 20px !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: background .2s !important;
}
body .peng-more-btn .btn:hover,
body .galeri-more-btn .btn:hover {
  background: rgba(37,99,235,.07) !important;
}
body .peng-more-btn .btn i,
body .galeri-more-btn .btn i { color: #2563eb !important; }


/* =====================================================================
   FIX v20260704k — panel-news--light: background putih, teks hitam
   ===================================================================== */

/* Panel Berita Terbaru: background putih solid */
body .panel-news.panel-news--light,
body .home-duo-row .panel-news.panel-news--light {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 16px !important;
  padding: 22px 24px !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.06) !important;
}

/* Judul "Berita Terbaru" — hitam, terbaca */
body .panel-news.panel-news--light .section-head h2 {
  color: #111827 !important;
  font-weight: 800 !important;
  font-size: 1.15rem !important;
  text-shadow: none !important;
  background: none !important;
  -webkit-text-fill-color: #111827 !important;
}

/* Garis biru di bawah judul (tetap tampil) */
body .panel-news.panel-news--light .section-head h2::after {
  display: block !important;
  content: '' !important;
  width: 40px !important;
  height: 3px !important;
  background: #2563eb !important;
  border-radius: 99px !important;
  margin-top: 6px !important;
}

/* Tombol Lihat Semua */
body .panel-news.panel-news--light .section-head .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.07) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  border-radius: 999px !important;
  padding: 5px 14px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}
body .panel-news.panel-news--light .section-head .link-more i { color: #2563eb !important; }

/* News grid item teks */
body .panel-news.panel-news--light .home-news-item .hni-title { color: #111827 !important; }
body .panel-news.panel-news--light .home-news-item .hni-date  { color: #6b7280 !important; }
body .panel-news.panel-news--light .home-news-item .hni-cat   { color: #2563eb !important; }
body .panel-news.panel-news--light .home-news-item            { border-bottom: 1px solid #f3f4f6 !important; }
body .panel-news.panel-news--light .home-news-item:hover      { background: #f0f6ff !important; }

/* Featured overlay tetap putih (di atas foto gelap) */
body .panel-news.panel-news--light .featured-overlay * { color: #ffffff !important; }
body .panel-news.panel-news--light .featured-overlay .featured-title { text-shadow: 0 1px 4px rgba(0,0,0,.6) !important; }

/* Loading card */
body .panel-news.panel-news--light .loading-card { color: #6b7280 !important; }


/* =====================================================================
   FIX v20260704l — service-card: background putih, teks hitam
   ===================================================================== */

/* Container layanan */
body .home-panels--full,
body .home-panels.home-panels--full {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 18px !important;
  padding: 24px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.05) !important;
}

/* Tiap service card: putih, teks hitam */
body .service-card {
  background: #ffffff !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 14px !important;
  color: #111827 !important;
  box-shadow: 0 1px 6px rgba(0,0,0,.07) !important;
  transition: box-shadow .2s, transform .2s !important;
}
body .service-card:hover {
  box-shadow: 0 6px 20px rgba(37,99,235,.13) !important;
  transform: translateY(-2px) !important;
  border-color: #93c5fd !important;
}

/* Judul dan deskripsi dalam card */
body .service-card h4 {
  color: #111827 !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}
body .service-card p {
  color: #6b7280 !important;
  text-shadow: none !important;
}

/* Tombol arrow di card */
body .service-card .svc-go {
  background: #eff6ff !important;
  color: #2563eb !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 50% !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
body .service-card:hover .svc-go {
  background: #2563eb !important;
  color: #ffffff !important;
  border-color: #2563eb !important;
}


/* =====================================================================
   FIX v20260704m — FINAL: home-panels--full service-card PUTIH
   Override paksa rule nth-child biru di atas
   ===================================================================== */

.home-panels--full .service-card,
.home-panels--full .service-card:nth-child(1),
.home-panels--full .service-card:nth-child(2),
.home-panels--full .service-card:nth-child(3),
.home-panels--full .service-card:nth-child(4),
body .home-panels--full .service-card,
body .home-panels--full .service-card:nth-child(1),
body .home-panels--full .service-card:nth-child(2),
body .home-panels--full .service-card:nth-child(3),
body .home-panels--full .service-card:nth-child(4) {
  background: #ffffff !important;
  background-image: none !important;
  color: #111827 !important;
  border: 1.5px solid #e5e7eb !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.06) !important;
  border-radius: 14px !important;
  transition: box-shadow .2s, transform .2s, border-color .2s !important;
}

body .home-panels--full .service-card:hover,
body .home-panels--full .service-card:nth-child(1):hover,
body .home-panels--full .service-card:nth-child(2):hover,
body .home-panels--full .service-card:nth-child(3):hover,
body .home-panels--full .service-card:nth-child(4):hover {
  background: #f0f6ff !important;
  border-color: #93c5fd !important;
  box-shadow: 0 8px 24px rgba(37,99,235,.14) !important;
  transform: translateY(-3px) !important;
}

/* Teks hitam di dalam card */
body .home-panels--full .service-card h4,
body .home-panels--full .service-card:nth-child(1) h4,
body .home-panels--full .service-card:nth-child(2) h4,
body .home-panels--full .service-card:nth-child(3) h4,
body .home-panels--full .service-card:nth-child(4) h4 {
  color: #111827 !important;
  font-weight: 900 !important;
}

body .home-panels--full .service-card p,
body .home-panels--full .service-card:nth-child(1) p,
body .home-panels--full .service-card:nth-child(2) p,
body .home-panels--full .service-card:nth-child(3) p,
body .home-panels--full .service-card:nth-child(4) p {
  color: #6b7280 !important;
}

/* Icon berwarna sesuai tipe */
body .home-panels--full .service-card .svc-icon {
  border: none !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 12px !important;
}
body .home-panels--full .service-card .svc-icon.svc-icon--blue   { background: #dbeafe !important; color: #2563eb !important; }
body .home-panels--full .service-card .svc-icon.svc-icon--purple { background: #ede9fe !important; color: #7c3aed !important; }
body .home-panels--full .service-card .svc-icon.svc-icon--green  { background: #dcfce7 !important; color: #16a34a !important; }
body .home-panels--full .service-card .svc-icon.svc-icon--orange { background: #ffedd5 !important; color: #ea580c !important; }

/* Tombol arrow */
body .home-panels--full .service-card .svc-go {
  background: #eff6ff !important;
  color: #2563eb !important;
  border: 1px solid #bfdbfe !important;
}
body .home-panels--full .service-card:hover .svc-go {
  background: #2563eb !important;
  color: #ffffff !important;
  border-color: #2563eb !important;
}

/* Container layanan kami: putih, tidak gelap */
body .home-panels.home-panels--full,
body .home-body .home-panels.home-panels--full {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 18px !important;
  padding: 24px !important;
  box-shadow: 0 2px 14px rgba(0,0,0,.06) !important;
}

/* Section head di dalam panels--full */
body .home-panels--full .panel-services {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

body .home-panels--full .panel-services .section-head h2,
body .home-panels--full .section-head h2 {
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  text-shadow: none !important;
}

body .home-panels--full .panel-services .section-head h2::after,
body .home-panels--full .section-head h2::after {
  display: none !important;
}

body .home-panels--full .panel-services .link-more {
  color: #2563eb !important;
  background: rgba(37,99,235,.07) !important;
  border: 1px solid rgba(37,99,235,.2) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  font-weight: 800 !important;
}



/* =====================================================================
   FIX SERVICE CARD PUTIH + TOMBOL HOME
   ===================================================================== */

/* Tombol Lihat Semua di card galeri & pengumuman */
.galeri-more-btn .home-more-btn,
.peng-more-btn .home-more-btn {
  background: rgba(255,255,255,.2) !important;
  color: #fff !important;
  border: 2px solid rgba(255,255,255,.4) !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  padding: 8px 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  transition: background .2s !important;
}
.galeri-more-btn .home-more-btn:hover,
.peng-more-btn .home-more-btn:hover {
  background: rgba(255,255,255,.35) !important;
}

/* Service card PUTIH — override semua rule biru */
body .service-card {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
}
body .home-page .service-card,
body .panel-services .service-card,
body .home-panels--full .service-card {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.05) !important;
}
body .home-page .service-card h4,
body .panel-services .service-card h4,
body .home-panels--full .service-card h4 {
  color: #111827 !important;
  text-shadow: none !important;
}
body .home-page .service-card p,
body .panel-services .service-card p,
body .home-panels--full .service-card p {
  color: #6b7280 !important;
  text-shadow: none !important;
}
body .home-page .service-card .svc-go,
body .panel-services .service-card .svc-go,
body .home-panels--full .service-card .svc-go {
  background: #eff6ff !important;
  color: #2563eb !important;
  border: 1px solid #bfdbfe !important;
}
body .home-page .service-card:hover .svc-go,
body .panel-services .service-card:hover .svc-go,
body .home-panels--full .service-card:hover .svc-go {
  background: #2563eb !important;
  color: #fff !important;
}
/* Icon warna khas */
body .service-card .svc-icon--blue  { background: #dbeafe !important; color: #2563eb !important; }
body .service-card .svc-icon--purple{ background: #ede9fe !important; color: #7c3aed !important; }
body .service-card .svc-icon--green { background: #dcfce7 !important; color: #16a34a !important; }
body .service-card .svc-icon--orange{ background: #ffedd5 !important; color: #ea580c !important; }

/* Hide CTA when logged in */
body.is-warga .home-cta,
body.is-admin .home-cta,
body.is-staf .home-cta {
    display: none !important;
}

/* Hide CTA when user is logged in (body.is-auth added by main.js) */
body.is-auth .home-cta {
    display: none !important;
}
