
/* =========================================================
   CampusStock UNEJ landing
   Layout mengikuti gambar referensi, data tetap dinamis.
========================================================= */
:root{
    --unej-blue:#0648e8;
    --unej-blue-dark:#0634bd;
    --unej-ink:#15233f;
    --unej-muted:#52617d;
    --unej-line:#e5ebf6;
    --unej-stock-bg:#f6f9ff;
}

html,body,button,input,select,textarea{
    font-family:"Roboto Condensed","Arial Narrow",Arial,sans-serif;
}

body.unej-public-page{
    margin:0;
    background:#fff;
    color:var(--unej-ink);
    overflow-x:hidden;
}

.unej-public-page .public-footer{
    margin:0;
}

.unej-public-nav{
    position:fixed;
    z-index:50;
    top:0;
    left:50%;
    transform:translateX(-50%);
    width:min(1430px,calc(100% - 54px));
    height:96px;
    display:grid;
    grid-template-columns:minmax(230px,1fr) auto minmax(145px,1fr);
    align-items:center;
    gap:28px;
    transition:height .2s ease,background .2s ease,box-shadow .2s ease,border-color .2s ease,padding .2s ease;
}

.unej-public-nav.is-scrolled{
    height:76px;
    padding:0 18px;
    border:1px solid rgba(220,228,243,.9);
    border-top:0;
    border-radius:0 0 18px 18px;
    background:rgba(255,255,255,.94);
    box-shadow:0 14px 34px rgba(20,48,105,.12);
    backdrop-filter:blur(16px);
}

.unej-public-brand{
    display:inline-flex;
    align-items:center;
    gap:14px;
    width:max-content;
    color:var(--unej-blue);
    text-decoration:none;
}

.unej-public-brand strong{
    font-size:2rem;
    line-height:1;
    font-weight:900;
    letter-spacing:-.04em;
}

.unej-brand-symbol{
    position:relative;
    width:34px;
    height:34px;
    flex:0 0 34px;
}

.unej-brand-symbol i{
    position:absolute;
    left:2px;
    width:27px;
    height:13px;
    border-radius:99px 99px 99px 4px;
    transform:rotate(27deg);
}

.unej-brand-symbol i:first-child{
    top:3px;
    background:linear-gradient(90deg,#ff7d56,#ff477c);
}

.unej-brand-symbol i:last-child{
    bottom:3px;
    background:linear-gradient(90deg,#ff2c8b,#ef4ed2);
    transform:rotate(-27deg);
}

.unej-nav-links{
    display:flex;
    align-items:center;
    gap:44px;
    height:100%;
}

.unej-nav-links a{
    position:relative;
    display:grid;
    place-items:center;
    height:100%;
    color:#263451;
    text-decoration:none;
    font-size:1.02rem;
    font-weight:500;
}

.unej-nav-links a:hover,
.unej-nav-links a.active{
    color:var(--unej-blue);
}

.unej-nav-links a.active::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:19px;
    width:72px;
    height:4px;
    border-radius:99px;
    background:var(--unej-blue);
    transform:translateX(-50%);
}

.unej-nav-links a>i{
    display:none;
}

.unej-nav-toggle{
    display:none;
    width:46px;
    height:46px;
    padding:0;
    border:1px solid #dce5f4;
    border-radius:12px;
    background:#fff;
    color:var(--unej-blue);
    place-items:center;
    font-size:1.45rem;
    box-shadow:0 8px 20px rgba(18,60,145,.09);
}

.unej-nav-backdrop{
    position:fixed;
    inset:0;
    z-index:45;
    background:rgba(10,25,58,.34);
    backdrop-filter:blur(2px);
}

body.public-nav-open{
    overflow:hidden;
}

.unej-nav-login{
    justify-self:end;
    min-height:48px;
    padding:0 22px;
    border:1px solid rgba(255,255,255,.85);
    border-radius:12px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    background:var(--unej-blue);
    color:#fff;
    text-decoration:none;
    font-size:1rem;
    font-weight:800;
    box-shadow:0 12px 24px rgba(6,72,232,.22);
}

.unej-nav-login:hover{
    background:#053dca;
    color:#fff;
}

.unej-landing{
    min-height:100vh;
    background:#fff;
}

.unej-hero{
    position:relative;
    min-height:720px;
    display:grid;
    grid-template-columns:minmax(430px,44%) minmax(600px,56%);
    align-items:center;
    overflow:hidden;
    background:#fff;
}

.unej-hero-copy{
    position:relative;
    z-index:5;
    width:min(640px,calc(100% - 70px));
    margin-left:max(54px,calc((100vw - 1430px)/2));
    padding-top:90px;
}

.unej-hero-copy h1{
    margin:0;
    color:var(--unej-blue);
    font-size:clamp(3.2rem,4.1vw,4.45rem);
    font-weight:900;
    line-height:1.04;
    letter-spacing:-.045em;
    text-shadow:0 4px 0 rgba(6,72,232,.08);
}

.unej-hero-copy h1 span{
    display:inline-block;
    margin-top:5px;
}

.unej-slider-dots{
    display:flex;
    align-items:center;
    gap:14px;
    margin:24px 0 22px;
}

.unej-slider-dots i{
    width:13px;
    height:13px;
    border-radius:50%;
    background:#aab2c2;
}

.unej-slider-dots i.active{
    background:var(--unej-blue);
}

.unej-hero-copy>p{
    max-width:540px;
    margin:0;
    color:#4f5f7b;
    font-size:1.16rem;
    font-weight:400;
    line-height:1.55;
}

.unej-hero-actions{
    display:flex;
    align-items:center;
    gap:24px;
    margin-top:34px;
}

.unej-btn{
    min-height:60px;
    min-width:238px;
    padding:0 28px;
    border-radius:12px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    text-decoration:none;
    font-size:1.23rem;
    font-weight:800;
    transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}

.unej-btn:hover{
    transform:translateY(-2px);
}

.unej-btn-primary{
    background:var(--unej-blue);
    color:#fff;
    box-shadow:0 14px 26px rgba(6,72,232,.2);
}

.unej-btn-primary:hover{
    background:var(--unej-blue-dark);
    color:#fff;
}

.unej-btn-outline{
    border:2px solid var(--unej-blue);
    background:#fff;
    color:var(--unej-blue);
}

.unej-btn-outline:hover{
    color:var(--unej-blue-dark);
    box-shadow:0 12px 24px rgba(6,72,232,.11);
}

.unej-trust-row{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:27px;
    margin-top:40px;
}

.unej-trust-row article{
    display:flex;
    align-items:center;
    gap:13px;
    min-width:0;
}

.unej-trust-row article>span{
    width:58px;
    height:58px;
    border-radius:50%;
    display:grid;
    place-items:center;
    flex:0 0 58px;
    font-size:1.45rem;
}

.unej-trust-row article>span.blue{background:#dcebff;color:#0750e4}
.unej-trust-row article>span.green{background:#d9f8ef;color:#009f78}
.unej-trust-row article>span.purple{background:#efe2ff;color:#7832d5}

.unej-trust-row strong,
.unej-trust-row small{
    display:block;
}

.unej-trust-row strong{
    color:#263451;
    font-size:1rem;
    font-weight:700;
    white-space:nowrap;
}

.unej-trust-row small{
    margin-top:4px;
    color:#66758e;
    font-size:.83rem;
    white-space:nowrap;
}

.unej-hero-visual{
    position:relative;
    align-self:stretch;
    display:flex;
    align-items:flex-end;
    justify-content:flex-end;
    overflow:hidden;
}

.unej-hero-visual picture{
    width:100%;
    height:100%;
    display:block;
}

.unej-hero-visual img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    object-position:left top;
}

.unej-stock-section{
    position:relative;
    z-index:10;
    margin-top:-2px;
    padding:17px max(54px,calc((100vw - 1430px)/2)) 22px;
    background:linear-gradient(180deg,#f7faff 0%,#f4f8ff 100%);
    border-top:1px solid #edf2fb;
}

.unej-stock-head{
    min-height:60px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.unej-stock-head h2{
    margin:0;
    color:#1a2945;
    font-size:1.7rem;
    font-weight:900;
    letter-spacing:-.025em;
}

.unej-stock-head p{
    margin:3px 0 0;
    color:#5a6881;
    font-size:.94rem;
}

.unej-stock-head>a{
    display:inline-flex;
    align-items:center;
    gap:12px;
    color:var(--unej-blue);
    text-decoration:none;
    font-size:1rem;
    font-weight:800;
}

.unej-stock-grid{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:16px;
    margin-top:6px;
}

.unej-stock-card{
    position:relative;
    min-width:0;
    min-height:168px;
    padding:17px 17px 13px;
    border:1px solid #e5ebf5;
    border-radius:16px;
    background:#fff;
    box-shadow:0 9px 22px rgba(29,60,119,.055);
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease;
}

.unej-stock-card:hover{
    transform:translateY(-3px);
    box-shadow:0 17px 35px rgba(29,60,119,.1);
}

.unej-card-link{
    position:absolute;
    inset:0;
    z-index:5;
}

.unej-stock-main{
    display:flex;
    align-items:center;
    gap:12px;
}

.unej-stock-icon{
    width:58px;
    height:58px;
    border-radius:50%;
    display:grid;
    place-items:center;
    flex:0 0 58px;
    background:#dceaff;
    color:#0750e4;
    font-size:1.8rem;
}

.unej-stock-copy{
    min-width:0;
    flex:1;
}

.unej-stock-copy h3{
    margin:0 0 4px;
    color:#10192d;
    font-size:1rem;
    font-weight:800;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.unej-stock-number{
    display:flex;
    align-items:baseline;
    gap:5px;
}

.unej-stock-number strong{
    color:var(--unej-blue);
    font-size:2rem;
    font-weight:900;
    line-height:1;
    white-space:nowrap;
}

.unej-stock-number small{
    color:#53617b;
    font-size:.83rem;
}

.unej-stock-card progress{
    width:100%;
    height:8px;
    margin-top:16px;
    border:0;
    border-radius:999px;
    background:#e8edf6;
    appearance:none;
    overflow:hidden;
}

.unej-stock-card progress::-webkit-progress-bar{
    background:#e8edf6;
    border-radius:999px;
}

.unej-stock-card progress::-webkit-progress-value{
    background:var(--card-accent,#0750e4);
    border-radius:999px;
}

.unej-stock-card progress::-moz-progress-bar{
    background:var(--card-accent,#0750e4);
    border-radius:999px;
}

.unej-stock-status{
    width:max-content;
    max-width:100%;
    margin:10px auto 0;
    padding:5px 15px;
    border-radius:999px;
    text-align:center;
    font-size:.76rem;
    font-weight:700;
}

.unej-stock-status.safe{background:#e4f8f2;color:#008465}
.unej-stock-status.medium{background:#fff1cc;color:#a26700}
.unej-stock-status.low{background:#ffe2e2;color:#d3222f}

.unej-stock-card.tone-1{--card-accent:#0750e4}
.unej-stock-card.tone-2{--card-accent:#00a989}
.unej-stock-card.tone-3{--card-accent:#9234e9}
.unej-stock-card.tone-4{--card-accent:#ff942d}
.unej-stock-card.tone-5{--card-accent:#0748d9}
.unej-stock-card.tone-6{--card-accent:#9299aa}

.unej-stock-card.tone-2 .unej-stock-icon{background:#d9f7ef;color:#009a7d}
.unej-stock-card.tone-3 .unej-stock-icon{background:#eee1ff;color:#7e2bd1}
.unej-stock-card.tone-4 .unej-stock-icon{background:#ffecd9;color:#e67500}
.unej-stock-card.tone-5 .unej-stock-icon{background:#dceaff;color:#0648d8}
.unej-stock-card.tone-6 .unej-stock-icon{background:#eceef3;color:#7e879b}
.unej-stock-card.tone-6 .unej-stock-number strong{color:#53617b}

.unej-security-strip{
    min-height:48px;
    margin-top:12px;
    padding:0 18px;
    border-radius:13px;
    display:flex;
    align-items:center;
    gap:12px;
    background:#edf4ff;
    color:#4e5d77;
    font-size:.85rem;
}

.unej-security-strip i{
    color:var(--unej-blue);
    font-size:1.35rem;
}

.unej-feature-section{
    padding:80px max(28px,calc((100vw - 1180px)/2)) 90px;
    background:#fff;
}

.unej-section-title{
    max-width:720px;
    margin:0 auto 35px;
    text-align:center;
}

.unej-section-title>span,
.unej-about-section>div>span{
    color:var(--unej-blue);
    font-size:.77rem;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.unej-section-title h2,
.unej-about-section h2{
    margin:8px 0 10px;
    color:#122958;
    font-size:2.25rem;
    font-weight:900;
    letter-spacing:-.035em;
}

.unej-section-title p,
.unej-about-section p{
    margin:0;
    color:#65728c;
    line-height:1.65;
}

.unej-feature-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:17px;
}

.unej-feature-grid article{
    padding:24px;
    border:1px solid #e6ebf4;
    border-radius:19px;
    background:#fff;
    box-shadow:0 12px 32px rgba(24,57,118,.055);
}

.unej-feature-grid i{
    width:49px;
    height:49px;
    border-radius:15px;
    display:grid;
    place-items:center;
    background:#e8f0ff;
    color:var(--unej-blue);
    font-size:1.25rem;
}

.unej-feature-grid h3{
    margin:18px 0 8px;
    color:#182d59;
    font-size:1.1rem;
}

.unej-feature-grid p{
    margin:0;
    color:#68758e;
    line-height:1.6;
}

.unej-about-section{
    padding:76px 24px;
    background:#f5f8fd;
}

.unej-about-section>div{
    max-width:760px;
    margin:auto;
    text-align:center;
}

.unej-public-page .public-footer{
    background:#102f73;
    color:#fff;
    padding:36px max(24px,calc((100% - 1180px)/2));
}

@media(max-width:1250px){
    .unej-public-nav{
        width:calc(100% - 36px);
    }

    .unej-nav-links{
        gap:25px;
    }

    .unej-hero{
        grid-template-columns:minmax(390px,43%) minmax(550px,57%);
    }

    .unej-hero-copy{
        width:calc(100% - 40px);
        margin-left:35px;
    }

    .unej-trust-row{
        gap:13px;
    }

    .unej-trust-row article>span{
        width:48px;
        height:48px;
        flex-basis:48px;
    }

    .unej-stock-section{
        padding-left:28px;
        padding-right:28px;
    }
}

@media(max-width:1080px){
    .unej-public-nav{
        grid-template-columns:minmax(0,1fr) auto auto;
        gap:10px;
    }

    .unej-nav-toggle{
        display:grid;
        justify-self:end;
    }

    .unej-nav-links{
        position:fixed;
        z-index:55;
        top:84px;
        right:18px;
        width:min(350px,calc(100vw - 36px));
        height:auto;
        padding:10px;
        border:1px solid #dfe7f4;
        border-radius:18px;
        background:rgba(255,255,255,.98);
        box-shadow:0 24px 58px rgba(13,40,96,.22);
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:4px;
        opacity:0;
        visibility:hidden;
        pointer-events:none;
        transform:translateY(-10px) scale(.985);
        transform-origin:top right;
        transition:opacity .18s ease,visibility .18s ease,transform .18s ease;
    }

    body.public-nav-open .unej-nav-links{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
        transform:none;
    }

    .unej-nav-links a{
        width:100%;
        height:48px;
        padding:0 14px;
        border-radius:12px;
        display:flex;
        justify-content:flex-start;
        gap:12px;
        font-size:.95rem;
    }

    .unej-nav-links a>i{
        display:grid;
        width:28px;
        height:28px;
        place-items:center;
        border-radius:9px;
        background:#eef3ff;
        color:var(--unej-blue);
    }

    .unej-nav-links a.active{
        background:#eaf1ff;
    }

    .unej-nav-links a.active::after{
        display:none;
    }

    .unej-hero{
        grid-template-columns:1fr;
        min-height:auto;
        padding-top:104px;
    }

    .unej-hero-copy{
        width:min(680px,calc(100% - 40px));
        margin:45px auto 20px;
        padding:0;
        text-align:center;
    }

    .unej-hero-copy>p{
        margin-left:auto;
        margin-right:auto;
    }

    .unej-slider-dots,
    .unej-hero-actions,
    .unej-trust-row{
        justify-content:center;
    }

    .unej-hero-visual{
        width:min(900px,100%);
        min-height:540px;
        margin:0 auto;
    }

    .unej-stock-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media(max-width:760px){
    .unej-public-nav{
        top:0;
        height:76px;
        width:calc(100% - 24px);
    }

    .unej-public-brand strong{
        font-size:1.45rem;
    }

    .unej-brand-symbol{
        width:28px;
        height:28px;
        flex-basis:28px;
    }

    .unej-brand-symbol i{
        width:23px;
        height:11px;
    }

    .unej-nav-toggle,
    .unej-nav-login{
        width:42px;
        height:42px;
        min-height:42px;
    }

    .unej-nav-toggle{
        font-size:1.3rem;
    }

    .unej-nav-login{
        padding:0 12px;
        font-size:.88rem;
    }

    .unej-nav-links{
        top:70px;
        right:12px;
        width:calc(100vw - 24px);
    }

    .unej-hero{
        padding-top:76px;
    }

    .unej-hero-copy{
        margin-top:34px;
    }

    .unej-hero-copy h1{
        font-size:clamp(2.55rem,12vw,4rem);
    }

    .unej-hero-copy>p{
        font-size:1rem;
    }

    .unej-hero-actions{
        flex-direction:column;
        gap:12px;
    }

    .unej-btn{
        width:100%;
        min-width:0;
    }

    .unej-trust-row{
        grid-template-columns:1fr;
        width:max-content;
        max-width:100%;
        margin-left:auto;
        margin-right:auto;
        text-align:left;
    }

    .unej-hero-visual{
        min-height:410px;
    }

    .unej-stock-section{
        padding:18px 14px 22px;
    }

    .unej-stock-head{
        align-items:flex-end;
    }

    .unej-stock-head h2{
        font-size:1.45rem;
    }

    .unej-stock-head p{
        font-size:.8rem;
    }

    .unej-stock-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
    }

    .unej-stock-card{
        padding:13px;
    }

    .unej-stock-icon{
        width:48px;
        height:48px;
        flex-basis:48px;
        font-size:1.45rem;
    }

    .unej-stock-number strong{
        font-size:1.55rem;
    }

    .unej-feature-grid{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:480px){
    .unej-nav-login span{
        display:none;
    }

    .unej-nav-login{
        width:42px;
        padding:0;
    }

    .unej-public-brand strong{
        font-size:1.3rem;
    }

    .unej-hero-copy{
        width:calc(100% - 26px);
    }

    .unej-hero-copy h1{
        font-size:2.55rem;
    }

    .unej-slider-dots{
        margin:18px 0;
    }

    .unej-hero-visual{
        min-height:315px;
    }

    .unej-stock-head>a{
        font-size:.82rem;
    }

    .unej-stock-grid{
        grid-template-columns:1fr;
    }

    .unej-feature-grid{
        grid-template-columns:1fr;
    }

    .unej-security-strip{
        align-items:flex-start;
        padding-top:12px;
        padding-bottom:12px;
    }
}

@media(prefers-reduced-motion:reduce){
    *{
        scroll-behavior:auto!important;
        transition:none!important;
    }
}

/* =========================================================
   Public budget filter, tabbed stock analytics and charts
========================================================= */
.public-budget-filter{margin:8px 0 14px;padding:11px 12px;border:1px solid #e3e9f4;border-radius:15px;background:#fff;box-shadow:0 8px 22px rgba(30,61,118,.05);display:grid;grid-template-columns:minmax(230px,1fr) minmax(140px,.35fr) minmax(140px,.35fr) minmax(190px,.52fr) auto 42px;align-items:end;gap:10px}.public-budget-filter>div{display:flex;align-items:center;gap:10px;align-self:center}.public-budget-filter>div>i{width:42px;height:42px;border-radius:13px;background:#e7efff;color:#0648e8;display:grid;place-items:center;font-size:1.12rem}.public-budget-filter strong,.public-budget-filter small{display:block}.public-budget-filter strong{color:#1b2c4e;font-size:.88rem}.public-budget-filter small{margin-top:2px;color:#6f7c95;font-size:.72rem}.public-budget-filter label{display:flex;flex-direction:column;gap:5px}.public-budget-filter label span{color:#5f6d86;font-size:.7rem;font-weight:800}.public-budget-filter input,.public-budget-filter select{height:42px;min-width:0;border:1px solid #dfe5ef;border-radius:11px;padding:0 11px;background:#fff;color:#233452;font:inherit;font-size:.8rem;outline:none}.public-budget-filter select{padding-right:30px;text-overflow:ellipsis}.public-budget-filter input:focus,.public-budget-filter select:focus{border-color:#7ca5f6;box-shadow:0 0 0 3px rgba(47,115,245,.1)}.public-budget-filter button,.public-budget-filter>a{height:42px;border:0;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none;font:inherit;font-size:.78rem;font-weight:800;cursor:pointer}.public-budget-filter button{padding:0 16px;background:#0648e8;color:#fff}.public-budget-filter>a{border:1px solid #dce4f1;background:#fff;color:#0648e8}
.public-insight-tabs{min-height:70px;margin:0 0 14px;padding:0 18px;border:1px solid #e3e9f4;border-radius:15px;background:#eef3fd;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:end;gap:10px;overflow:hidden}.public-insight-tabs button{height:58px;padding:0 14px;border:0;border-radius:17px 17px 0 0;background:transparent;color:#68779a;display:flex;align-items:center;justify-content:center;gap:10px;font:inherit;font-size:.86rem;font-weight:800;cursor:pointer}.public-insight-tabs button i{width:32px;height:32px;border-radius:10px;background:#e2e9f8;color:#7786a9;display:grid;place-items:center}.public-insight-tabs button.active{background:#fff;color:#142a55;box-shadow:0 -5px 18px rgba(20,55,120,.06)}.public-insight-tabs button.active i{background:linear-gradient(145deg,#3678ff,#1458e3);color:#fff;box-shadow:0 7px 15px rgba(20,88,227,.23)}
.public-size-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.public-size-groups>section{padding:16px;border:1px solid #e4eaf4;border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(30,61,118,.05)}.public-size-groups header{display:flex;align-items:center;gap:11px;margin-bottom:14px}.public-size-groups header>span{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:1.35rem}.public-size-groups header>span.blue{background:#e5edff;color:#0648e8}.public-size-groups header>span.green{background:#dcf7ef;color:#009779}.public-size-groups h3{margin:0;color:#172947;font-size:1.05rem}.public-size-groups p{margin:3px 0 0;color:#6b7892;font-size:.78rem}.public-size-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.public-size-grid article{min-height:85px;padding:10px 5px;border:1px solid #e8edf5;border-radius:12px;background:#fbfcff;text-align:center;display:flex;flex-direction:column;justify-content:center}.public-size-grid span{color:#6d7a94;font-size:.68rem;font-weight:800}.public-size-grid strong{margin-top:4px;color:#0648e8;font-size:1.35rem;line-height:1}.public-size-grid small{margin-top:4px;color:#8994a8;font-size:.62rem}
.public-chart-card,.public-faculty-card{padding:16px 18px;border:1px solid #e3e9f4;border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(30,61,118,.05)}.public-chart-card>header,.public-faculty-card>header{display:flex;align-items:center;justify-content:space-between;gap:15px}.public-chart-card>header>div:first-child,.public-faculty-card>header{display:flex;align-items:center;gap:11px}.public-chart-card>header>div:first-child>span,.public-faculty-card>header>span{width:45px;height:45px;border-radius:13px;background:#e8efff;color:#0648e8;display:grid;place-items:center;font-size:1.2rem;flex:0 0 45px}.public-chart-card h3,.public-faculty-card h3{margin:0;color:#1a2c50;font-size:1.05rem}.public-chart-card p,.public-faculty-card p{margin:3px 0 0;color:#71809a;font-size:.77rem}.public-chart-legend{display:flex;align-items:center;gap:18px;color:#64708b;font-size:.72rem}.public-chart-legend span{display:flex;align-items:center;gap:6px}.public-chart-legend i{width:18px;height:3px;border-radius:999px}.public-chart-legend i.in{background:#0648e8}.public-chart-legend i.out{background:#ff2a80}.public-chart-wrap{height:270px;margin-top:5px}.public-chart-wrap svg{width:100%;height:100%;overflow:visible}.public-chart-grid{stroke:#e6ebf3;stroke-width:1}.public-chart-label{fill:#5f6c85;font-size:11px;font-family:"Roboto Condensed",sans-serif}.public-chart-line{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.public-chart-line.in{stroke:#0648e8}.public-chart-line.out{stroke:#ff2a80}.public-chart-dot.in{fill:#0648e8}.public-chart-dot.out{fill:#ff2a80}
.public-faculty-card>header{justify-content:flex-start;margin-bottom:13px}.public-faculty-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 14px}.public-faculty-list article{min-height:76px;padding:10px 12px;border:1px solid #e7ebf3;border-radius:13px;background:#fbfcff;display:flex;align-items:center;gap:10px;min-width:0}.public-faculty-list .rank{width:30px;height:30px;border-radius:9px;background:#e8efff;color:#0648e8;display:grid;place-items:center;font-weight:900;flex:0 0 30px}.public-faculty-list .rank-1{background:#fff1c9;color:#a26a00}.public-faculty-list .rank-2{background:#edf0f5;color:#6b7486}.public-faculty-list .rank-3{background:#ffe7d2;color:#a95b16}.public-faculty-list .faculty-icon{width:38px;height:38px;border-radius:11px;background:#e9efff;color:#164fd0;display:grid;place-items:center;flex:0 0 38px}.public-faculty-list article>div{min-width:0;flex:1}.public-faculty-list strong,.public-faculty-list small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.public-faculty-list strong{color:#223354;font-size:.8rem}.public-faculty-list small{margin-top:3px;color:#74809a;font-size:.68rem}.public-faculty-list progress{width:100%;height:6px;margin-top:7px;border:0;border-radius:999px;background:#e8edf5;appearance:none;overflow:hidden}.public-faculty-list progress::-webkit-progress-bar{background:#e8edf5}.public-faculty-list progress::-webkit-progress-value{background:linear-gradient(90deg,#0648e8,#7aa2ff);border-radius:999px}.public-faculty-list progress::-moz-progress-bar{background:linear-gradient(90deg,#0648e8,#7aa2ff);border-radius:999px}.public-faculty-list em{font-style:normal;font-weight:900;color:#0648e8;font-size:1rem}.public-empty{min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#78849d}.public-empty i{font-size:2rem;color:#9cb3df}.public-empty strong{color:#31415f}

@media(max-width:1050px){.public-budget-filter{grid-template-columns:minmax(220px,1fr) repeat(3,minmax(140px,.55fr))}.public-budget-filter button{grid-column:3}.public-budget-filter>a{grid-column:4}.public-size-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.public-budget-filter{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px}.public-budget-filter>div{grid-column:1/-1}.public-budget-filter label:nth-of-type(3){grid-column:1/-1}.public-budget-filter button,.public-budget-filter>a{grid-column:auto}.public-insight-tabs{display:flex;overflow-x:auto;align-items:stretch;padding:7px;min-height:65px}.public-insight-tabs button{min-width:155px;height:52px;border-radius:12px}.public-insight-tabs button.active{box-shadow:0 5px 16px rgba(20,55,120,.08)}.public-size-groups,.public-faculty-list{grid-template-columns:1fr}.public-size-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.public-chart-card>header{align-items:flex-start;flex-direction:column}.public-chart-wrap{overflow-x:auto}.public-chart-wrap svg{min-width:650px}}
@media(max-width:430px){.public-budget-filter{grid-template-columns:1fr}.public-budget-filter>*{grid-column:1!important}.public-insight-tabs button{min-width:145px}.public-size-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* =========================================================
   Mobile landing application view
   Bottom navigation, quick-action cards and compact content.
========================================================= */
.unej-mobile-actions,
.unej-mobile-bottom-nav{
    display:none;
}

.public-budget-filter label>span i{
    margin-right:5px;
    color:var(--unej-blue);
}

#beranda,
#stok,
#fitur,
#tentang,
#kontak{
    scroll-margin-top:86px;
}

@media(max-width:760px){
    html{
        scroll-padding-top:68px;
    }

    body.unej-public-page{
        padding-bottom:calc(88px + env(safe-area-inset-bottom,0px));
        background:#f4f7fc;
    }

    .unej-public-nav,
    .unej-public-nav.is-scrolled{
        left:0;
        transform:none;
        width:100%;
        height:64px;
        padding:0 14px;
        grid-template-columns:1fr;
        justify-items:center;
        border:0;
        border-bottom:1px solid rgba(220,228,243,.9);
        border-radius:0;
        background:rgba(255,255,255,.96);
        box-shadow:0 7px 22px rgba(20,48,105,.08);
        backdrop-filter:blur(16px);
    }

    .unej-public-brand{
        justify-self:center;
        gap:9px;
    }

    .unej-public-brand strong{
        font-size:1.45rem;
    }

    .unej-brand-symbol{
        width:27px;
        height:27px;
        flex-basis:27px;
    }

    .unej-brand-symbol i{
        width:22px;
        height:10px;
    }

    .unej-nav-links,
    .unej-nav-toggle,
    .unej-nav-login,
    .unej-nav-backdrop{
        display:none!important;
    }

    .unej-landing{
        background:#f4f7fc;
    }

    .unej-hero{
        padding:76px 0 12px;
        background:#f4f7fc;
        gap:12px;
    }

    .unej-hero-copy{
        width:calc(100% - 28px);
        margin:0 auto;
        padding:22px 18px 18px;
        border:1px solid #e3eaf6;
        border-radius:23px;
        background:linear-gradient(145deg,#fff 0%,#f8faff 100%);
        box-shadow:0 12px 30px rgba(22,54,113,.08);
        text-align:left;
    }

    .unej-hero-copy h1{
        font-size:clamp(2rem,10.5vw,3rem);
        line-height:1.02;
        letter-spacing:-.05em;
    }

    .unej-slider-dots{
        justify-content:flex-start;
        gap:9px;
        margin:15px 0 14px;
    }

    .unej-slider-dots i{
        width:9px;
        height:9px;
    }

    .unej-hero-copy>p{
        margin:0;
        font-size:.94rem;
        line-height:1.55;
    }

    .unej-hero-actions{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
        margin-top:20px;
    }

    .unej-btn{
        min-height:50px;
        width:100%;
        padding:0 12px;
        border-radius:13px;
        gap:8px;
        font-size:.88rem;
        line-height:1.15;
        text-align:center;
    }

    .unej-btn i{
        font-size:1.1rem;
    }

    .unej-trust-row{
        width:100%;
        max-width:none;
        margin:16px 0 0;
        padding:0 0 3px;
        display:flex;
        justify-content:flex-start;
        gap:9px;
        overflow-x:auto;
        scroll-snap-type:x proximity;
        scrollbar-width:none;
    }

    .unej-trust-row::-webkit-scrollbar{
        display:none;
    }

    .unej-trust-row article{
        min-width:178px;
        min-height:72px;
        padding:10px;
        border:1px solid #e5ebf5;
        border-radius:15px;
        background:#fff;
        box-shadow:0 7px 16px rgba(25,57,116,.05);
        scroll-snap-align:start;
    }

    .unej-trust-row article>span{
        width:42px;
        height:42px;
        flex-basis:42px;
        font-size:1.08rem;
    }

    .unej-trust-row strong{
        font-size:.82rem;
        white-space:normal;
    }

    .unej-trust-row small{
        font-size:.7rem;
        white-space:normal;
    }

    .unej-hero-visual{
        width:calc(100% - 28px);
        min-height:0;
        height:260px;
        margin:0 auto;
        border:1px solid #e0e8f4;
        border-radius:23px;
        background:#fff;
        box-shadow:0 12px 30px rgba(22,54,113,.08);
    }

    .unej-hero-visual img{
        border-radius:22px;
        object-position:56% top;
    }

    .unej-mobile-actions{
        display:block;
        margin:0;
        padding:12px 14px 20px;
        background:#f4f7fc;
    }

    .unej-mobile-section-head{
        margin:0 2px 11px;
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:10px;
    }

    .unej-mobile-section-head>div>span{
        display:block;
        color:var(--unej-blue);
        font-size:.67rem;
        font-weight:900;
        letter-spacing:.08em;
        text-transform:uppercase;
    }

    .unej-mobile-section-head h2{
        margin:3px 0 0;
        color:#172a4e;
        font-size:1.2rem;
        line-height:1.1;
    }

    .unej-mobile-section-head>i{
        width:38px;
        height:38px;
        border-radius:12px;
        display:grid;
        place-items:center;
        background:#e6eeff;
        color:var(--unej-blue);
        font-size:1.05rem;
    }

    .unej-mobile-action-grid{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
    }

    .unej-mobile-action-grid>a{
        position:relative;
        min-width:0;
        min-height:100px;
        padding:13px 34px 12px 12px;
        border:1px solid #e2e9f5;
        border-radius:18px;
        background:#fff;
        box-shadow:0 9px 22px rgba(25,57,116,.06);
        color:#1a2c4e;
        text-decoration:none;
        overflow:hidden;
    }

    .unej-mobile-action-grid>a>span{
        width:40px;
        height:40px;
        margin-bottom:9px;
        border-radius:13px;
        display:grid;
        place-items:center;
        font-size:1.08rem;
    }

    .unej-mobile-action-grid>a>span.blue{background:#e4edff;color:#0648e8}
    .unej-mobile-action-grid>a>span.purple{background:#efe5ff;color:#7333ca}
    .unej-mobile-action-grid>a>span.green{background:#def7ef;color:#008d70}
    .unej-mobile-action-grid>a>span.orange{background:#ffeddc;color:#dc720d}

    .unej-mobile-action-grid strong,
    .unej-mobile-action-grid small{
        display:block;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .unej-mobile-action-grid strong{
        font-size:.87rem;
    }

    .unej-mobile-action-grid small{
        margin-top:3px;
        color:#73809a;
        font-size:.68rem;
    }

    .unej-mobile-action-grid .action-arrow{
        position:absolute;
        top:16px;
        right:13px;
        color:#a2afc6;
        font-size:.82rem;
    }

    .unej-stock-section{
        margin:0 10px 14px;
        padding:17px 12px 16px;
        border:1px solid #e0e8f4;
        border-radius:23px;
        background:#f8faff;
        box-shadow:0 12px 30px rgba(22,54,113,.07);
    }

    .unej-stock-head{
        min-height:0;
        padding:0 2px 11px;
        align-items:flex-start;
    }

    .unej-stock-head h2{
        font-size:1.3rem;
    }

    .unej-stock-head p{
        max-width:250px;
        font-size:.73rem;
        line-height:1.35;
    }

    .unej-stock-head>a{
        min-width:max-content;
        padding-top:3px;
        font-size:.75rem;
    }

    .public-budget-filter{
        margin:0 0 12px;
        padding:11px;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
        border-radius:18px;
        box-shadow:none;
    }

    .public-budget-filter>div{
        grid-column:1/-1;
        padding-bottom:2px;
    }

    .public-budget-filter>div>i{
        width:39px;
        height:39px;
        border-radius:12px;
    }

    .public-budget-filter strong{
        font-size:.82rem;
    }

    .public-budget-filter small{
        font-size:.68rem;
    }

    .public-budget-filter label{
        padding:9px;
        border:1px solid #e5eaf3;
        border-radius:13px;
        background:#fbfcff;
    }

    .public-budget-filter label:nth-of-type(3){
        grid-column:1/-1;
    }

    .public-budget-filter label>span{
        display:flex;
        align-items:center;
        font-size:.67rem;
    }

    .public-budget-filter input,
    .public-budget-filter select{
        height:38px;
        padding:0 8px;
        border-color:#dfe6f1;
        border-radius:9px;
        font-size:.75rem;
    }

    .public-budget-filter button,
    .public-budget-filter>a{
        height:43px;
        grid-column:auto;
        border-radius:12px;
    }

    .public-insight-tabs{
        min-height:0;
        margin:0 0 12px;
        padding:8px;
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
        overflow:visible;
        border-radius:18px;
        background:#edf3fd;
    }

    .public-insight-tabs button{
        min-width:0;
        height:68px;
        padding:7px 6px;
        border:1px solid transparent;
        border-radius:14px;
        flex-direction:column;
        gap:4px;
        font-size:.7rem;
        line-height:1.1;
        text-align:center;
    }

    .public-insight-tabs button i{
        width:31px;
        height:31px;
        border-radius:10px;
        font-size:.9rem;
    }

    .public-insight-tabs button.active{
        border-color:#dce6f7;
        box-shadow:0 6px 15px rgba(20,55,120,.08);
    }

    .unej-stock-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
    }

    .unej-stock-card{
        min-height:148px;
        padding:12px 10px 10px;
        border-radius:16px;
        box-shadow:0 7px 18px rgba(29,60,119,.05);
    }

    .unej-stock-main{
        align-items:flex-start;
        gap:8px;
    }

    .unej-stock-icon{
        width:41px;
        height:41px;
        flex-basis:41px;
        border-radius:13px;
        font-size:1.2rem;
    }

    .unej-stock-copy h3{
        margin-bottom:5px;
        font-size:.76rem;
    }

    .unej-stock-number{
        display:block;
    }

    .unej-stock-number strong{
        display:block;
        font-size:1.32rem;
    }

    .unej-stock-number small{
        font-size:.65rem;
    }

    .unej-stock-card progress{
        height:6px;
        margin-top:12px;
    }

    .unej-stock-status{
        margin-top:8px;
        padding:4px 8px;
        font-size:.64rem;
    }

    .public-size-groups,
    .public-faculty-list{
        grid-template-columns:1fr;
    }

    .public-size-groups>section,
    .public-chart-card,
    .public-faculty-card{
        padding:13px;
        border-radius:17px;
        box-shadow:none;
    }

    .public-size-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:7px;
    }

    .public-size-grid article{
        min-height:73px;
        border-radius:11px;
    }

    .public-size-grid strong{
        font-size:1.1rem;
    }

    .public-chart-card>header{
        align-items:flex-start;
        flex-direction:column;
    }

    .public-chart-wrap{
        height:235px;
        overflow-x:auto;
    }

    .public-chart-wrap svg{
        min-width:620px;
    }

    .public-faculty-list article{
        min-height:72px;
        padding:9px;
        border-radius:13px;
    }

    .unej-security-strip{
        min-height:0;
        margin-top:11px;
        padding:11px;
        align-items:flex-start;
        border-radius:14px;
        font-size:.72rem;
        line-height:1.4;
    }

    .unej-feature-section{
        margin:0 10px 14px;
        padding:22px 12px;
        border:1px solid #e0e8f4;
        border-radius:23px;
        box-shadow:0 12px 30px rgba(22,54,113,.06);
    }

    .unej-section-title{
        margin-bottom:16px;
        text-align:left;
    }

    .unej-section-title h2,
    .unej-about-section h2{
        font-size:1.45rem;
    }

    .unej-section-title p,
    .unej-about-section p{
        font-size:.82rem;
        line-height:1.5;
    }

    .unej-feature-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
    }

    .unej-feature-grid article{
        min-height:154px;
        padding:13px;
        border-radius:16px;
        box-shadow:0 7px 17px rgba(24,57,118,.045);
    }

    .unej-feature-grid i{
        width:40px;
        height:40px;
        border-radius:12px;
        font-size:1rem;
    }

    .unej-feature-grid h3{
        margin:11px 0 5px;
        font-size:.85rem;
        line-height:1.2;
    }

    .unej-feature-grid p{
        font-size:.7rem;
        line-height:1.4;
    }

    .unej-about-section{
        margin:0 10px 14px;
        padding:26px 18px;
        border:1px solid #e0e8f4;
        border-radius:23px;
        background:#fff;
        box-shadow:0 12px 30px rgba(22,54,113,.06);
    }

    .unej-public-page .public-footer{
        margin:0 10px 4px;
        padding:24px 18px;
        border-radius:23px;
    }

    .unej-mobile-bottom-nav{
        position:fixed;
        z-index:90;
        left:10px;
        right:10px;
        bottom:max(8px,env(safe-area-inset-bottom,8px));
        min-height:70px;
        padding:6px 7px;
        border:1px solid rgba(220,228,243,.95);
        border-radius:19px;
        display:grid;
        grid-template-columns:repeat(5,minmax(0,1fr));
        align-items:center;
        background:rgba(255,255,255,.96);
        box-shadow:0 15px 38px rgba(18,44,94,.2);
        backdrop-filter:blur(18px);
    }

    .unej-mobile-bottom-nav>a{
        min-width:0;
        min-height:56px;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:3px;
        border-radius:14px;
        color:#71809a;
        text-decoration:none;
        -webkit-tap-highlight-color:transparent;
    }

    .unej-mobile-bottom-nav>a>span{
        width:34px;
        height:30px;
        border-radius:10px;
        display:grid;
        place-items:center;
        font-size:.98rem;
        transition:background .18s ease,color .18s ease,transform .18s ease;
    }

    .unej-mobile-bottom-nav>a>small{
        max-width:100%;
        font-size:.61rem;
        font-weight:700;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .unej-mobile-bottom-nav>a.active{
        color:var(--unej-blue);
    }

    .unej-mobile-bottom-nav>a.active>span{
        background:#e5edff;
        color:var(--unej-blue);
        transform:translateY(-1px);
    }
}

@media(max-width:430px){
    .unej-hero-copy{
        padding:20px 15px 16px;
    }

    .unej-hero-copy h1{
        font-size:2.15rem;
    }

    .unej-hero-visual{
        height:230px;
    }

    .public-budget-filter{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .public-budget-filter>*{
        grid-column:auto!important;
    }

    .public-budget-filter>div,
    .public-budget-filter label:nth-of-type(3){
        grid-column:1/-1!important;
    }

    .unej-stock-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .public-insight-tabs button{
        min-width:0;
    }

    .public-size-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media(max-width:360px){
    .unej-public-brand strong{
        font-size:1.3rem;
    }

    .unej-hero-actions{
        grid-template-columns:1fr;
    }

    .unej-mobile-action-grid,
    .unej-feature-grid{
        grid-template-columns:1fr;
    }

    .unej-mobile-action-grid>a,
    .unej-feature-grid article{
        min-height:auto;
    }

    .public-size-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .unej-mobile-bottom-nav{
        left:6px;
        right:6px;
        padding-left:3px;
        padding-right:3px;
    }

    .unej-mobile-bottom-nav>a>small{
        font-size:.56rem;
    }
}

/* =========================================================
   Compact gadget landing — image first, centered app shell.
   Smartphone and tablet intentionally keep a narrow mobile-app
   proportion so content never stretches across a wide screen.
========================================================= */
@media(max-width:1080px){
    html{
        background:#e9eef7;
        scroll-padding-top:64px;
    }

    body.unej-public-page{
        min-width:0;
        padding-bottom:calc(88px + env(safe-area-inset-bottom,0px));
        background:#e9eef7;
        overflow-x:hidden;
    }

    .unej-public-nav,
    .unej-public-nav.is-scrolled{
        left:50%;
        transform:translateX(-50%);
        top:0;
        width:min(100%,620px);
        height:62px;
        padding:0 15px;
        grid-template-columns:1fr;
        justify-items:center;
        border:0;
        border-bottom:1px solid rgba(220,228,243,.92);
        border-radius:0;
        background:rgba(255,255,255,.97);
        box-shadow:0 7px 22px rgba(20,48,105,.09);
        backdrop-filter:blur(16px);
    }

    .unej-public-brand{
        justify-self:center;
        gap:9px;
    }

    .unej-public-brand strong{
        font-size:1.48rem;
    }

    .unej-brand-symbol{
        width:27px;
        height:27px;
        flex-basis:27px;
    }

    .unej-brand-symbol i{
        width:22px;
        height:10px;
    }

    .unej-nav-links,
    .unej-nav-toggle,
    .unej-nav-login,
    .unej-nav-backdrop{
        display:none!important;
    }

    .unej-landing{
        width:min(100%,620px);
        min-height:100vh;
        margin:0 auto;
        background:#f3f6fb;
        box-shadow:0 0 44px rgba(24,52,104,.12);
        overflow:hidden;
    }

    .unej-hero{
        min-height:0;
        padding:62px 0 7px;
        display:flex;
        flex-direction:column;
        gap:0;
        background:#f3f6fb;
        overflow:visible;
    }

    .unej-hero-visual{
        order:1;
        width:100%;
        height:clamp(260px,45vw,335px);
        min-height:0;
        margin:0;
        border:0;
        border-radius:0 0 30px 30px;
        background:#dfe8f8;
        box-shadow:none;
        overflow:hidden;
    }

    .unej-hero-visual picture,
    .unej-hero-visual img{
        width:100%;
        height:100%;
    }

    .unej-hero-visual img{
        border-radius:0 0 30px 30px;
        object-fit:cover;
        object-position:56% top;
    }

    .unej-hero-copy{
        order:2;
        z-index:8;
        width:calc(100% - 20px);
        max-width:none;
        margin:-28px auto 8px;
        padding:20px 18px 16px;
        border:1px solid #e0e7f3;
        border-radius:24px;
        background:rgba(255,255,255,.98);
        box-shadow:0 15px 34px rgba(22,54,113,.13);
        text-align:left;
    }

    .unej-hero-copy h1{
        font-size:clamp(2rem,6.1vw,2.5rem);
        line-height:1.02;
        letter-spacing:-.045em;
    }

    .unej-slider-dots{
        justify-content:flex-start;
        gap:8px;
        margin:13px 0 12px;
    }

    .unej-slider-dots i{
        width:8px;
        height:8px;
    }

    .unej-hero-copy>p{
        max-width:none;
        margin:0;
        font-size:.92rem;
        line-height:1.5;
    }

    .unej-hero-actions{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
        margin-top:17px;
    }

    .unej-btn{
        width:100%;
        min-width:0;
        min-height:48px;
        padding:0 10px;
        border-radius:13px;
        gap:7px;
        font-size:.86rem;
        line-height:1.15;
        text-align:center;
    }

    .unej-trust-row{
        width:100%;
        max-width:none;
        margin:14px 0 0;
        padding:0;
        display:grid;
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:7px;
        overflow:visible;
    }

    .unej-trust-row article{
        min-width:0;
        min-height:78px;
        padding:9px 5px 8px;
        border:1px solid #e6ebf4;
        border-radius:14px;
        background:#fbfcff;
        box-shadow:none;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:flex-start;
        gap:5px;
        text-align:center;
    }

    .unej-trust-row article>span{
        width:36px;
        height:36px;
        flex:0 0 36px;
        font-size:.96rem;
    }

    .unej-trust-row strong{
        font-size:.7rem;
        line-height:1.08;
        white-space:normal;
    }

    .unej-trust-row small{
        display:none;
    }

    .unej-mobile-actions{
        width:calc(100% - 20px);
        margin:0 auto 10px;
        padding:13px 10px 11px;
        border:1px solid #e0e7f3;
        border-radius:24px;
        display:block;
        background:#fff;
        box-shadow:0 12px 28px rgba(22,54,113,.08);
    }

    .unej-mobile-section-head{
        margin:0 3px 10px;
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:10px;
    }

    .unej-mobile-section-head>div>span{
        display:block;
        color:var(--unej-blue);
        font-size:.64rem;
        font-weight:900;
        letter-spacing:.08em;
        text-transform:uppercase;
    }

    .unej-mobile-section-head h2{
        margin:2px 0 0;
        color:#172a4e;
        font-size:1.05rem;
        line-height:1.1;
    }

    .unej-mobile-section-head>i{
        width:34px;
        height:34px;
        border-radius:11px;
        display:grid;
        place-items:center;
        background:#e6eeff;
        color:var(--unej-blue);
        font-size:.95rem;
    }

    .unej-mobile-action-grid{
        display:grid;
        grid-template-columns:repeat(4,minmax(0,1fr));
        gap:7px 4px;
    }

    .unej-mobile-action-grid>a{
        position:relative;
        min-width:0;
        min-height:78px;
        padding:5px 2px 4px;
        border:0;
        border-radius:14px;
        background:transparent;
        box-shadow:none;
        color:#1a2c4e;
        text-decoration:none;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:flex-start;
        text-align:center;
        overflow:hidden;
        -webkit-tap-highlight-color:transparent;
    }

    .unej-mobile-action-grid>a:active{
        background:#f2f6ff;
        transform:scale(.98);
    }

    .unej-mobile-action-grid>a>span{
        width:43px;
        height:43px;
        margin:0 auto 6px;
        border-radius:50%;
        display:grid;
        place-items:center;
        font-size:1.05rem;
        box-shadow:0 7px 13px rgba(32,66,130,.11);
    }

    .unej-mobile-action-grid>a>span.blue{background:linear-gradient(145deg,#5a80ff,#3b61e8);color:#fff}
    .unej-mobile-action-grid>a>span.purple{background:linear-gradient(145deg,#8f62ff,#6743e8);color:#fff}
    .unej-mobile-action-grid>a>span.red{background:linear-gradient(145deg,#ff5e61,#ef3038);color:#fff}
    .unej-mobile-action-grid>a>span.pink{background:linear-gradient(145deg,#e647dc,#bd28c1);color:#fff}
    .unej-mobile-action-grid>a>span.cyan{background:linear-gradient(145deg,#36bddf,#1792bf);color:#fff}
    .unej-mobile-action-grid>a>span.green{background:linear-gradient(145deg,#48cda5,#159a79);color:#fff}
    .unej-mobile-action-grid>a>span.indigo{background:linear-gradient(145deg,#7998f7,#4c69d7);color:#fff}
    .unej-mobile-action-grid>a>span.orange{background:linear-gradient(145deg,#ff9b56,#f16b28);color:#fff}

    .unej-mobile-action-grid strong,
    .unej-mobile-action-grid small{
        width:100%;
        display:block;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .unej-mobile-action-grid strong{
        font-size:.68rem;
        line-height:1.15;
    }

    .unej-mobile-action-grid small{
        margin-top:2px;
        color:#8994a8;
        font-size:.56rem;
    }

    .unej-mobile-action-grid .action-arrow{
        display:none;
    }

    .unej-stock-section,
    .unej-feature-section,
    .unej-about-section,
    .unej-public-page .public-footer{
        width:calc(100% - 20px);
        margin-left:auto;
        margin-right:auto;
    }

    .unej-stock-section{
        margin-top:0;
        margin-bottom:10px;
        padding:16px 11px 15px;
        border:1px solid #e0e7f3;
        border-radius:24px;
        background:#f9fbff;
        box-shadow:0 12px 28px rgba(22,54,113,.07);
    }

    .unej-stock-head{
        min-height:0;
        padding:0 2px 10px;
        align-items:flex-start;
    }

    .unej-stock-head h2{
        font-size:1.25rem;
    }

    .unej-stock-head p{
        max-width:330px;
        font-size:.72rem;
        line-height:1.35;
    }

    .unej-stock-head>a{
        padding-top:3px;
        font-size:.72rem;
        white-space:nowrap;
    }

    .public-budget-filter{
        margin:0 0 11px;
        padding:10px;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
        border-radius:18px;
        box-shadow:none;
    }

    .public-budget-filter>div,
    .public-budget-filter label:nth-of-type(3){
        grid-column:1/-1;
    }

    .public-budget-filter label{
        padding:8px;
        border:1px solid #e5eaf3;
        border-radius:12px;
        background:#fbfcff;
    }

    .public-budget-filter input,
    .public-budget-filter select{
        width:100%;
        height:37px;
        min-width:0;
        padding:0 7px;
        border-radius:9px;
        font-size:.72rem;
    }

    .public-budget-filter button,
    .public-budget-filter>a{
        height:41px;
        grid-column:auto;
        border-radius:11px;
    }

    .public-insight-tabs{
        min-height:0;
        margin:0 0 11px;
        padding:7px;
        display:grid;
        grid-template-columns:repeat(4,minmax(0,1fr));
        gap:5px;
        overflow:visible;
        border-radius:17px;
        background:#edf3fd;
    }

    .public-insight-tabs button{
        min-width:0;
        height:62px;
        padding:6px 2px;
        border:1px solid transparent;
        border-radius:13px;
        flex-direction:column;
        gap:4px;
        font-size:.6rem;
        line-height:1.05;
        text-align:center;
    }

    .public-insight-tabs button i{
        width:29px;
        height:29px;
        border-radius:10px;
        font-size:.84rem;
    }

    .public-insight-tabs button.active{
        border-color:#dce6f7;
        box-shadow:0 5px 14px rgba(20,55,120,.08);
    }

    .unej-stock-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
    }

    .unej-stock-card{
        min-width:0;
        min-height:143px;
        padding:11px 9px 9px;
        border-radius:15px;
    }

    .public-size-groups,
    .public-faculty-list{
        grid-template-columns:1fr;
    }

    .public-size-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .public-chart-wrap{
        width:100%;
        height:225px;
        overflow:hidden;
    }

    .public-chart-wrap svg{
        width:100%;
        min-width:0;
    }

    .unej-feature-section{
        margin-top:0;
        margin-bottom:10px;
        padding:21px 12px;
        border:1px solid #e0e7f3;
        border-radius:24px;
        background:#fff;
        box-shadow:0 12px 28px rgba(22,54,113,.06);
    }

    .unej-section-title{
        margin-bottom:15px;
        text-align:left;
    }

    .unej-section-title h2,
    .unej-about-section h2{
        font-size:1.4rem;
    }

    .unej-section-title p,
    .unej-about-section p{
        font-size:.8rem;
        line-height:1.5;
    }

    .unej-feature-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
    }

    .unej-feature-grid article{
        min-height:148px;
        padding:12px;
        border-radius:15px;
    }

    .unej-about-section{
        margin-top:0;
        margin-bottom:10px;
        padding:25px 17px;
        border:1px solid #e0e7f3;
        border-radius:24px;
        background:#fff;
        box-shadow:0 12px 28px rgba(22,54,113,.06);
    }

    .unej-public-page .public-footer{
        margin-top:0;
        margin-bottom:4px;
        padding:23px 17px;
        border-radius:24px;
    }

    .unej-mobile-bottom-nav{
        position:fixed;
        z-index:90;
        left:50%;
        right:auto;
        bottom:max(8px,env(safe-area-inset-bottom,8px));
        width:min(calc(100% - 20px),600px);
        min-height:68px;
        padding:6px 7px;
        border:1px solid rgba(220,228,243,.96);
        border-radius:19px;
        display:grid;
        grid-template-columns:repeat(5,minmax(0,1fr));
        align-items:center;
        background:rgba(255,255,255,.97);
        box-shadow:0 15px 38px rgba(18,44,94,.2);
        backdrop-filter:blur(18px);
        transform:translateX(-50%);
    }

    .unej-mobile-bottom-nav>a{
        min-width:0;
        min-height:54px;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:3px;
        border-radius:14px;
        color:#71809a;
        text-decoration:none;
    }

    .unej-mobile-bottom-nav>a>span{
        width:33px;
        height:29px;
        border-radius:10px;
        display:grid;
        place-items:center;
        font-size:.96rem;
    }

    .unej-mobile-bottom-nav>a>small{
        max-width:100%;
        font-size:.6rem;
        font-weight:700;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .unej-mobile-bottom-nav>a.active{
        color:var(--unej-blue);
    }

    .unej-mobile-bottom-nav>a.active>span{
        background:#e5edff;
        color:var(--unej-blue);
    }
}

@media(max-width:480px){
    .unej-hero-visual{
        height:226px;
    }

    .unej-hero-copy{
        margin-top:-24px;
        padding:17px 14px 14px;
    }

    .unej-hero-copy h1{
        font-size:1.88rem;
    }

    .unej-hero-copy>p{
        font-size:.82rem;
    }

    .unej-btn{
        min-height:45px;
        font-size:.76rem;
    }

    .unej-mobile-action-grid strong{
        font-size:.63rem;
    }

    .unej-mobile-action-grid small{
        font-size:.52rem;
    }

    .public-insight-tabs button span{
        max-width:100%;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
}

@media(max-width:350px){
    .unej-hero-actions{
        grid-template-columns:1fr;
    }

    .unej-mobile-action-grid>a>span{
        width:39px;
        height:39px;
    }

    .unej-trust-row strong{
        font-size:.62rem;
    }

    .public-insight-tabs button{
        font-size:.55rem;
    }
}


/* Hero slideshow: clickable dots, autoplay, keyboard and swipe navigation. */
.unej-hero-slider{
    position:relative;
}

.unej-hero-slide-content h1,
.unej-hero-slide-content>p{
    transition:opacity .18s ease,transform .18s ease;
}

.unej-hero-slide-content.is-changing h1,
.unej-hero-slide-content.is-changing>p{
    opacity:0;
    transform:translateY(8px);
}

.unej-slider-dots{
    position:relative;
    z-index:3;
}

.unej-slider-dots button{
    width:30px;
    height:30px;
    margin:0;
    padding:0;
    border:0;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:transparent;
    cursor:pointer;
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
}

.unej-slider-dots button>span{
    width:13px;
    height:13px;
    border-radius:999px;
    display:block;
    background:#aab2c2;
    box-shadow:0 0 0 0 rgba(7,72,232,0);
    transition:width .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease;
}

.unej-slider-dots button:hover>span{
    background:#73809a;
    transform:scale(1.08);
}

.unej-slider-dots button.active>span{
    width:13px;
    background:var(--unej-blue);
    box-shadow:0 5px 13px rgba(7,72,232,.25);
}

.unej-slider-dots button:focus-visible{
    outline:3px solid rgba(7,72,232,.22);
    outline-offset:1px;
}

@media(max-width:980px){
    .unej-hero-slide-content{
        min-height:260px;
    }
}

@media(max-width:760px){
    .unej-hero-slide-content{
        min-height:0;
    }

    .unej-slider-dots button{
        width:27px;
        height:27px;
    }

    .unej-slider-dots button>span{
        width:9px;
        height:9px;
    }

    .unej-slider-dots button.active>span{
        width:9px;
    }
}

@media(max-width:480px){
    .unej-slider-dots button{
        width:25px;
        height:25px;
    }

    .unej-slider-dots button>span{
        width:8px;
        height:8px;
    }

    .unej-slider-dots button.active>span{
        width:8px;
    }
}

@media(prefers-reduced-motion:reduce){
    .unej-hero-slide-content h1,
    .unej-hero-slide-content>p,
    .unej-slider-dots button>span{
        transition:none;
    }
}


.unej-hero-copy h1 [data-hero-line-one]{
    margin-top:0;
}

.visually-hidden{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
}

/* Hero image slideshow: the original hero remains slide one, while slides two and three use thematic almamater imagery. */
.unej-hero-visual{
    isolation:isolate;
    background:#dfe8f8;
}

.unej-hero-visual .unej-hero-image{
    position:absolute;
    inset:0;
    z-index:1;
    width:100%;
    height:100%;
    display:block;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:scale(1.018);
    transition:opacity .55s ease,transform 1.05s ease,visibility 0s linear .55s;
}

.unej-hero-visual .unej-hero-image.active{
    z-index:2;
    opacity:1;
    visibility:visible;
    transform:scale(1);
    transition-delay:0s;
}

.unej-hero-visual .unej-hero-image img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

.unej-hero-visual .unej-hero-image:first-child img{
    object-position:left top;
}

.unej-hero-visual .unej-hero-image-size img{
    object-position:52% 48%;
}

.unej-hero-visual .unej-hero-image-distribution img{
    object-position:54% 46%;
}

@media(max-width:980px){
    .unej-hero-visual .unej-hero-image:first-child img{
        object-position:56% top;
    }

    .unej-hero-visual .unej-hero-image-size img{
        object-position:52% 43%;
    }

    .unej-hero-visual .unej-hero-image-distribution img{
        object-position:54% 44%;
    }
}

@media(prefers-reduced-motion:reduce){
    .unej-hero-visual .unej-hero-image{
        transform:none;
        transition:none;
    }
}


/* Dokumen penerimaan dan peringatan stok < 1.000 */
@keyframes stockAlertPulse{0%,100%{opacity:1;filter:none}50%{opacity:.48;filter:saturate(1.25)}}
.stock-alert-blink{animation:stockAlertPulse 1.15s ease-in-out infinite}
.stock-alert-row{background:linear-gradient(90deg,rgba(255,61,113,.075),transparent 72%)}
.stock-quantity{display:inline-flex;align-items:center;font-weight:800;border-radius:9px;padding:.28rem .55rem}
.stock-alert-card{border-color:rgba(255,61,113,.42)!important;background:linear-gradient(145deg,#fff,#fff4f7)!important;box-shadow:0 8px 22px rgba(255,61,113,.12)!important}
.document-receipt-section{margin-top:1.25rem;padding-top:.35rem;border-top:1px solid #e7ecf8}
.document-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem;margin:1rem 0}
.document-card{display:grid;grid-template-columns:88px minmax(0,1fr);gap:.9rem;align-items:stretch;padding:.8rem;border:1px solid #e5eaf5;border-radius:18px;background:#fff;box-shadow:0 8px 26px rgba(33,64,145,.07)}
.document-preview{min-height:96px;border-radius:14px;overflow:hidden;background:#edf3ff;display:flex;align-items:center;justify-content:center;flex-direction:column;text-decoration:none;color:#1255e8}
.document-preview img{width:100%;height:100%;min-height:96px;object-fit:cover;display:block}
.document-preview.pdf{background:linear-gradient(145deg,#fff0f2,#ffe3e8);color:#dc3545}.document-preview.pdf i{font-size:2.2rem}.document-preview.pdf span{font-weight:800;font-size:.74rem}
.document-card-body{min-width:0;display:flex;flex-direction:column;gap:.18rem}.document-card-body>span{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#6b7899}.document-card-body strong{color:#142553}.document-card-body small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#63708f}.document-card-body em{font-size:.75rem;color:#8490ac;font-style:normal}.document-card-body p{margin:.3rem 0 0;font-size:.8rem;color:#52617e}
.document-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:1.5rem;border:1px dashed #cfd8ed;border-radius:18px;background:#f8faff;color:#6b7899}.document-empty i{font-size:2rem;color:#2d63ff}.document-empty strong{margin-top:.35rem;color:#26375f}.document-empty small{margin-top:.2rem}
.document-upload-form{margin-top:1rem;padding:1rem;border:1px solid #dfe6f5;border-radius:18px;background:linear-gradient(145deg,#fbfcff,#f5f8ff)}
.document-upload-heading{display:flex;align-items:center;gap:.75rem;margin-bottom:.85rem}.document-upload-heading>div{display:flex;flex-direction:column}.document-upload-heading strong{color:#162755}.document-upload-heading small{color:#6f7b98}
@media(max-width:680px){.document-card{grid-template-columns:72px minmax(0,1fr)}.document-preview,.document-preview img{min-height:82px}.document-upload-form{padding:.8rem}}
@media(prefers-reduced-motion:reduce){.stock-alert-blink{animation:none!important}.stock-alert-card{outline:2px solid rgba(255,61,113,.36)}}
