/* ============================================================
   Biropem Kaltara — Tema Biru (publik). Diadaptasi dari desain DLH.
   ============================================================ */
        :root{
            --biru-primary:#2563eb;
            --biru-primary-dark:#1e3a8a;
            --biru-accent:#0891b2;
            --biru-ink:#0f172a;
            --biru-muted:#64748b;
            --biru-bg:#f8fafc;
            --biru-card:#ffffff;
            --biru-border:#e2e8f0;
        }
        body{font-family:'Segoe UI','Helvetica Neue',Arial,sans-serif;color:var(--biru-ink);background:#fff;}
        a{transition:color .2s;}

        /* Topbar */
        .header2-area .header-top-area{
            background:linear-gradient(90deg,#1e3a8a 0%,#1d4ed8 60%,#0891b2 100%);
            color:#fff; font-size:13px;
        }
        .header2-area .header-top-area ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:18px;}
        .header2-area .header-top-area ul li{padding:9px 0;color:rgba(255,255,255,.92);}
        .header2-area .header-top-area ul li a{color:#fff;text-decoration:none;}
        .header2-area .header-top-area ul li a:hover{color:#bfdbfe;}
        .header2-area .header-top-area ul li i{margin-right:6px;color:#bfdbfe;}

        /* Main menu bar */
        .main-menu-area{
            background:#ffffff !important;
            box-shadow:0 4px 20px rgba(15,23,42,.08);
            border-bottom:3px solid var(--biru-primary);
            padding:6px 0;
        }
        .main-menu-area.bg-textPrimary{background:#ffffff !important;}
        .main-menu-area .menu-flex{
            display:flex;align-items:center;gap:24px;
        }
        /* OVERRIDE depan/style.css yang pakai margin-left:200px + width:150px;height:50px */
        .main-menu-area .logo-area{
            flex:0 0 auto !important;
            margin:0 !important;
            width:auto !important;height:auto !important;
        }
        .main-menu-area .logo-area a{display:block;}
        .main-menu-area .logo-area img{
            display:block;height:84px;width:auto;max-width:230px;object-fit:contain;
        }
        @media(max-width:1199px){.main-menu-area .logo-area img{height:72px;max-width:200px;}}
        @media(max-width:767px){.main-menu-area .logo-area img{height:60px;max-width:170px;}}
        .main-menu-area .nav-wrap{flex:1 1 auto;min-width:0;}
        @media(max-width:991px){.main-menu-area .menu-flex{gap:14px;justify-content:space-between;}}

        #desktop-nav > ul{
            display:flex;flex-wrap:nowrap;justify-content:flex-end;
            margin:0;padding:0;list-style:none;align-items:center;
            white-space:nowrap;
        }
        #desktop-nav > ul > li{position:relative;flex:0 0 auto;}
        #desktop-nav > ul > li > a{
            display:block;padding:22px 11px;color:#0f172a;font-weight:600;
            font-size:13px;text-decoration:none;text-transform:uppercase;
            letter-spacing:.2px;cursor:pointer;white-space:nowrap;
        }
        @media(min-width:992px) and (max-width:1199px){
            #desktop-nav > ul > li > a{padding:22px 8px;font-size:12px;letter-spacing:0;}
        }
        #desktop-nav > ul > li > a:hover,
        #desktop-nav > ul > li.active > a{
            color:var(--biru-primary-dark);
        }
        #desktop-nav > ul > li.active > a::after,
        #desktop-nav > ul > li:hover > a::after{
            content:"";display:block;height:3px;width:60%;
            background:var(--biru-primary);position:absolute;bottom:14px;left:20%;
            border-radius:3px;
        }
        #desktop-nav > ul > li ul{
            position:absolute;top:100%;left:0;min-width:240px;
            background:#fff;border-radius:8px;box-shadow:0 14px 32px rgba(15,23,42,.14);
            padding:8px 0;list-style:none;margin:0;
            border:1px solid var(--biru-border);
            opacity:0;visibility:hidden;transform:translateY(8px);
            transition:opacity .2s,transform .2s,visibility .2s;
            z-index:1100;
        }
        #desktop-nav > ul > li:hover > ul{opacity:1;visibility:visible;transform:translateY(0);}
        #desktop-nav > ul > li ul li a{
            display:block;padding:10px 18px;color:#334155;
            font-size:13.5px;text-decoration:none;font-weight:500;
        }
        #desktop-nav > ul > li ul li a:hover,
        #desktop-nav > ul > li ul li.active a{
            background:#eff6ff;color:var(--biru-primary-dark);
        }

        /* Sticky on scroll */
        .main-menu-area.sticker-fixed{
            position:fixed;top:0;left:0;right:0;z-index:1050;
            box-shadow:0 6px 22px rgba(15,23,42,.14);
            animation:dlhSlideDown .3s ease;
        }
        @keyframes dlhSlideDown{from{transform:translateY(-100%);}to{transform:translateY(0);}}

        /* Generic page header band shown on inner pages */
        .dlh-page-banner{
            position:relative;
            padding:64px 0 54px;
            background:linear-gradient(135deg,#1e3a8a 0%,#1d4ed8 50%,#0891b2 100%);
            color:#fff;overflow:hidden;
            margin-bottom:30px;
        }
        .dlh-page-banner::after{
            content:"";position:absolute;inset:0;
            background:url('bg.svg') center/cover no-repeat;opacity:.12;
        }
        .dlh-page-banner h1{
            position:relative;z-index:2;font-size:34px;font-weight:800;margin:0 0 10px;
            text-shadow:0 2px 14px rgba(0,0,0,.25);
        }
        .dlh-page-banner .crumbs{position:relative;z-index:2;font-size:14px;opacity:.92;}
        .dlh-page-banner .crumbs a{color:#bfdbfe;text-decoration:none;}
        .dlh-page-banner .crumbs a:hover{color:#fff;text-decoration:underline;}
        @media (max-width:767px){.dlh-page-banner{padding:44px 0 36px;}.dlh-page-banner h1{font-size:24px;}}

        /* Mobile */
        @media (max-width:991px){
            #desktop-nav{display:none;}
        }
        .mobile-menu-area{display:none;}
        @media (max-width:991px){
            .mobile-menu-area{display:block;background:#fff;border-top:1px solid var(--biru-border);}
            .mean-container .mean-bar{background:var(--biru-primary-dark);}
            .mean-container a.meanmenu-reveal{color:#fff !important;}
            .mean-container a.meanmenu-reveal span{background:#fff !important;}
        }



        /* ---- Penyesuaian struktur grid biropem (container + logo) ---- */
        .main-menu-area .container{width:100% !important;max-width:1240px !important;margin:0 auto;}
        @media(min-width:992px){
            .main-menu-area .row{display:flex;align-items:center;flex-wrap:nowrap;}
        }
        .main-menu-area [class*="col-"]{padding-left:8px;padding-right:8px;}
        .main-menu-area .logo-area img{max-width:220px !important;height:72px !important;width:auto !important;}
        @media(max-width:991px){
            .main-menu-area .logo-area img{height:56px !important;max-width:170px !important;}
        }
        /* Tombol biru untuk halaman publik */
        .btn-primary,.reddish{background:#2563eb !important;border-color:#2563eb !important;color:#fff !important;}
        .btn-primary:hover{background:#1e3a8a !important;border-color:#1e3a8a !important;}
        a{color:#1d4ed8;}
        a:hover{color:#1e3a8a;}

        /* ============================================================
           Footer selaras dengan header (palet biru)
           ============================================================ */
        footer .footer-area-top{
            background:linear-gradient(135deg,#1e3a8a 0%,#172554 100%) !important;
            border-top:4px solid #2563eb;
            color:#e2e8f0;
        }
        footer .footer-area-top .footer-box h1,
        footer .footer-area-top .footer-box h2,
        footer .footer-area-top .footer-box h3,
        footer .footer-area-top .footer-box h4{
            color:#ffffff !important;
        }
        footer .footer-area-top .footer-about,
        footer .footer-area-top .footer-box p,
        footer .footer-area-top .footer-box li,
        footer .footer-area-top .footer-box span{ color:#cbd5e1 !important; }
        footer .footer-area-top a{ color:#bfdbfe !important; }
        footer .footer-area-top a:hover{ color:#ffffff !important; }
        footer .footer-area-top i{ color:#93c5fd; }
        footer .footer-social a{
            background:rgba(255,255,255,.10);
            border:1px solid rgba(255,255,255,.20);
            color:#fff !important;
            transition:background .2s,transform .2s,border-color .2s;
        }
        footer .footer-social a:hover{ background:#2563eb; border-color:#2563eb; transform:translateY(-3px); }
        footer .footer-area-bottom{ background:#0f172a !important; color:#cbd5e1; }
        footer .footer-area-bottom p{ color:#cbd5e1 !important; margin:0; }
        footer .footer-area-bottom a{ color:#bfdbfe !important; }

        /* ============================================================
           Tata letak logo & menu dropdown/subdropdown
           (mengikuti pengaturan dpppappkb — palet tetap biru)
           ============================================================ */
        /* Logo: tinggi dibatasi agar pas di bar, proporsional & responsif */
        .main-menu-area .logo-area img{
            max-height:56px !important; height:auto !important; width:auto !important; max-width:100% !important;
        }
        @media(min-width:992px) and (max-width:1199px){ .main-menu-area .logo-area img{max-height:44px !important;} }
        @media(min-width:1200px) and (max-width:1399px){ .main-menu-area .logo-area img{max-height:50px !important;} }
        @media(max-width:991px){ .main-menu-area .logo-area img{max-height:50px !important;} }

        /* Menu utama muat 1 baris di semua resolusi (font & padding menyesuaikan) */
        @media(min-width:992px){
            #desktop-nav > ul{ white-space:nowrap; flex-wrap:nowrap; }
            #desktop-nav > ul > li > a{
                font-size:clamp(11px,0.82vw,14px) !important;
                padding-left:clamp(6px,0.7vw,14px) !important;
                padding-right:clamp(6px,0.7vw,14px) !important;
                letter-spacing:0 !important;
            }
        }

        /* Dropdown & subdropdown: lebar mengikuti teks terpanjang (tidak terpotong) */
        #desktop-nav > ul > li ul{
            width:auto !important; min-width:210px !important; white-space:nowrap !important;
        }
        #desktop-nav > ul > li ul li{ position:relative; }
        #desktop-nav > ul > li ul li a{ white-space:nowrap !important; }
        /* Sub-dropdown bertingkat (flyout ke kanan) bila suatu saat ada menu level-3 */
        #desktop-nav > ul > li ul li > ul{
            position:absolute; top:0; left:100%; margin-left:2px;
            opacity:0; visibility:hidden; transform:translateX(8px);
            transition:opacity .2s,transform .2s,visibility .2s;
        }
        #desktop-nav > ul > li ul li:hover > ul{ opacity:1; visibility:visible; transform:translateX(0); }