*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f6f7f9;color:var(--text)}.container{width:1180px;margin:auto}a{text-decoration:none;color:inherit}.topbar{background:var(--primary);color:var(--dark);font-size:13px;padding:11px 0}.top-flex span{margin-right:28px}.top-flex .right{float:right;margin-right:0}.top-flex a{margin-left:15px}.navbar{background:white;padding:20px 0;box-shadow:0 1px 8px #eee;position:sticky;top:0;z-index:10}.nav-flex{display:flex;justify-content:space-between;align-items:center}.brand{display:flex;gap:15px;align-items:center;font-size:16px}.brand img{width:70px;height:70px;object-fit:contain}.menu{list-style:none;margin:0;padding:0;display:flex;gap:24px}.menu a{font-weight:bold;font-size:14px;padding:12px 0;position:relative}.menu a:after{content:"";position:absolute;left:0;bottom:5px;width:0;height:3px;background:var(--primary);transition:.3s}.menu a:hover:after{width:100%}.mobile-btn{display:none}.hero-slider{position:relative;background:linear-gradient(90deg,var(--secondary) 0%,#fffaf0 45%,#dceeff 100%);min-height:540px;overflow:hidden}.slide{display:none;padding:70px 0 95px}.slide.active{display:block;animation:fadeSlide .8s}.hero-flex{display:flex;align-items:center}.hero-text{width:48%}.hero-text h1{font-size:47px;line-height:1.12;margin:0 0 20px}.hero-text h1::first-line{color:var(--dark)}.hero-text p{font-size:17px;line-height:1.8;margin-bottom:25px;color:#253a58}.btn{display:inline-block;padding:14px 28px;border-radius:25px;margin-right:12px;font-weight:bold;transition:.3s}.btn:hover{transform:translateY(-3px);box-shadow:0 10px 20px #ccc}.dark{background:var(--dark);color:white}.light{border:2px solid var(--dark);color:var(--dark);background:white}.hero-img{width:52%}.hero-img img{width:100%;height:380px;object-fit:cover;border-radius:24px;box-shadow:0 20px 45px #c9c9c9;animation:float 4s ease-in-out infinite}.slide-btn{position:absolute;top:50%;transform:translateY(-50%);width:45px;height:45px;border:0;border-radius:50%;background:white;color:var(--dark);font-size:34px;cursor:pointer;box-shadow:0 6px 20px #aaa}.prev{left:20px}.next{right:20px}.floating-card{display:grid;grid-template-columns:1.1fr 1.25fr 1.1fr;background:#fff;margin-top:-60px;border-radius:14px;box-shadow:0 10px 30px #d4d4d4;overflow:hidden;position:relative;z-index:2}.stat-box,.achievement{padding:35px 45px;border-right:1px solid #eee}.big{font-size:35px;color:var(--primary);font-weight:bold}.medium{font-size:32px;color:var(--primary);font-weight:bold}.split{display:flex;justify-content:space-around;text-align:center}.split span{font-size:30px;color:var(--primary);font-weight:bold}.avatar{width:58px;height:58px;background:var(--primary);border-radius:50%;float:left;margin-right:15px}.shortcut{margin-top:28px;background:white;border-radius:12px;display:grid;grid-template-columns:repeat(5,1fr);box-shadow:0 7px 20px #ddd}.shortcut a{padding:23px 25px;border-right:1px solid #eee;display:flex;gap:12px;align-items:center;transition:.3s}.shortcut a:hover{background:var(--secondary);transform:translateY(-4px)}.grid-two{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:25px}.panel{background:white;border-radius:12px;padding:22px;box-shadow:0 6px 18px #e2e2e2}.panel h3{margin-top:0}.panel h3 a{float:right;font-size:12px;color:var(--primary)}.video{height:240px;background:var(--dark);border-radius:10px;color:white;font-size:60px;display:flex;align-items:center;justify-content:center}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.gallery img{width:100%;height:105px;object-fit:cover;border-radius:8px;transition:.3s}.gallery img:hover{transform:scale(1.06)}.section-title{margin-top:35px}.section-title h2{margin-bottom:5px;border-bottom:4px solid var(--primary);display:inline-block}.prodi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.card{text-align:center;background:white;border-radius:12px;padding:35px;box-shadow:0 6px 18px #e5e5e5;transition:.3s}.card:hover{transform:translateY(-8px)}.circle{width:64px;height:64px;background:var(--primary);color:white;border-radius:50%;margin:auto;display:flex;align-items:center;justify-content:center;font-size:24px}.content-grid{display:grid;grid-template-columns:1.1fr .9fr 1.1fr 1.1fr;gap:20px;margin-top:35px}.list{display:flex;gap:12px;border-bottom:1px solid #eee;padding:10px 0}.list img{width:80px;height:55px;object-fit:cover;border-radius:6px;flex:none}.cover-img{width:100%;border-radius:10px;margin-bottom:10px}.notice{display:flex;gap:12px;border-bottom:1px solid #eee}.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.testi{background:white;border-radius:14px;padding:25px;box-shadow:0 6px 18px #e5e5e5}.testi img{width:75px;height:75px;border-radius:50%;object-fit:cover;float:left;margin-right:15px}.partner{background:white;margin-top:35px;padding:25px 0}.partner-row{display:flex;justify-content:space-between;align-items:center}.partner-row img{height:55px;max-width:150px}footer{background:var(--primary);padding:35px 0 15px;color:var(--dark)}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:35px}.copy{text-align:center;border-top:1px solid rgba(0,0,0,.15);padding-top:15px;margin-top:25px}.page-hero{background:linear-gradient(135deg,var(--dark),var(--primary));color:white;padding:70px 0}.page-hero h1{font-size:42px}.page-card,.page-space{margin-top:30px}.page-card{background:white;border-radius:14px;padding:30px;box-shadow:0 8px 25px #ddd;font-size:18px;line-height:1.8}.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.news-card{background:white;border-radius:14px;padding:18px;box-shadow:0 8px 20px #ddd;transition:.3s}.news-card:hover{transform:translateY(-6px)}.news-card img,.detail-img{width:100%;border-radius:12px}.gallery-page{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.gallery-page div{background:white;padding:15px;border-radius:12px;box-shadow:0 8px 20px #ddd}.gallery-page img{width:100%;border-radius:10px}.row-item{border-bottom:1px solid #eee;padding:15px 0}.reveal{opacity:0;transform:translateY(30px);transition:all .8s ease}.reveal.show{opacity:1;transform:none}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes fadeSlide{from{opacity:.2;transform:scale(1.02)}to{opacity:1;transform:scale(1)}}@media(max-width:900px){.container{width:94%}.top-flex .right{float:none}.nav-flex{display:block}.mobile-btn{display:block;float:right;margin-top:-50px}.menu{display:none;padding-top:20px}.menu.show{display:block}.menu li{margin:12px 0}.hero-flex{display:block}.hero-text,.hero-img{width:100%}.hero-text h1{font-size:34px}.floating-card,.grid-two,.prodi-grid,.content-grid,.testi-grid,.footer-grid,.news-grid,.gallery-page{grid-template-columns:1fr}.shortcut{grid-template-columns:1fr}.partner-row{display:block}}


/* Statistik model Universitas Terbuka - mengikuti warna dari pengaturan web */
.statistik-ut{
    margin-top:-70px;
    position:relative;
    z-index:3;
    min-height:380px;
    border-radius:28px;
    padding:55px 70px;
    color:white;
    background:
        radial-gradient(circle at 35% 30%, rgba(255,255,255,.12), transparent 30%),
        radial-gradient(circle at 70% 80%, rgba(255,255,255,.10), transparent 28%),
        linear-gradient(135deg, var(--primary), var(--dark));
    box-shadow:0 18px 45px rgba(0,0,0,.18);
    display:grid;
    grid-template-columns:1fr 1.15fr 1fr;
    align-items:center;
    gap:35px;
    overflow:hidden;
}
.statistik-ut:before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size:55px 55px;
    opacity:.24;
}
.statistik-ut > div{position:relative;z-index:1}
.stat-ut-col{text-align:center}
.stat-number{
    font-size:48px;
    font-weight:800;
    line-height:1;
    color:#fff;
    margin-bottom:10px;
}
.stat-number.yellow{color:#ffef3a}
.stat-ut-col h3,.prestasi-ut h3{font-size:22px;margin:8px 0 12px;color:#fff}
.stat-ut-col p{font-size:18px;margin:10px 0;color:#fff}
.prestasi-ut h3{text-align:center;margin-bottom:25px}
.prestasi-ut h3 span{font-size:42px;vertical-align:middle;margin-left:20px}
.prestasi-item{
    display:grid;
    grid-template-columns:78px 1fr;
    gap:18px;
    align-items:center;
    margin-bottom:25px;
}
.prestasi-avatar{
    width:78px;
    height:78px;
    border-radius:50%;
    background:rgba(255,255,255,.2);
    border:3px solid rgba(255,255,255,.35);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
}
.prestasi-item p{margin:0;font-size:16px;line-height:1.35;color:#fff}
.circle img{
    width:36px;
    height:36px;
    object-fit:contain;
}
@media(max-width:900px){
    .statistik-ut{grid-template-columns:1fr;padding:35px 25px;margin-top:-35px}
}

.profile-video{
width:100%;
height:240px;
border-radius:12px;
object-fit:cover;
background:#000;
}

.youtube-wrap{
    position:relative;
    width:100%;
    height:240px;
    overflow:hidden;
    border-radius:12px;
    background:#000;
}
.youtube-wrap iframe{
    width:100%;
    height:100%;
}

.book-slider{
    position:relative;
    min-height:255px;
    overflow:hidden;
}
.book-slide{
    display:none;
    animation:fadeSlide .7s;
}
.book-slide.active{
    display:block;
}
.book-slide img{
    height:190px;
    object-fit:cover;
}
.gallery{
    display:grid !important;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}
.gallery a{display:block}
.gallery img{
    width:100%;
    height:105px;
    object-fit:cover;
    border-radius:8px;
}


/* Header paling atas model modern */
.topbar-modern{
    background:var(--primary);
    padding:13px 0;
    color:var(--dark);
}
.top-modern-flex{
    display:grid;
    grid-template-columns:1fr 330px 1fr;
    align-items:center;
    gap:20px;
}
.pmb-link{
    font-weight:700;
    font-size:15px;
}
.top-search input{
    width:100%;
    border:0;
    border-radius:12px;
    padding:12px 16px;
    font-size:16px;
    outline:none;
    background:white;
}
.top-social{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:9px;
}
.top-social a{
    width:34px;
    height:34px;
    border-radius:10px;
    background:#fff;
    color:#0b55c4;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    font-size:14px;
}
.top-social img{
    height:38px;
    max-width:120px;
    object-fit:contain;
    margin-left:8px;
}
.top-social span{
    font-weight:700;
    margin-left:7px;
}
@media(max-width:900px){
    .top-modern-flex{
        grid-template-columns:1fr;
        text-align:center;
    }
    .top-social{
        justify-content:center;
        flex-wrap:wrap;
    }
}


/* UPDATE V7 - Hero image menyatu dengan tulisan, bukan kotak/card */
.hero-slider{
    background:
        radial-gradient(circle at 85% 15%, rgba(255,255,255,.65), transparent 25%),
        radial-gradient(circle at 25% 20%, rgba(255,255,255,.55), transparent 30%),
        linear-gradient(90deg, var(--secondary) 0%, #fff9ec 48%, #e6f3ff 100%) !important;
}
.slide{
    padding:72px 0 110px !important;
}
.hero-flex{
    gap:25px;
}
.hero-text{
    width:46%;
    position:relative;
    z-index:2;
}
.hero-img{
    width:54%;
    display:flex;
    align-items:flex-end;
    justify-content:center;
    position:relative;
}
.hero-img:before{
    content:"";
    position:absolute;
    right:0;
    top:-40px;
    width:96%;
    height:112%;
    background:
        radial-gradient(circle at center, rgba(255,255,255,.55), transparent 62%),
        radial-gradient(circle at 70% 30%, rgba(255,255,255,.3), transparent 40%);
    z-index:0;
}
.hero-img img{
    position:relative;
    z-index:1;
    width:100% !important;
    height:420px !important;
    object-fit:contain !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:transparent !important;
    animation:float 4s ease-in-out infinite;
}
@media(max-width:900px){
    .hero-img img{
        height:auto !important;
        max-height:360px;
    }
}


/* UPDATE V8 - Background slider gradasi abstrak biru seperti referensi */
.hero-slider{
    background:
        radial-gradient(ellipse at 88% 8%, rgba(0,112,255,.55) 0%, rgba(0,112,255,.25) 24%, transparent 48%),
        radial-gradient(ellipse at 95% 34%, rgba(0,82,210,.75) 0%, rgba(0,82,210,.35) 25%, transparent 52%),
        radial-gradient(ellipse at 82% 60%, rgba(58,155,255,.55) 0%, rgba(58,155,255,.22) 34%, transparent 58%),
        linear-gradient(120deg, #ffffff 0%, #ffffff 42%, #e8f3ff 58%, #1f8cff 100%) !important;
    position:relative;
}
.hero-slider:before{
    content:"";
    position:absolute;
    right:-90px;
    top:-110px;
    width:620px;
    height:340px;
    border-radius:50%;
    background:rgba(255,255,255,.28);
    transform:rotate(-13deg);
    box-shadow:
        -90px 70px 0 rgba(255,255,255,.18),
        -180px 132px 0 rgba(255,255,255,.13),
        -260px 190px 0 rgba(255,255,255,.10);
}
.hero-slider:after{
    content:"";
    position:absolute;
    right:-120px;
    bottom:-110px;
    width:760px;
    height:280px;
    border-radius:50%;
    background:rgba(0,64,180,.16);
    transform:rotate(-10deg);
}
.slide{
    position:relative;
    z-index:1;
}
.hero-img:before{
    background:
        radial-gradient(circle at center, rgba(255,255,255,.30), transparent 64%),
        radial-gradient(circle at 80% 20%, rgba(255,255,255,.22), transparent 44%) !important;
}


/* UPDATE V9 - Gradasi pada gambar dan teks hero header */
.hero-text h1{
    background:linear-gradient(90deg,#0d2d62 0%, #1f5fd1 45%, #39a2ff 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    color:transparent;
}

.hero-text p{
    background:linear-gradient(90deg,#4a4a4a 0%, #5c6f8e 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    color:transparent;
}

.hero-img img{
    filter:
        drop-shadow(0 18px 35px rgba(0,102,255,.22))
        saturate(1.08)
        contrast(1.03);
    mask-image:linear-gradient(to left, rgba(0,0,0,1) 72%, rgba(0,0,0,.55) 88%, transparent 100%);
    -webkit-mask-image:linear-gradient(to left, rgba(0,0,0,1) 72%, rgba(0,0,0,.55) 88%, transparent 100%);
}


/* UPDATE V10 - Hilangkan gradasi biru dan samarkan pinggir gambar */
.hero-slider{
    background:
        linear-gradient(90deg,#f5f8fc 0%, #eef5ff 52%, #f5f8fc 100%) !important;
    overflow:hidden;
}

.hero-slider:before,
.hero-slider:after{
    opacity:.08 !important;
    filter:blur(4px);
}

.hero-img{
    position:relative;
}

.hero-img img{
    width:100% !important;
    height:430px !important;
    object-fit:cover !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;

    /* pinggir gambar dibuat samar */
    mask-image:
        radial-gradient(circle at center,
        rgba(0,0,0,1) 55%,
        rgba(0,0,0,.88) 70%,
        rgba(0,0,0,.45) 84%,
        transparent 100%);
    -webkit-mask-image:
        radial-gradient(circle at center,
        rgba(0,0,0,1) 55%,
        rgba(0,0,0,.88) 70%,
        rgba(0,0,0,.45) 84%,
        transparent 100%);

    filter:
        saturate(1.03)
        contrast(1.02);
}

/* efek kabut lembut agar menyatu */
.hero-img:after{
    content:"";
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at center,
        transparent 45%,
        rgba(245,248,252,.18) 70%,
        rgba(245,248,252,.65) 100%);
    pointer-events:none;
}

.hero-text h1{
    background:linear-gradient(90deg,#153a78 0%, #1c54b9 55%, #2d7fff 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}


/* UPDATE V11 - Hero full design seperti contoh: gambar menyatu dengan background */
.hero-slider{
    min-height:650px !important;
    background:
        radial-gradient(circle at 72% 50%, rgba(220,236,255,.95) 0%, rgba(240,247,255,.85) 34%, transparent 58%),
        linear-gradient(90deg,#ffffff 0%, #f8fbff 42%, #edf6ff 100%) !important;
    overflow:hidden;
    position:relative;
}

.hero-slider:before{
    content:"";
    position:absolute;
    left:-160px;
    bottom:-220px;
    width:720px;
    height:420px;
    border-radius:50%;
    border:1px solid rgba(25,93,190,.08);
    box-shadow:
        0 0 0 34px rgba(25,93,190,.025),
        0 0 0 68px rgba(25,93,190,.02),
        0 0 0 102px rgba(25,93,190,.015);
    background:transparent !important;
    opacity:1 !important;
    transform:none !important;
}

.hero-slider:after{
    content:"";
    position:absolute;
    right:-80px;
    top:120px;
    width:55%;
    height:75%;
    background:
        radial-gradient(circle at 65% 35%, rgba(255,255,255,.40), transparent 24%),
        radial-gradient(circle at 50% 50%, rgba(210,232,255,.55), transparent 55%);
    filter:blur(10px);
    opacity:1 !important;
    border-radius:50%;
}

.slide{
    padding:95px 0 150px !important;
    position:relative;
    z-index:2;
}

.hero-flex{
    min-height:430px;
    gap:0;
    align-items:center;
}

.hero-text{
    width:46% !important;
    z-index:4;
    padding-left:10px;
}

.hero-text h1{
    font-size:50px !important;
    line-height:1.12 !important;
    letter-spacing:-1px;
    margin-bottom:26px !important;
    background:linear-gradient(90deg,#0b2b62 0%, #1857c9 52%, #2e8cff 100%) !important;
    -webkit-background-clip:text !important;
    -webkit-text-fill-color:transparent !important;
    background-clip:text !important;
    color:transparent !important;
}

.hero-text p{
    max-width:560px;
    font-size:18px !important;
    line-height:1.8 !important;
    color:#46556a !important;
    background:none !important;
    -webkit-text-fill-color:#46556a !important;
}

.hero-img{
    width:54% !important;
    height:470px;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:visible;
}

.hero-img:before{
    content:"";
    position:absolute;
    inset:-45px -20px -45px -140px;
    background:
        linear-gradient(90deg, #f8fbff 0%, rgba(248,251,255,.96) 8%, rgba(248,251,255,.78) 18%, transparent 38%),
        linear-gradient(0deg, #f8fbff 0%, rgba(248,251,255,.58) 10%, transparent 30%),
        linear-gradient(180deg, #f8fbff 0%, rgba(248,251,255,.38) 10%, transparent 30%),
        radial-gradient(circle at 55% 50%, transparent 42%, rgba(248,251,255,.72) 75%, #f8fbff 100%);
    z-index:3;
    pointer-events:none;
}

.hero-img:after{
    content:"";
    position:absolute;
    inset:-30px -30px -30px -150px;
    background:
        linear-gradient(90deg, #f8fbff 0%, rgba(248,251,255,.92) 11%, rgba(248,251,255,.55) 22%, transparent 42%),
        radial-gradient(circle at 52% 52%, transparent 43%, rgba(248,251,255,.40) 66%, rgba(248,251,255,.88) 100%);
    z-index:5;
    pointer-events:none;
}

.hero-img img{
    width:100% !important;
    height:470px !important;
    object-fit:cover !important;
    object-position:center center;
    border-radius:0 !important;
    box-shadow:none !important;
    background:transparent !important;
    position:relative;
    z-index:2;
    animation:none !important;
    filter:saturate(1.02) contrast(1.02);

    mask-image:
        linear-gradient(90deg, transparent 0%, rgba(0,0,0,.20) 11%, rgba(0,0,0,.70) 23%, rgba(0,0,0,1) 38%, rgba(0,0,0,1) 72%, rgba(0,0,0,.78) 86%, transparent 100%),
        linear-gradient(0deg, transparent 0%, rgba(0,0,0,.55) 10%, rgba(0,0,0,1) 24%, rgba(0,0,0,1) 78%, rgba(0,0,0,.55) 92%, transparent 100%);
    -webkit-mask-image:
        linear-gradient(90deg, transparent 0%, rgba(0,0,0,.20) 11%, rgba(0,0,0,.70) 23%, rgba(0,0,0,1) 38%, rgba(0,0,0,1) 72%, rgba(0,0,0,.78) 86%, transparent 100%),
        linear-gradient(0deg, transparent 0%, rgba(0,0,0,.55) 10%, rgba(0,0,0,1) 24%, rgba(0,0,0,1) 78%, rgba(0,0,0,.55) 92%, transparent 100%);
    mask-composite:intersect;
    -webkit-mask-composite:source-in;
}

.btn.dark{
    background:linear-gradient(135deg,#0b2b62,#1557bf) !important;
    color:#fff !important;
}

.btn.light{
    background:#fff !important;
    color:#0b2b62 !important;
    border:2px solid #1557bf !important;
}

.slide-btn{
    z-index:8;
    background:#fff !important;
    color:#0b2b62 !important;
    box-shadow:0 12px 30px rgba(15,40,80,.18) !important;
}

.statistik-ut{
    margin-top:-105px !important;
    border-radius:26px !important;
    box-shadow:0 24px 60px rgba(20,40,80,.16) !important;
}

/* Header dibuat lebih modern seperti contoh */
.navbar{
    padding:18px 0 !important;
    box-shadow:0 6px 20px rgba(0,0,0,.05) !important;
}
.menu a{
    font-size:15px !important;
}
.menu a:hover{
    color:#1557bf;
}

@media(max-width:900px){
    .hero-slider{min-height:auto !important}
    .slide{padding:50px 0 95px !important}
    .hero-flex{display:block;min-height:auto}
    .hero-text,.hero-img{width:100% !important}
    .hero-img{height:auto;margin-top:25px}
    .hero-img img{height:auto !important;max-height:380px}
    .hero-img:before,.hero-img:after{inset:-20px}
    .hero-text h1{font-size:36px !important}
}


/* UPDATE V12 - Hero final: teks di samping gambar, tidak menimpa, gambar menyatu */
.hero-slider{
    min-height:720px !important;
    background:
        radial-gradient(circle at 78% 45%, rgba(230,242,255,.95) 0%, rgba(245,250,255,.75) 42%, transparent 68%),
        linear-gradient(90deg,#ffffff 0%, #fbfdff 45%, #edf6ff 100%) !important;
    position:relative;
    overflow:hidden;
}

.hero-slider:before{
    content:"";
    position:absolute;
    left:-220px;
    bottom:-210px;
    width:760px;
    height:430px;
    border-radius:50%;
    border:1px solid rgba(22,93,198,.08);
    box-shadow:
        0 0 0 38px rgba(22,93,198,.025),
        0 0 0 76px rgba(22,93,198,.018),
        0 0 0 114px rgba(22,93,198,.012);
    background:transparent !important;
    opacity:1 !important;
}

.hero-slider:after{
    content:"";
    position:absolute;
    right:-120px;
    top:105px;
    width:62%;
    height:78%;
    background:
        radial-gradient(circle at 52% 45%, rgba(215,235,255,.50), transparent 62%),
        linear-gradient(135deg, transparent 0%, rgba(231,242,255,.55) 58%, rgba(203,226,252,.45) 100%);
    border-radius:45% 0 0 45%;
    filter:blur(8px);
    z-index:0;
}

.slide{
    padding:110px 0 170px !important;
    position:relative;
    z-index:2;
}

.hero-flex{
    display:grid !important;
    grid-template-columns:42% 58%;
    align-items:center;
    gap:0;
    min-height:500px;
}

.hero-text{
    width:100% !important;
    position:relative;
    z-index:6;
    padding-left:0;
    padding-right:25px;
}

.hero-text h1{
    font-size:50px !important;
    line-height:1.15 !important;
    letter-spacing:-1.1px;
    margin:0 0 25px !important;
    max-width:560px;
    background:none !important;
    -webkit-text-fill-color:initial !important;
    color:#08275d !important;
    font-weight:800;
}

.hero-text h1::first-line{
    color:#08275d !important;
}

.hero-text h1 span,
.hero-text h1 strong{
    color:#1262dd !important;
}

.hero-text p{
    max-width:550px;
    font-size:18px !important;
    line-height:1.75 !important;
    color:#44546a !important;
    background:none !important;
    -webkit-text-fill-color:#44546a !important;
    margin-bottom:30px !important;
}

.hero-img{
    width:100% !important;
    height:510px;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    overflow:visible;
    z-index:2;
}

.hero-img:before{
    content:"";
    position:absolute;
    inset:-60px -65px -75px -135px;
    background:
        linear-gradient(90deg,
            #ffffff 0%,
            rgba(255,255,255,.98) 7%,
            rgba(255,255,255,.72) 16%,
            rgba(255,255,255,.20) 31%,
            transparent 45%),
        linear-gradient(0deg,
            #ffffff 0%,
            rgba(255,255,255,.80) 8%,
            rgba(255,255,255,.25) 20%,
            transparent 35%),
        linear-gradient(180deg,
            #ffffff 0%,
            rgba(255,255,255,.50) 10%,
            transparent 30%),
        radial-gradient(circle at 60% 54%,
            transparent 48%,
            rgba(255,255,255,.45) 73%,
            rgba(255,255,255,.95) 100%);
    z-index:4;
    pointer-events:none;
}

.hero-img:after{
    content:"";
    position:absolute;
    inset:-40px -45px -50px -110px;
    background:
        radial-gradient(circle at 53% 54%,
            transparent 45%,
            rgba(255,255,255,.20) 64%,
            rgba(255,255,255,.85) 100%),
        linear-gradient(90deg,
            rgba(255,255,255,.96) 0%,
            rgba(255,255,255,.72) 14%,
            rgba(255,255,255,.25) 27%,
            transparent 43%);
    z-index:5;
    pointer-events:none;
}

.hero-img img{
    position:relative;
    z-index:3;
    width:100% !important;
    height:510px !important;
    object-fit:cover !important;
    object-position:center center;
    border-radius:0 !important;
    box-shadow:none !important;
    background:transparent !important;
    animation:none !important;
    filter:saturate(1.04) contrast(1.03);

    mask-image:
        linear-gradient(90deg,
            transparent 0%,
            rgba(0,0,0,.22) 8%,
            rgba(0,0,0,.70) 18%,
            rgba(0,0,0,1) 32%,
            rgba(0,0,0,1) 82%,
            rgba(0,0,0,.55) 94%,
            transparent 100%),
        linear-gradient(0deg,
            transparent 0%,
            rgba(0,0,0,.45) 8%,
            rgba(0,0,0,1) 22%,
            rgba(0,0,0,1) 82%,
            rgba(0,0,0,.45) 94%,
            transparent 100%);
    -webkit-mask-image:
        linear-gradient(90deg,
            transparent 0%,
            rgba(0,0,0,.22) 8%,
            rgba(0,0,0,.70) 18%,
            rgba(0,0,0,1) 32%,
            rgba(0,0,0,1) 82%,
            rgba(0,0,0,.55) 94%,
            transparent 100%),
        linear-gradient(0deg,
            transparent 0%,
            rgba(0,0,0,.45) 8%,
            rgba(0,0,0,1) 22%,
            rgba(0,0,0,1) 82%,
            rgba(0,0,0,.45) 94%,
            transparent 100%);
    -webkit-mask-composite:source-in;
    mask-composite:intersect;
}

.btn.dark{
    background:linear-gradient(135deg,#0c55d9,#0742a6) !important;
    color:#fff !important;
    border:0 !important;
    box-shadow:0 12px 28px rgba(13,83,210,.22);
}

.btn.light{
    background:#fff !important;
    color:#0c55d9 !important;
    border:2px solid #0c55d9 !important;
}

.statistik-ut{
    margin-top:-125px !important;
    position:relative;
    z-index:7;
}

/* supaya judul yang disimpan dari admin otomatis memberi warna pada kata ekonomi/bisnis */
.hero-text h1{
    text-wrap:balance;
}

@media(max-width:900px){
    .hero-slider{min-height:auto !important}
    .slide{padding:55px 0 100px !important}
    .hero-flex{display:block !important;min-height:auto}
    .hero-text{padding-right:0}
    .hero-text h1{font-size:36px !important}
    .hero-img{height:auto;margin-top:30px}
    .hero-img img{height:auto !important;max-height:390px}
    .hero-img:before,.hero-img:after{inset:-25px}
}


/* UPDATE V13 - Hero identik dengan referensi: clean white-blue, text left, image right, feature cards */
.topbar-modern{
    background:#fbfdff !important;
    border-bottom:1px solid #e8eef7;
    padding:17px 0 !important;
}
.top-modern-flex{
    grid-template-columns:1fr 360px 1fr !important;
}
.pmb-link{
    color:#071f4d !important;
    font-size:16px !important;
}
.top-search input{
    border:1px solid #e0e8f3 !important;
    box-shadow:0 8px 22px rgba(20,52,96,.04);
}
.top-social a{
    color:#071f4d !important;
    border:1px solid #e4ebf5;
    box-shadow:0 8px 18px rgba(20,52,96,.05);
}
.navbar{
    background:#fff !important;
    padding:26px 0 !important;
    box-shadow:0 8px 28px rgba(20,52,96,.04) !important;
}
.brand img{
    width:78px !important;
    height:58px !important;
    border-radius:8px;
}
.brand span{
    font-size:18px;
    line-height:1.25;
    color:#061a3a;
}
.nav-flex{
    align-items:center !important;
}
.menu{
    gap:34px !important;
}
.menu a{
    color:#061a3a !important;
    font-size:16px !important;
    font-weight:800 !important;
}
.menu a:after{
    height:3px !important;
    background:#1262dd !important;
    bottom:-8px !important;
}

.hero-slider{
    min-height:760px !important;
    background:
        radial-gradient(circle at 76% 44%, rgba(235,246,255,.94) 0%, rgba(247,251,255,.80) 45%, transparent 70%),
        linear-gradient(90deg,#ffffff 0%, #ffffff 43%, #eef7ff 100%) !important;
    overflow:hidden;
}
.hero-slider:before{
    content:"";
    position:absolute;
    left:-250px;
    bottom:-245px;
    width:830px;
    height:480px;
    border-radius:50%;
    border:1px solid rgba(16,91,210,.07);
    box-shadow:
        0 0 0 42px rgba(16,91,210,.022),
        0 0 0 84px rgba(16,91,210,.017),
        0 0 0 126px rgba(16,91,210,.012),
        0 0 0 168px rgba(16,91,210,.009);
    background:transparent !important;
    opacity:1 !important;
    z-index:1;
}
.hero-slider:after{
    content:"";
    position:absolute;
    right:-160px;
    top:135px;
    width:68%;
    height:78%;
    background:
        radial-gradient(circle at 54% 54%, rgba(225,240,255,.62), transparent 61%),
        linear-gradient(135deg, transparent 0%, rgba(232,244,255,.58) 55%, rgba(212,232,254,.48) 100%);
    filter:blur(5px);
    z-index:0;
}
.slide{
    padding:118px 0 168px !important;
}
.hero-flex{
    display:grid !important;
    grid-template-columns:42% 58% !important;
    min-height:510px !important;
    align-items:center !important;
}
.hero-text{
    width:100% !important;
    padding:0 20px 0 0 !important;
    z-index:9 !important;
}
.hero-text h1{
    font-size:55px !important;
    line-height:1.14 !important;
    letter-spacing:-1.5px;
    max-width:650px;
    font-weight:900 !important;
    color:#09285d !important;
    background:none !important;
    -webkit-text-fill-color:#09285d !important;
    margin-bottom:30px !important;
}
.hero-text h1 span{
    color:#1262dd !important;
    -webkit-text-fill-color:#1262dd !important;
}
.hero-text p{
    max-width:610px;
    font-size:19px !important;
    line-height:1.75 !important;
    color:#41506a !important;
    -webkit-text-fill-color:#41506a !important;
    margin-bottom:34px !important;
}
.btn{
    padding:16px 28px !important;
    border-radius:32px !important;
    font-size:15px !important;
    margin-right:16px !important;
}
.btn.dark{
    background:#0d5ce4 !important;
    box-shadow:0 14px 30px rgba(13,92,228,.24) !important;
}
.btn.dark:after{
    content:" →";
    margin-left:10px;
}
.btn.light{
    border:2px solid #1262dd !important;
    color:#0d5ce4 !important;
}
.btn.light:after{
    content:" →";
    margin-left:10px;
}
.hero-img{
    width:100% !important;
    height:540px !important;
    justify-content:flex-end !important;
    overflow:visible !important;
}
.hero-img img{
    height:540px !important;
    width:110% !important;
    max-width:none !important;
    object-fit:cover !important;
    object-position:center center !important;
    border-radius:0 !important;
    box-shadow:none !important;
    animation:none !important;
    filter:saturate(1.05) contrast(1.03) brightness(1.02) !important;
    position:relative;
    z-index:3;

    mask-image:
        linear-gradient(90deg,
            transparent 0%,
            rgba(0,0,0,.10) 6%,
            rgba(0,0,0,.55) 15%,
            rgba(0,0,0,1) 30%,
            rgba(0,0,0,1) 84%,
            rgba(0,0,0,.78) 94%,
            transparent 100%),
        linear-gradient(0deg,
            transparent 0%,
            rgba(0,0,0,.40) 7%,
            rgba(0,0,0,1) 18%,
            rgba(0,0,0,1) 86%,
            rgba(0,0,0,.50) 96%,
            transparent 100%) !important;
    -webkit-mask-image:
        linear-gradient(90deg,
            transparent 0%,
            rgba(0,0,0,.10) 6%,
            rgba(0,0,0,.55) 15%,
            rgba(0,0,0,1) 30%,
            rgba(0,0,0,1) 84%,
            rgba(0,0,0,.78) 94%,
            transparent 100%),
        linear-gradient(0deg,
            transparent 0%,
            rgba(0,0,0,.40) 7%,
            rgba(0,0,0,1) 18%,
            rgba(0,0,0,1) 86%,
            rgba(0,0,0,.50) 96%,
            transparent 100%) !important;
    -webkit-mask-composite:source-in;
    mask-composite:intersect;
}
.hero-img:before{
    content:"";
    position:absolute;
    inset:-75px -80px -80px -170px;
    background:
        linear-gradient(90deg,#fff 0%, rgba(255,255,255,.98) 8%, rgba(255,255,255,.70) 17%, rgba(255,255,255,.20) 31%, transparent 47%),
        linear-gradient(0deg,#fff 0%, rgba(255,255,255,.78) 8%, rgba(255,255,255,.25) 18%, transparent 34%),
        linear-gradient(180deg,#fff 0%, rgba(255,255,255,.50) 9%, transparent 26%),
        radial-gradient(circle at 56% 55%, transparent 45%, rgba(255,255,255,.38) 72%, #fff 100%);
    z-index:4;
}
.hero-img:after{
    content:"";
    position:absolute;
    inset:-55px -65px -60px -145px;
    background:
        radial-gradient(circle at 52% 55%, transparent 44%, rgba(255,255,255,.15) 62%, rgba(255,255,255,.82) 100%),
        linear-gradient(90deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.66) 13%, rgba(255,255,255,.18) 25%, transparent 44%);
    z-index:5;
}
.slide-btn{
    width:52px !important;
    height:52px !important;
    font-size:38px !important;
    border-radius:50% !important;
    color:#0d5ce4 !important;
    box-shadow:0 14px 35px rgba(20,52,96,.14) !important;
}
.prev{left:36px !important}
.next{right:36px !important}

/* Feature card seperti referensi, menggantikan statistik utama */
.statistik-ut{
    margin-top:-105px !important;
    background:#fff !important;
    color:#061a3a !important;
    min-height:150px !important;
    border-radius:28px !important;
    padding:36px 58px !important;
    display:grid !important;
    grid-template-columns:repeat(4,1fr) !important;
    gap:28px !important;
    box-shadow:0 24px 55px rgba(20,52,96,.10) !important;
}
.statistik-ut:before{display:none !important}
.statistik-ut .stat-ut-col,
.statistik-ut .prestasi-ut{
    text-align:left !important;
}
.statistik-ut .stat-number,
.statistik-ut .stat-number.yellow{
    color:#0d5ce4 !important;
    font-size:0 !important;
}
.statistik-ut .stat-number:before{
    content:"🏅";
    width:72px;
    height:72px;
    border-radius:50%;
    background:#eef5ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
    margin-right:18px;
    float:left;
}
.statistik-ut .stat-ut-col:nth-child(3) .stat-number:before{
    content:"🎓";
}
.statistik-ut .stat-ut-col h3,
.statistik-ut .prestasi-ut h3{
    color:#08285d !important;
    font-size:24px !important;
    margin:5px 0 4px !important;
}
.statistik-ut .stat-ut-col p,
.statistik-ut .prestasi-ut p{
    color:#41506a !important;
    font-size:16px !important;
    margin:2px 0 !important;
}
.prestasi-ut h3 span{display:none}
.prestasi-item{display:none}
.prestasi-ut:before{
    content:"👥";
    width:72px;
    height:72px;
    border-radius:50%;
    background:#eef5ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
    float:left;
    margin-right:18px;
}
.prestasi-ut:after{
    content:"Terakreditasi";
    color:#41506a;
    font-size:16px;
}
.statistik-ut .achievement-extra{
    display:block;
}

/* Tambah kartu ke-4 secara visual lewat after container */
.statistik-ut{
    position:relative;
}
.statistik-ut .stat-ut-col:last-child:after{
    content:"";
}

@media(min-width:901px){
    .statistik-ut:after{
        content:"🎓  Lulusan  Siap Kerja  & Berdaya Saing";
        white-space:pre;
        display:flex;
        align-items:center;
        color:#08285d;
        font-weight:800;
        font-size:23px;
        line-height:1.25;
    }
}
@media(max-width:900px){
    .top-modern-flex{grid-template-columns:1fr !important}
    .hero-slider{min-height:auto !important}
    .slide{padding:60px 0 110px !important}
    .hero-flex{display:block !important}
    .hero-text h1{font-size:38px !important}
    .hero-img{height:auto !important}
    .hero-img img{height:auto !important;width:100% !important}
    .statistik-ut{grid-template-columns:1fr !important;padding:28px !important}
    .statistik-ut:after{content:"🎓 Lulusan Siap Kerja";font-weight:bold}
}

.statistik-ut .feature-item{
    display:flex;
    align-items:center;
    gap:18px;
}
.statistik-ut .feature-icon{
    width:72px;
    height:72px;
    border-radius:50%;
    background:#eef5ff;
    color:#0d5ce4;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
    flex:none;
}
.statistik-ut .feature-item span{
    color:#41506a;
    font-size:16px;
}
.statistik-ut .feature-item h3{
    color:#08285d !important;
    font-size:25px !important;
    margin:5px 0 4px !important;
}
.statistik-ut .feature-item p{
    color:#41506a !important;
    font-size:16px !important;
    margin:0 !important;
}
.statistik-ut:after{display:none !important}


/* UPDATE V14 - Perbaikan final hero agar sesuai referensi */
.container{
    max-width:1280px;
    width:90%;
}

.topbar-modern{
    background:#fbfdff !important;
    border-bottom:1px solid #e8eef7 !important;
    padding:14px 0 !important;
}

.top-modern-flex{
    display:grid !important;
    grid-template-columns:1fr 360px 1fr !important;
    align-items:center !important;
    gap:22px !important;
}

.navbar{
    background:#fff !important;
    padding:22px 0 !important;
    box-shadow:0 8px 28px rgba(20,52,96,.045) !important;
}

.nav-flex{
    display:grid !important;
    grid-template-columns:minmax(390px, 1fr) auto !important;
    align-items:center !important;
    gap:35px !important;
}

.brand{
    min-width:0 !important;
}

.brand img{
    width:74px !important;
    height:54px !important;
    object-fit:contain !important;
}

.brand span{
    font-size:17px !important;
    line-height:1.18 !important;
    max-width:420px !important;
    color:#061a3a !important;
}

.menu{
    display:flex !important;
    align-items:center !important;
    gap:28px !important;
    white-space:nowrap !important;
}

.menu a{
    font-size:15px !important;
    font-weight:800 !important;
    color:#061a3a !important;
}

/* Hero layout */
.hero-slider{
    min-height:700px !important;
    background:
        radial-gradient(circle at 76% 48%, rgba(235,246,255,.96) 0%, rgba(248,252,255,.82) 42%, transparent 70%),
        linear-gradient(90deg,#ffffff 0%, #ffffff 41%, #edf7ff 100%) !important;
    overflow:hidden !important;
    position:relative !important;
}

.hero-slider:before{
    content:"" !important;
    position:absolute !important;
    left:-245px !important;
    bottom:-250px !important;
    width:840px !important;
    height:490px !important;
    border-radius:50% !important;
    border:1px solid rgba(18,98,221,.06) !important;
    box-shadow:
        0 0 0 42px rgba(18,98,221,.020),
        0 0 0 84px rgba(18,98,221,.015),
        0 0 0 126px rgba(18,98,221,.010) !important;
    background:transparent !important;
    opacity:1 !important;
    z-index:0 !important;
}

.hero-slider:after{
    content:"" !important;
    position:absolute !important;
    right:-180px !important;
    top:120px !important;
    width:70% !important;
    height:78% !important;
    background:
        radial-gradient(circle at 56% 54%, rgba(225,240,255,.62), transparent 62%),
        linear-gradient(135deg, transparent 0%, rgba(232,244,255,.56) 56%, rgba(215,235,255,.45) 100%) !important;
    filter:blur(5px) !important;
    z-index:0 !important;
}

.hero-slider .slide{
    padding:92px 0 150px !important;
    position:relative !important;
    z-index:2 !important;
}

.hero-slider .hero-flex{
    display:grid !important;
    grid-template-columns:minmax(470px, 44%) minmax(0, 56%) !important;
    align-items:center !important;
    gap:10px !important;
    min-height:520px !important;
}

.hero-slider .hero-text{
    width:100% !important;
    max-width:610px !important;
    padding:0 22px 0 0 !important;
    position:relative !important;
    z-index:10 !important;
}

.hero-slider .hero-text h1{
    font-size:52px !important;
    line-height:1.14 !important;
    letter-spacing:-1.1px !important;
    font-weight:900 !important;
    margin:0 0 26px !important;
    max-width:610px !important;
    color:#08285d !important;
    background:none !important;
    -webkit-text-fill-color:#08285d !important;
    text-wrap:normal !important;
    overflow:visible !important;
}

.hero-slider .hero-text h1 span{
    color:#1262dd !important;
    -webkit-text-fill-color:#1262dd !important;
}

.hero-slider .hero-text p{
    max-width:580px !important;
    font-size:18px !important;
    line-height:1.75 !important;
    margin:0 0 32px !important;
    color:#41506a !important;
    background:none !important;
    -webkit-text-fill-color:#41506a !important;
}

.hero-slider .btn{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:15px 26px !important;
    border-radius:32px !important;
    font-size:15px !important;
    font-weight:800 !important;
    margin:0 14px 10px 0 !important;
}

.hero-slider .btn.dark{
    background:#0d5ce4 !important;
    color:#fff !important;
    border:2px solid #0d5ce4 !important;
    box-shadow:0 14px 30px rgba(13,92,228,.24) !important;
}

.hero-slider .btn.light{
    background:#fff !important;
    color:#0d5ce4 !important;
    border:2px solid #0d5ce4 !important;
}

.hero-slider .hero-img{
    width:100% !important;
    height:520px !important;
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    overflow:visible !important;
    z-index:3 !important;
}

.hero-slider .hero-img img{
    width:112% !important;
    max-width:none !important;
    height:520px !important;
    object-fit:cover !important;
    object-position:center center !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:transparent !important;
    animation:none !important;
    filter:saturate(1.04) contrast(1.03) brightness(1.02) !important;
    position:relative !important;
    z-index:3 !important;
    mask-image:
        linear-gradient(90deg,
            transparent 0%,
            rgba(0,0,0,.12) 6%,
            rgba(0,0,0,.58) 15%,
            rgba(0,0,0,1) 29%,
            rgba(0,0,0,1) 84%,
            rgba(0,0,0,.72) 94%,
            transparent 100%),
        linear-gradient(0deg,
            transparent 0%,
            rgba(0,0,0,.40) 7%,
            rgba(0,0,0,1) 18%,
            rgba(0,0,0,1) 86%,
            rgba(0,0,0,.45) 96%,
            transparent 100%) !important;
    -webkit-mask-image:
        linear-gradient(90deg,
            transparent 0%,
            rgba(0,0,0,.12) 6%,
            rgba(0,0,0,.58) 15%,
            rgba(0,0,0,1) 29%,
            rgba(0,0,0,1) 84%,
            rgba(0,0,0,.72) 94%,
            transparent 100%),
        linear-gradient(0deg,
            transparent 0%,
            rgba(0,0,0,.40) 7%,
            rgba(0,0,0,1) 18%,
            rgba(0,0,0,1) 86%,
            rgba(0,0,0,.45) 96%,
            transparent 100%) !important;
    -webkit-mask-composite:source-in !important;
    mask-composite:intersect !important;
}

.hero-slider .hero-img:before{
    content:"" !important;
    position:absolute !important;
    inset:-62px -70px -76px -150px !important;
    background:
        linear-gradient(90deg,#fff 0%, rgba(255,255,255,.98) 7%, rgba(255,255,255,.68) 17%, rgba(255,255,255,.20) 30%, transparent 45%),
        linear-gradient(0deg,#fff 0%, rgba(255,255,255,.76) 8%, rgba(255,255,255,.23) 18%, transparent 33%),
        linear-gradient(180deg,#fff 0%, rgba(255,255,255,.45) 9%, transparent 25%),
        radial-gradient(circle at 56% 55%, transparent 45%, rgba(255,255,255,.36) 72%, #fff 100%) !important;
    z-index:4 !important;
    pointer-events:none !important;
}

.hero-slider .hero-img:after{
    content:"" !important;
    position:absolute !important;
    inset:-44px -56px -58px -128px !important;
    background:
        radial-gradient(circle at 52% 55%, transparent 45%, rgba(255,255,255,.15) 63%, rgba(255,255,255,.82) 100%),
        linear-gradient(90deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.64) 13%, rgba(255,255,255,.18) 25%, transparent 43%) !important;
    z-index:5 !important;
    pointer-events:none !important;
}

.slide-btn{
    width:52px !important;
    height:52px !important;
    z-index:20 !important;
}

/* Feature card bawah hero */
.hero-feature-card{
    position:relative !important;
    z-index:30 !important;
    margin-top:-105px !important;
    background:#fff !important;
    min-height:150px !important;
    border-radius:28px !important;
    padding:36px 58px !important;
    display:grid !important;
    grid-template-columns:repeat(4,1fr) !important;
    gap:28px !important;
    box-shadow:0 24px 55px rgba(20,52,96,.11) !important;
}

.hero-feature-card .feature-item{
    display:flex !important;
    align-items:center !important;
    gap:18px !important;
}

.hero-feature-card .feature-icon{
    width:72px !important;
    height:72px !important;
    border-radius:50% !important;
    background:#eef5ff !important;
    color:#0d5ce4 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:34px !important;
    flex:none !important;
}

.hero-feature-card span{
    display:block !important;
    color:#41506a !important;
    font-size:16px !important;
    line-height:1.2 !important;
}

.hero-feature-card h3{
    color:#08285d !important;
    font-size:24px !important;
    margin:5px 0 4px !important;
    line-height:1.12 !important;
}

.hero-feature-card p{
    color:#41506a !important;
    font-size:16px !important;
    margin:0 !important;
}

/* Sembunyikan versi statistik lama kalau masih tersisa */
.statistik-ut:not(.hero-feature-card){
    display:none !important;
}

@media(max-width:1100px){
    .hero-slider .hero-flex{
        grid-template-columns:minmax(390px, 45%) minmax(0, 55%) !important;
    }
    .hero-slider .hero-text h1{
        font-size:44px !important;
    }
    .menu{
        gap:18px !important;
    }
}

@media(max-width:900px){
    .top-modern-flex{
        grid-template-columns:1fr !important;
        text-align:center !important;
    }
    .nav-flex{
        display:block !important;
    }
    .mobile-btn{
        display:block !important;
        float:right !important;
        margin-top:-48px !important;
    }
    .menu{
        display:none !important;
        white-space:normal !important;
    }
    .menu.show{
        display:block !important;
    }
    .hero-slider{
        min-height:auto !important;
    }
    .hero-slider .slide{
        padding:60px 0 115px !important;
    }
    .hero-slider .hero-flex{
        display:block !important;
        min-height:auto !important;
    }
    .hero-slider .hero-text{
        max-width:100% !important;
        padding:0 !important;
    }
    .hero-slider .hero-text h1{
        font-size:38px !important;
    }
    .hero-slider .hero-img{
        height:auto !important;
        margin-top:24px !important;
    }
    .hero-slider .hero-img img{
        width:100% !important;
        height:auto !important;
        max-height:390px !important;
    }
    .hero-feature-card{
        grid-template-columns:1fr !important;
        margin-top:-70px !important;
        padding:28px !important;
    }
}


/* UPDATE V15 - Final hero: foto terang, tidak ada garis, pinggir hanya fade, sesuai referensi */
:root{
    --blue-main:#0d5ce4;
    --blue-dark:#08285d;
    --blue-text:#071f4d;
}

.container{
    max-width:1320px;
    width:92%;
}

/* top header */
.topbar-modern{
    background:#fbfdff !important;
    border-bottom:1px solid #e7eef8 !important;
    padding:14px 0 !important;
}
.top-modern-flex{
    display:grid !important;
    grid-template-columns:1fr 370px 1fr !important;
    align-items:center !important;
    gap:24px !important;
}
.pmb-link{
    color:#071f4d !important;
    font-size:16px !important;
    font-weight:800 !important;
}
.top-search input{
    height:44px !important;
    border:1px solid #dde7f4 !important;
    border-radius:16px !important;
    box-shadow:0 8px 22px rgba(20,52,96,.045) !important;
    color:#071f4d !important;
}
.top-social a{
    width:34px !important;
    height:34px !important;
    border-radius:50% !important;
    background:#fff !important;
    border:1px solid #e3ebf6 !important;
    color:#071f4d !important;
    box-shadow:0 8px 18px rgba(20,52,96,.05) !important;
}

/* main navbar */
.navbar{
    background:#fff !important;
    padding:24px 0 !important;
    box-shadow:0 8px 28px rgba(20,52,96,.045) !important;
}
.nav-flex{
    display:grid !important;
    grid-template-columns:minmax(470px,1fr) auto !important;
    align-items:center !important;
    gap:45px !important;
}
.brand img{
    width:78px !important;
    height:58px !important;
    object-fit:contain !important;
    border-radius:8px !important;
}
.brand span{
    font-size:18px !important;
    line-height:1.2 !important;
    max-width:460px !important;
    color:#061a3a !important;
}
.menu{
    display:flex !important;
    align-items:center !important;
    gap:34px !important;
    white-space:nowrap !important;
}
.menu a{
    font-size:16px !important;
    font-weight:800 !important;
    color:#061a3a !important;
    position:relative;
}
.menu a:after{
    background:var(--blue-main) !important;
    height:3px !important;
    bottom:-9px !important;
}

/* hero */
.hero-slider{
    min-height:760px !important;
    background:
        radial-gradient(circle at 80% 48%, rgba(236,247,255,.96) 0%, rgba(248,252,255,.86) 43%, transparent 70%),
        linear-gradient(90deg,#ffffff 0%, #ffffff 43%, #eef7ff 100%) !important;
    overflow:hidden !important;
    position:relative !important;
}
.hero-slider:before{
    content:"" !important;
    position:absolute !important;
    left:-270px !important;
    bottom:-260px !important;
    width:900px !important;
    height:520px !important;
    border-radius:50% !important;
    border:1px solid rgba(18,98,221,.055) !important;
    box-shadow:
        0 0 0 44px rgba(18,98,221,.020),
        0 0 0 88px rgba(18,98,221,.015),
        0 0 0 132px rgba(18,98,221,.010),
        0 0 0 176px rgba(18,98,221,.007) !important;
    background:transparent !important;
    opacity:1 !important;
    z-index:0 !important;
}
.hero-slider:after{
    content:"" !important;
    position:absolute !important;
    right:-200px !important;
    top:135px !important;
    width:72% !important;
    height:80% !important;
    background:
        radial-gradient(circle at 58% 55%, rgba(226,241,255,.58), transparent 64%),
        linear-gradient(135deg, transparent 0%, rgba(235,246,255,.56) 58%, rgba(215,235,255,.42) 100%) !important;
    filter:blur(4px) !important;
    z-index:0 !important;
}
.hero-slider .slide{
    padding:98px 0 175px !important;
    position:relative !important;
    z-index:2 !important;
}
.hero-slider .hero-flex{
    display:grid !important;
    grid-template-columns:minmax(500px, 43%) minmax(0, 57%) !important;
    align-items:center !important;
    gap:4px !important;
    min-height:560px !important;
}
.hero-slider .hero-text{
    width:100% !important;
    max-width:660px !important;
    padding:0 16px 0 0 !important;
    position:relative !important;
    z-index:12 !important;
}
.hero-slider .hero-text h1{
    font-size:55px !important;
    line-height:1.14 !important;
    letter-spacing:-1.25px !important;
    font-weight:900 !important;
    margin:0 0 27px !important;
    max-width:660px !important;
    color:var(--blue-dark) !important;
    background:none !important;
    -webkit-text-fill-color:var(--blue-dark) !important;
    text-wrap:normal !important;
}
.hero-slider .hero-text h1 span{
    color:var(--blue-main) !important;
    -webkit-text-fill-color:var(--blue-main) !important;
}
.hero-slider .hero-text p{
    max-width:620px !important;
    font-size:18px !important;
    line-height:1.75 !important;
    margin:0 0 34px !important;
    color:#41506a !important;
    background:none !important;
    -webkit-text-fill-color:#41506a !important;
}
.hero-slider .btn{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:16px 27px !important;
    border-radius:33px !important;
    font-size:15px !important;
    font-weight:800 !important;
    margin:0 15px 10px 0 !important;
}
.hero-slider .btn.dark{
    background:var(--blue-main) !important;
    color:#fff !important;
    border:2px solid var(--blue-main) !important;
    box-shadow:0 15px 32px rgba(13,92,228,.25) !important;
}
.hero-slider .btn.light{
    background:#fff !important;
    color:var(--blue-main) !important;
    border:2px solid var(--blue-main) !important;
}

/* hero image: no vertical line, bright center, fade only around edges */
.hero-slider .hero-img{
    width:100% !important;
    height:560px !important;
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    overflow:visible !important;
    z-index:3 !important;
}
.hero-slider .hero-img img{
    width:116% !important;
    max-width:none !important;
    height:560px !important;
    object-fit:cover !important;
    object-position:center center !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:transparent !important;
    animation:none !important;
    filter:saturate(1.10) contrast(1.06) brightness(1.07) !important;
    position:relative !important;
    z-index:3 !important;
    opacity:1 !important;

    mask-image:radial-gradient(ellipse at 59% 54%,
        rgba(0,0,0,1) 0%,
        rgba(0,0,0,1) 63%,
        rgba(0,0,0,.72) 78%,
        rgba(0,0,0,.25) 91%,
        transparent 100%) !important;
    -webkit-mask-image:radial-gradient(ellipse at 59% 54%,
        rgba(0,0,0,1) 0%,
        rgba(0,0,0,1) 63%,
        rgba(0,0,0,.72) 78%,
        rgba(0,0,0,.25) 91%,
        transparent 100%) !important;
    -webkit-mask-composite:initial !important;
    mask-composite:initial !important;
}

/* single smooth edge overlay, no rectangular/vertical artifacts */
.hero-slider .hero-img:before{
    content:"" !important;
    position:absolute !important;
    inset:-55px -70px -75px -135px !important;
    background:
        radial-gradient(ellipse at 58% 55%,
            transparent 0%,
            transparent 55%,
            rgba(255,255,255,.20) 72%,
            rgba(255,255,255,.88) 100%),
        linear-gradient(90deg,
            #fff 0%,
            rgba(255,255,255,.92) 8%,
            rgba(255,255,255,.45) 19%,
            transparent 34%) !important;
    z-index:4 !important;
    pointer-events:none !important;
}
.hero-slider .hero-img:after{
    content:"" !important;
    position:absolute !important;
    inset:auto -60px -80px -120px !important;
    height:170px !important;
    background:linear-gradient(0deg,#fff 0%, rgba(255,255,255,.78) 35%, transparent 100%) !important;
    z-index:5 !important;
    pointer-events:none !important;
}

.slide-btn{
    width:52px !important;
    height:52px !important;
    z-index:30 !important;
    background:#fff !important;
    color:var(--blue-main) !important;
    box-shadow:0 14px 35px rgba(20,52,96,.14) !important;
}
.prev{left:36px !important}
.next{right:36px !important}

/* card benefit */
.hero-feature-card{
    position:relative !important;
    z-index:40 !important;
    margin-top:-118px !important;
    background:#fff !important;
    min-height:158px !important;
    border-radius:28px !important;
    padding:38px 58px !important;
    display:grid !important;
    grid-template-columns:repeat(4,1fr) !important;
    gap:28px !important;
    box-shadow:0 24px 55px rgba(20,52,96,.11) !important;
}
.hero-feature-card .feature-item{
    display:flex !important;
    align-items:center !important;
    gap:18px !important;
}
.hero-feature-card .feature-icon{
    width:74px !important;
    height:74px !important;
    border-radius:50% !important;
    background:#eef5ff !important;
    color:var(--blue-main) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:34px !important;
    flex:none !important;
}
.hero-feature-card span{
    display:block !important;
    color:#41506a !important;
    font-size:16px !important;
    line-height:1.2 !important;
}
.hero-feature-card h3{
    color:var(--blue-dark) !important;
    font-size:25px !important;
    margin:5px 0 4px !important;
    line-height:1.12 !important;
}
.hero-feature-card p{
    color:#41506a !important;
    font-size:16px !important;
    margin:0 !important;
}

/* hide old statistic if still rendered */
.statistik-ut:not(.hero-feature-card){
    display:none !important;
}

@media(max-width:1160px){
    .hero-slider .hero-flex{
        grid-template-columns:minmax(430px, 44%) minmax(0, 56%) !important;
    }
    .hero-slider .hero-text h1{
        font-size:46px !important;
    }
    .menu{gap:20px !important;}
}
@media(max-width:900px){
    .container{width:92% !important}
    .top-modern-flex{grid-template-columns:1fr !important;text-align:center !important}
    .nav-flex{display:block !important}
    .mobile-btn{display:block !important;float:right !important;margin-top:-48px !important}
    .menu{display:none !important;white-space:normal !important}
    .menu.show{display:block !important}
    .hero-slider{min-height:auto !important}
    .hero-slider .slide{padding:58px 0 120px !important}
    .hero-slider .hero-flex{display:block !important;min-height:auto !important}
    .hero-slider .hero-text{max-width:100% !important;padding:0 !important}
    .hero-slider .hero-text h1{font-size:38px !important}
    .hero-slider .hero-img{height:auto !important;margin-top:24px !important}
    .hero-slider .hero-img img{width:100% !important;height:auto !important;max-height:390px !important}
    .hero-feature-card{grid-template-columns:1fr !important;margin-top:-76px !important;padding:28px !important}
}


/* UPDATE V18 - Slider Promosi di antara Program Studi dan Berita */
.promo-slider-wrap{
    margin-top:34px;
    margin-bottom:28px;
    position:relative;
}
.promo-slider{
    width:100%;
    height:275px;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 16px 38px rgba(20,52,96,.13);
    background:#fff;
}
.promo-slide{
    display:none;
    width:100%;
    height:100%;
    animation:fadeSlide .55s ease;
}
.promo-slide.active{
    display:block;
}
.promo-slide img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.promo-nav{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:5;
    width:36px;
    height:36px;
    border:0;
    border-radius:50%;
    background:#fff;
    color:#0d5ce4;
    font-size:28px;
    line-height:1;
    box-shadow:0 8px 22px rgba(0,0,0,.14);
    cursor:pointer;
}
.promo-prev{left:22px}
.promo-next{right:22px}
@media(max-width:900px){
    .promo-slider{height:185px}
}


/* UPDATE V19 - Section akreditasi prodi dan universitas */
.akreditasi-section{
    background:#fff;
    padding:55px 0 52px;
    margin-top:32px;
    text-align:center;
}
.akreditasi-section h2{
    margin:0 0 18px;
    color:#0d469f;
    font-size:28px;
    font-weight:900;
    letter-spacing:.3px;
}
.akreditasi-section p{
    margin:0 0 35px;
    color:#7a8290;
    font-size:17px;
}
.akreditasi-row{
    display:flex;
    align-items:stretch;
    justify-content:center;
    gap:22px;
    flex-wrap:wrap;
}
.akreditasi-item{
    width:210px;
    min-height:145px;
    border-radius:18px;
    background:#fff;
    border:1px solid #edf1f6;
    box-shadow:0 12px 28px rgba(20,52,96,.06);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:16px;
    transition:.25s;
}
.akreditasi-item:hover{
    transform:translateY(-6px);
    box-shadow:0 18px 38px rgba(20,52,96,.11);
}
.akreditasi-item img{
    max-width:170px;
    max-height:76px;
    object-fit:contain;
    margin-bottom:10px;
}
.akreditasi-item span{
    color:#08285d;
    font-weight:800;
    font-size:14px;
    line-height:1.25;
}
.akreditasi-item small{
    color:#0d5ce4;
    font-weight:700;
    margin-top:5px;
}
@media(max-width:900px){
    .akreditasi-item{width:46%}
}
@media(max-width:520px){
    .akreditasi-item{width:100%}
}


/* UPDATE V20 - Apa Kata Mereka carousel animasi + foto tampil utuh */
.testimoni-modern{
    padding:78px 0 48px;
    background:
        radial-gradient(circle at 10% 30%, rgba(255,210,210,.16), transparent 30%),
        linear-gradient(90deg,#ffffff 0%,#ffffff 35%,#f8fbff 100%);
    position:relative;
    overflow:hidden;
}
.testimoni-modern:before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:40%;
    height:100%;
    background-image:radial-gradient(rgba(255,130,130,.18) 5px, transparent 6px);
    background-size:46px 46px;
    opacity:.7;
}
.testimoni-layout{
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    gap:34px;
    align-items:center;
    position:relative;
    z-index:1;
}
.testimoni-title h2{
    margin:0 0 18px;
    color:#0d469f;
    font-size:30px;
    font-weight:900;
    line-height:1.12;
    text-transform:capitalize;
}
.testimoni-title p{
    margin:0;
    color:#6f7788;
    font-size:17px;
    line-height:1.6;
}
.testimoni-slider-wrap{
    position:relative;
    min-width:0;
    padding:0 46px 34px;
}
.testimoni-viewport{
    overflow:hidden;
    min-width:0;
}
.testimoni-cards{
    display:flex;
    gap:18px;
    transition:transform .65s cubic-bezier(.22,.72,.16,1);
    will-change:transform;
}
.testimoni-card{
    flex:0 0 calc((100% - 36px)/3);
    background:#fff;
    border:1px solid #edf1f6;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 14px 34px rgba(20,52,96,.08);
    transition:transform .25s, box-shadow .25s;
}
.testimoni-card:hover{
    transform:translateY(-6px);
    box-shadow:0 20px 44px rgba(20,52,96,.12);
}
.testimoni-photo{
    height:230px;
    background:#f6f8fc;
    display:flex;
    align-items:center;
    justify-content:center;
    border-bottom:1px solid #eef2f7;
}
.testimoni-card img{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
    display:block;
}
.testimoni-body{
    padding:24px 20px 26px;
    text-align:center;
}
.testimoni-body .quote{
    min-height:88px;
    margin:0 0 22px;
    color:#9aa1ad;
    font-style:italic;
    font-size:16px;
    line-height:1.55;
}
.testimoni-body h3{
    margin:0 0 8px;
    color:#0d469f;
    font-size:20px;
    font-weight:800;
}
.testimoni-body span{
    color:#53657d;
    font-size:14px;
}
.testimoni-nav{
    position:absolute;
    top:42%;
    transform:translateY(-50%);
    width:38px;
    height:38px;
    border:none;
    border-radius:50%;
    background:#0d469f;
    color:#fff;
    font-size:28px;
    line-height:36px;
    cursor:pointer;
    z-index:3;
    box-shadow:0 12px 24px rgba(13,70,159,.22);
    transition:.2s;
}
.testimoni-nav:hover{background:#07306f; transform:translateY(-50%) scale(1.06)}
.testimoni-prev{left:0}
.testimoni-next{right:0}
.testimoni-dots{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    justify-content:center;
    gap:8px;
}
.testimoni-dot{
    width:8px;
    height:8px;
    border:none;
    border-radius:50%;
    background:#cbd6e6;
    cursor:pointer;
    transition:.25s;
}
.testimoni-dot.active{
    width:26px;
    border-radius:20px;
    background:#0d469f;
}
.akreditasi-section{
    margin-top:0 !important;
    padding-top:46px !important;
    border-top:1px solid #eef2f7;
}
.content-grid{
    margin-top:35px !important;
}
@media(max-width:900px){
    .testimoni-layout{grid-template-columns:1fr;}
    .testimoni-slider-wrap{padding:0 44px 34px;}
    .testimoni-card{flex-basis:100%;}
    .testimoni-photo{height:260px;}
}
@media(max-width:520px){
    .testimoni-slider-wrap{padding:0 0 38px;}
    .testimoni-nav{display:none;}
    .testimoni-photo{height:240px;}
}


/* UPDATE V21 - Urutan section, warna header admin, footer bergaris */
.topbar-modern,
.navbar{
    background:var(--header) !important;
}
.navbar{
    border-bottom:1px solid rgba(0,0,0,.06);
}

/* Pastikan urutan visual setelah berita rapi */
.content-grid{
    margin-top:42px !important;
    margin-bottom:0 !important;
}
.akreditasi-section{
    margin-top:45px !important;
}
.testimoni-modern{
    margin-top:0 !important;
}

/* Footer desain garis kuning + biru seperti contoh */
.partner{
    background:#fff !important;
    margin-top:45px !important;
    border-bottom:6px solid #ffdf00;
}
footer{
    background:
        linear-gradient(135deg, rgba(255,255,255,.05), transparent 35%),
        radial-gradient(circle at 25% 30%, rgba(255,255,255,.14), transparent 28%),
        var(--footer) !important;
    color:#fff !important;
    position:relative;
    overflow:hidden;
    padding:55px 0 20px !important;
}
footer:before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size:44px 44px;
    opacity:.28;
}
footer:after{
    content:"";
    position:absolute;
    right:-120px;
    top:-120px;
    width:520px;
    height:520px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.16);
    box-shadow:0 0 0 35px rgba(255,255,255,.045), 0 0 0 70px rgba(255,255,255,.03);
}
footer .container,
footer .copy{
    position:relative;
    z-index:1;
}
footer h3, footer h4, footer p, footer a{
    color:#fff !important;
}
footer h3{
    font-size:20px;
    line-height:1.35;
}
.footer-grid{
    border-bottom:1px solid rgba(255,255,255,.28);
    padding-bottom:28px;
}
.copy{
    color:#fff !important;
    opacity:.95;
}

/* Admin juga mengikuti warna header/footer yang diatur */
.top-admin{
    border-top:5px solid var(--primary);
}


/* UPDATE V22 - semua warna utama bisa dikontrol dari admin */
body{
    background:var(--bg) !important;
    color:var(--text) !important;
}
.topbar-modern,
.navbar{
    background:var(--header) !important;
}
.menu a,
.brand span{
    color:var(--menu) !important;
}
.menu a:after{
    background:var(--button) !important;
}
.btn.dark,
.hero-slider .btn.dark{
    background:var(--button) !important;
    border-color:var(--button) !important;
}
.btn.light,
.hero-slider .btn.light{
    color:var(--button) !important;
    border-color:var(--button) !important;
}
.panel,
.card,
.news-card,
.testimoni-card,
.hero-feature-card,
.akreditasi-item,
.floating-card,
.shortcut,
.promo-slider,
.page-card,
.gallery-page div{
    background:var(--card) !important;
}
.circle,
.big,
.medium,
.section-title h2{
    border-color:var(--primary) !important;
}
.circle{
    background:var(--primary) !important;
}
footer{
    background:
        linear-gradient(135deg, rgba(255,255,255,.05), transparent 35%),
        radial-gradient(circle at 25% 30%, rgba(255,255,255,.14), transparent 28%),
        var(--footer) !important;
}
.partner{
    border-bottom-color:var(--primary) !important;
}


/* UPDATE V23 - navbar utama tetap putih */
.navbar,
.navbar .container,
.main-header,
.header-main{
    background:#ffffff !important;
}

/* hanya topbar kecil atas yang mengikuti warna header */
.topbar-modern{
    background:var(--header) !important;
}


/* UPDATE V24 - Statistik biru menggantikan card fitur di bawah hero */
.hero-feature-card{
    display:none !important;
}

.statistik-blue-card{
    position:relative;
    z-index:40;
    margin-top:-115px;
    min-height:360px;
    border-radius:28px;
    padding:48px 62px;
    color:#fff;
    background:
        radial-gradient(circle at 20% 35%, rgba(255,255,255,.12), transparent 28%),
        radial-gradient(circle at 75% 58%, rgba(255,255,255,.10), transparent 32%),
        linear-gradient(135deg,#268cf2 0%, #0d5ce4 48%, #0847ad 100%);
    box-shadow:0 24px 58px rgba(13,92,228,.25);
    display:grid;
    grid-template-columns:1.05fr 1.25fr 1.05fr;
    align-items:center;
    gap:36px;
    overflow:hidden;
}

.statistik-blue-card:before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size:58px 58px;
    opacity:.22;
}

.statistik-blue-card:after{
    content:"";
    position:absolute;
    inset:0;
    background:
        radial-gradient(ellipse at center, transparent 30%, rgba(255,255,255,.06) 65%, transparent 100%);
    opacity:.55;
}

.statistik-blue-card > div{
    position:relative;
    z-index:2;
}

.stat-left,
.stat-right{
    text-align:center;
}

.stat-number-yellow{
    color:#fff52a;
    font-size:48px;
    line-height:1;
    font-weight:900;
    margin-bottom:16px;
}

.stat-number-white{
    color:#fff;
    font-size:48px;
    line-height:1;
    font-weight:900;
    margin-bottom:16px;
}

.statistik-blue-card h3{
    color:#fff;
    font-size:23px;
    font-weight:800;
    margin:0 0 12px;
}

.statistik-blue-card p{
    color:#fff;
    font-size:18px;
    line-height:1.5;
    margin:6px 0;
}

.stat-center h3{
    text-align:center;
    margin-bottom:28px;
}

.stat-center h3 span{
    font-size:42px;
    vertical-align:middle;
    margin-left:18px;
}

.prestasi-row{
    display:grid;
    grid-template-columns:78px 1fr;
    gap:18px;
    align-items:center;
    margin-bottom:24px;
    color:#fff;
    font-size:16px;
    line-height:1.35;
}

.prestasi-photo{
    width:78px;
    height:78px;
    border-radius:50%;
    background:rgba(255,255,255,.18);
    border:3px solid rgba(255,255,255,.35);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
}

.shortcut{
    margin-top:28px !important;
}

@media(max-width:900px){
    .statistik-blue-card{
        grid-template-columns:1fr;
        margin-top:-70px;
        padding:34px 26px;
        text-align:center;
    }
    .prestasi-row{
        max-width:380px;
        margin-left:auto;
        margin-right:auto;
        text-align:left;
    }
}


/* FIX TESTIMONI - tampil seperti UT: hanya 3 kartu, slider bergantian, foto tidak zoom */
.testimoni-modern{
    padding:76px 0 52px !important;
}
.testimoni-layout{
    grid-template-columns:280px minmax(0, 1fr) !important;
    gap:42px !important;
    align-items:center !important;
}
.testimoni-title h2{
    text-transform:uppercase !important;
    font-size:28px !important;
    line-height:1.08 !important;
}
.testimoni-slider-wrap{
    padding:0 0 36px !important;
    overflow:hidden !important;
}
.testimoni-viewport{
    width:100% !important;
    overflow:hidden !important;
}
.testimoni-cards{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:22px !important;
    align-items:stretch !important;
    transition:transform .7s cubic-bezier(.22,.72,.16,1) !important;
}
.testimoni-card{
    flex:0 0 calc((100% - 44px) / 3) !important;
    max-width:calc((100% - 44px) / 3) !important;
    min-width:0 !important;
    border-radius:14px !important;
    overflow:hidden !important;
}
.testimoni-photo{
    height:168px !important;
    background:#f6f8fc !important;
    overflow:hidden !important;
}
.testimoni-card img{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    object-position:center center !important;
    display:block !important;
}
.testimoni-body{
    padding:18px 16px 22px !important;
}
.testimoni-body .quote{
    min-height:78px !important;
    margin-bottom:18px !important;
    font-size:14px !important;
    line-height:1.55 !important;
}
.testimoni-body h3{
    font-size:17px !important;
    margin-bottom:6px !important;
}
.testimoni-body span{
    font-size:12px !important;
}
.testimoni-nav{
    display:none !important;
}
.testimoni-dots{
    bottom:6px !important;
}
@media(max-width:900px){
    .testimoni-layout{grid-template-columns:1fr !important; gap:26px !important;}
    .testimoni-card{flex-basis:calc((100% - 22px) / 2) !important; max-width:calc((100% - 22px) / 2) !important;}
    .testimoni-photo{height:170px !important;}
}
@media(max-width:640px){
    .testimoni-card{flex-basis:100% !important; max-width:100% !important;}
    .testimoni-photo{height:190px !important;}
}


/* Floating buttons seperti website UT */
.accessibility-btn{
    position:fixed !important;
    left:18px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    width:58px !important;
    height:58px !important;
    border-radius:50% !important;
    background:#004aad !important;
    color:#fff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    z-index:99999 !important;
    text-decoration:none !important;
    box-shadow:0 8px 22px rgba(0,0,0,.20) !important;
    border:4px solid #fff !important;
    transition:.3s ease !important;
}

.accessibility-btn svg{
    width:38px !important;
    height:38px !important;
    fill:#fff !important;
    display:block !important;
}

.accessibility-btn:hover{
    transform:translateY(-50%) scale(1.08) !important;
    background:#003b8f !important;
}

.chat-btn{
    position:fixed !important;
    right:26px !important;
    bottom:28px !important;
    background:#004aad !important;
    color:#fff !important;
    padding:14px 22px !important;
    border-radius:40px !important;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    font-size:17px !important;
    font-weight:700 !important;
    text-decoration:none !important;
    z-index:99999 !important;
    box-shadow:0 8px 22px rgba(0,0,0,.20) !important;
    transition:.3s ease !important;
}

.chat-btn:hover{
    background:#003b8f !important;
    transform:translateY(-4px) !important;
    color:#fff !important;
}

.chat-icon{
    width:28px !important;
    height:28px !important;
    border-radius:50% !important;
    background:#fff !important;
    color:#004aad !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:18px !important;
    font-weight:900 !important;
}

@media(max-width:600px){
    .accessibility-btn{
        width:50px !important;
        height:50px !important;
        left:12px !important;
    }
    .accessibility-btn svg{
        width:32px !important;
        height:32px !important;
    }
    .chat-btn{
        right:14px !important;
        bottom:18px !important;
        padding:12px 16px !important;
        font-size:14px !important;
    }
}

/* ===== ACCESSIBILITY WIDGET PANEL - USERWAY STYLE CUSTOM ===== */
.accessibility-btn{
    position:fixed !important;
    left:18px !important;
    top:50% !important;
    bottom:auto !important;
    transform:translateY(-50%) !important;
    width:60px !important;
    height:60px !important;
    border-radius:50% !important;
    border:4px solid #ffffff !important;
    background:#004aad !important;
    color:#ffffff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    cursor:pointer !important;
    z-index:99999 !important;
    box-shadow:0 8px 24px rgba(0,0,0,.22) !important;
    padding:0 !important;
}

.accessibility-btn svg{
    width:38px !important;
    height:38px !important;
    fill:#ffffff !important;
}

.accessibility-btn:hover{
    transform:translateY(-50%) scale(1.08) !important;
    background:#003b8f !important;
}

.accessibility-overlay{
    position:fixed !important;
    inset:0 !important;
    background:rgba(0,0,0,.18) !important;
    z-index:999998 !important;
    opacity:0 !important;
    visibility:hidden !important;
    transition:.3s ease !important;
}

.accessibility-overlay.active{
    opacity:1 !important;
    visibility:visible !important;
}

.accessibility-panel{
    position:fixed !important;
    left:-390px !important;
    top:0 !important;
    width:360px !important;
    max-width:100% !important;
    height:100vh !important;
    background:#eef1f5 !important;
    z-index:999999 !important;
    transition:left .35s ease !important;
    overflow-y:auto !important;
    box-shadow:0 0 28px rgba(0,0,0,.25) !important;
    border-radius:0 16px 16px 0 !important;
}

.accessibility-panel.active{
    left:0 !important;
}

.accessibility-header{
    background:#004aad !important;
    color:#fff !important;
    min-height:50px !important;
    padding:12px 18px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
}

.accessibility-header h3{
    margin:0 !important;
    color:#fff !important;
    font-size:16px !important;
    font-weight:800 !important;
}

.accessibility-header h3 span{
    font-size:14px !important;
    font-weight:700 !important;
}

.accessibility-header button{
    width:32px !important;
    height:32px !important;
    border-radius:50% !important;
    border:none !important;
    background:#073778 !important;
    color:#fff !important;
    font-size:28px !important;
    line-height:28px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    cursor:pointer !important;
}

.userway-demo-btn{
    margin:18px 18px 10px !important;
    background:#004aad !important;
    color:#fff !important;
    border-radius:12px !important;
    padding:14px 16px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:12px !important;
    font-size:15px !important;
}

.userway-demo-btn span{
    width:22px !important;
    height:22px !important;
    border-radius:50% !important;
    background:#073778 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:11px !important;
}

.accessibility-grid{
    padding:8px 18px 18px !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
}

.acc-item{
    min-height:104px !important;
    background:#ffffff !important;
    color:#000 !important;
    border:none !important;
    border-radius:12px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    cursor:pointer !important;
    font-size:14px !important;
    font-weight:800 !important;
    text-align:center !important;
    transition:.25s ease !important;
}

.acc-item:hover,
.acc-item.active{
    background:#004aad !important;
    color:#fff !important;
    transform:translateY(-3px) !important;
}

.acc-icon{
    color:inherit !important;
    font-size:30px !important;
    line-height:1 !important;
    min-height:34px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}

.reset-accessibility{
    width:calc(100% - 36px) !important;
    margin:0 18px 18px !important;
    border:none !important;
    border-radius:12px !important;
    background:#004aad !important;
    color:#fff !important;
    padding:15px 16px !important;
    font-size:15px !important;
    font-weight:800 !important;
    cursor:pointer !important;
}

.accessibility-footer{
    padding:0 18px 22px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
}

.accessibility-footer button{
    border:none !important;
    background:transparent !important;
    color:#111 !important;
    font-weight:700 !important;
    cursor:pointer !important;
    padding:0 !important;
}

.accessibility-footer strong{
    color:#004aad !important;
    font-size:14px !important;
}

/* Accessibility effects */
body.acc-contrast,
body.acc-contrast *:not(img):not(video):not(svg):not(path){
    background:#000 !important;
    color:#fff !important;
    border-color:#fff !important;
}

body.acc-highlight-links a{
    outline:3px solid #ffcc00 !important;
    background:#ffcc00 !important;
    color:#000 !important;
    text-decoration:underline !important;
}

body.acc-big-text{
    font-size:118% !important;
}

body.acc-text-spacing,
body.acc-text-spacing *{
    letter-spacing:2px !important;
    word-spacing:4px !important;
}

body.acc-pause-animation *,
body.acc-pause-animation *::before,
body.acc-pause-animation *::after{
    animation:none !important;
    transition:none !important;
    scroll-behavior:auto !important;
}

body.acc-hide-images img{
    visibility:hidden !important;
}

body.acc-dyslexia,
body.acc-dyslexia *{
    font-family:Arial, Verdana, sans-serif !important;
}

body.acc-big-cursor,
body.acc-big-cursor *{
    cursor:pointer !important;
}

body.acc-line-height,
body.acc-line-height *{
    line-height:2 !important;
}

body.acc-text-align p,
body.acc-text-align h1,
body.acc-text-align h2,
body.acc-text-align h3,
body.acc-text-align h4,
body.acc-text-align h5,
body.acc-text-align h6,
body.acc-text-align li{
    text-align:left !important;
}

body.acc-saturation{
    filter:saturate(1.8) !important;
}

body.acc-tooltips a:hover::after,
body.acc-tooltips button:hover::after{
    content:attr(aria-label) attr(title) !important;
    position:absolute !important;
    background:#111 !important;
    color:#fff !important;
    padding:6px 9px !important;
    border-radius:6px !important;
    font-size:12px !important;
    z-index:9999999 !important;
    margin-top:28px !important;
}

@media(max-width:500px){
    .accessibility-panel{
        width:100% !important;
        left:-105% !important;
        border-radius:0 !important;
    }
    .accessibility-panel.active{
        left:0 !important;
    }
    .accessibility-btn{
        width:52px !important;
        height:52px !important;
        left:12px !important;
    }
    .accessibility-btn svg{
        width:32px !important;
        height:32px !important;
    }
}

/* ===== MEGA MENU FEB UNISAN - LIKE UT STYLE ===== */
.navbar{overflow:visible !important; z-index:9990 !important;}
.nav-flex{position:relative !important;}
.menu-mega{align-items:center !important;}
.menu-mega li{position:relative !important;}
.menu-mega .chevron{font-size:15px; margin-left:4px; font-weight:700;}

.has-mega .mega-menu{
    position:absolute;
    top:100%;
    left:50%;
    transform:translateX(-50%) translateY(18px);
    width:min(1060px, calc(100vw - 40px));
    background:#fff;
    border:1px solid #e8edf5;
    border-radius:0 0 18px 18px;
    box-shadow:0 22px 55px rgba(15,34,67,.14);
    padding:0 34px 0 0;
    display:grid;
    grid-template-columns:330px repeat(3, 1fr);
    gap:28px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:.28s ease;
    z-index:9999;
    overflow:hidden;
}

.has-mega:hover .mega-menu,
.has-mega:focus-within .mega-menu{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateX(-50%) translateY(0);
}

.mega-card{
    position:relative;
    min-height:330px;
    overflow:hidden;
    background:linear-gradient(135deg,#003b8f,#0d5ce4);
}

.mega-card img{
    width:100%;
    height:100%;
    min-height:330px;
    object-fit:contain;
    padding:58px 42px 110px;
    background:linear-gradient(135deg,#f8fbff,#dbeaff);
}

.mega-card-overlay{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    padding:34px 26px 28px;
    color:#fff;
    background:linear-gradient(to top, rgba(0,74,173,.96), rgba(0,74,173,.55), transparent);
}

.mega-card-overlay h3{margin:0 0 7px; font-size:20px; line-height:1.25; color:#fff;}
.mega-card-overlay p{margin:0 0 18px; color:#fff; font-size:14px;}
.mega-btn{
    display:inline-flex !important;
    align-items:center;
    gap:12px;
    background:#ffd400;
    color:#061a3a !important;
    padding:12px 20px !important;
    border-radius:28px;
    font-size:14px !important;
    font-weight:700 !important;
}
.mega-btn:after{display:none !important;}
.mega-btn span{font-size:22px; line-height:0;}

.mega-col{padding:30px 0 28px;}
.mega-col h4{margin:0 0 18px; color:#004aad; font-size:18px;}
.mega-col a{
    display:block !important;
    padding:9px 0 !important;
    color:#475569 !important;
    font-size:15px !important;
    font-weight:500 !important;
    line-height:1.35;
}
.mega-col a:after{display:none !important;}
.mega-col a:hover{color:#004aad !important; padding-left:8px !important;}

.has-small-dropdown .dropdown-menu{
    position:absolute;
    top:100%;
    left:0;
    min-width:230px;
    background:#fff;
    border:1px solid #e8edf5;
    border-radius:0 0 14px 14px;
    box-shadow:0 18px 42px rgba(15,34,67,.13);
    padding:12px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(16px);
    transition:.25s ease;
    z-index:9999;
}
.has-small-dropdown:hover .dropdown-menu,
.has-small-dropdown:focus-within .dropdown-menu{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
}
.dropdown-menu a{
    display:block !important;
    padding:12px 14px !important;
    border-radius:10px;
    color:#334155 !important;
    font-size:14px !important;
    font-weight:700 !important;
}
.dropdown-menu a:after{display:none !important;}
.dropdown-menu a:hover{background:#eef5ff; color:#004aad !important;}

.video-doc-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:26px; margin-bottom:40px;}
.video-doc-card{background:#fff; border-radius:16px; padding:18px; box-shadow:0 8px 24px rgba(0,0,0,.08);}
.video-doc-card h3{margin:16px 0 4px; color:#004aad;}
.video-frame{position:relative; width:100%; padding-top:56.25%; border-radius:12px; overflow:hidden; background:#0f172a;}
.video-frame iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}

@media(max-width:900px){
    .has-mega .mega-menu,
    .has-small-dropdown .dropdown-menu{
        position:static;
        transform:none;
        opacity:1;
        visibility:visible;
        pointer-events:auto;
        width:100%;
        display:none;
        box-shadow:none;
        border:0;
        padding:10px 0;
        border-radius:12px;
    }
    .has-mega:hover .mega-menu,
    .has-mega:focus-within .mega-menu,
    .has-small-dropdown:hover .dropdown-menu,
    .has-small-dropdown:focus-within .dropdown-menu{display:block; transform:none;}
    .has-mega .mega-menu{grid-template-columns:1fr;}
    .mega-card{display:none;}
    .mega-col{padding:6px 14px;}
    .video-doc-grid{grid-template-columns:1fr;}
}

/* Modern header/menu typography */
body{font-family:'Inter','Segoe UI',Arial,sans-serif;color:#10233f;}
.brand{gap:14px;text-decoration:none;}
.brand img{width:54px;height:54px;object-fit:contain;}
.brand-text strong{display:block;font-size:14px;line-height:1.18;font-weight:700;letter-spacing:.01em;color:#061a3a;}
.brand-text small{display:block;font-size:12px;line-height:1.3;font-weight:500;color:#24405f;margin-top:2px;}
.menu>li>a{font-weight:600!important;font-size:14px!important;letter-spacing:.01em;color:#0b1f3a!important;}
.menu>li>a:hover{color:var(--button)!important;}
.mega-menu{border-radius:0 0 18px 18px;box-shadow:0 22px 60px rgba(10,32,64,.12);border:1px solid rgba(10,32,64,.08);}
.mega-dekan-card img{object-fit:cover!important;object-position:top center!important;}
.mega-eyebrow{display:inline-block;margin-bottom:8px;background:rgba(255,255,255,.18);padding:5px 10px;border-radius:999px;font-size:12px;font-weight:700;}
.dropdown-menu{border-radius:0 0 14px 14px;box-shadow:0 18px 40px rgba(10,32,64,.13);border:1px solid rgba(10,32,64,.08);}
.dropdown-menu a{font-weight:500!important;color:#233a59!important;}
.dropdown-menu a:hover{background:#f3f7ff;color:var(--button)!important;}
/* Content pages */
.menu-content-wrap,.profil-modern{display:grid;gap:24px;}
.content-section{background:#fff;border-radius:18px;padding:32px;box-shadow:0 12px 35px rgba(10,32,64,.06);border:1px solid rgba(10,32,64,.06);scroll-margin-top:120px;}
.content-section h2{color:#004aad;margin-bottom:12px;font-size:26px;font-weight:750;}
.content-section p{color:#596a80;line-height:1.8;font-size:16px;}
.dekan-section{display:grid;grid-template-columns:320px 1fr;gap:34px;align-items:center;background:linear-gradient(135deg,#fff,#f5f9ff);border-radius:24px;padding:34px;box-shadow:0 18px 45px rgba(10,32,64,.08);scroll-margin-top:120px;}
.dekan-photo{height:360px;border-radius:22px;overflow:hidden;background:#eef4ff;box-shadow:0 16px 30px rgba(10,32,64,.14);}
.dekan-photo img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.section-kicker{color:#f5ad00;text-transform:uppercase;font-weight:800;font-size:13px;letter-spacing:.12em;}
.dekan-section h2{font-size:32px;color:#004aad;margin:10px 0 6px;}
.dekan-section h4{font-size:17px;color:#24405f;margin:0 0 18px;font-weight:600;}
.dekan-section p{font-size:16px;line-height:1.85;color:#52657d;}
/* Album gallery */
.album-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.album-card{display:block;background:#fff;border-radius:20px;overflow:hidden;text-decoration:none;color:#10233f;box-shadow:0 14px 36px rgba(10,32,64,.08);transition:.3s ease;border:1px solid rgba(10,32,64,.06);}
.album-card:hover{transform:translateY(-8px);box-shadow:0 22px 48px rgba(10,32,64,.12);}
.album-card img{width:100%;height:220px;object-fit:cover;display:block;}
.album-card div{padding:20px;}
.album-card span{display:inline-block;background:#eef5ff;color:#004aad;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:700;margin-bottom:12px;}
.album-card h3{font-size:20px;color:#004aad;margin:0 0 8px;font-weight:750;}
.album-card p{font-size:14px;color:#607087;line-height:1.6;margin:0;}
.lightbox-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.gallery-item{background:#fff;border-radius:18px;overflow:hidden;cursor:pointer;box-shadow:0 12px 30px rgba(10,32,64,.07);transition:.25s ease;}
.gallery-item:hover{transform:translateY(-6px);}
.gallery-item img{width:100%;height:220px;object-fit:cover;display:block;}
.gallery-item h3{padding:16px;color:#004aad;font-size:17px;}
.lightbox{position:fixed;inset:0;background:rgba(1,12,30,.86);z-index:999999;display:none;align-items:center;justify-content:center;flex-direction:column;padding:30px;}
.lightbox.active{display:flex;}
.lightbox img{max-width:92vw;max-height:78vh;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.35);}
.lightbox p{color:#fff;font-weight:700;margin-top:16px;font-size:18px;}
.lightbox button{position:absolute;right:28px;top:22px;background:#fff;color:#004aad;border:none;width:44px;height:44px;border-radius:50%;font-size:30px;cursor:pointer;}
.menu-admin-block{padding:18px;border:1px solid #e4eaf3;border-radius:14px;margin-bottom:16px;background:#fff;}
@media(max-width:900px){.dekan-section{grid-template-columns:1fr}.album-grid,.lightbox-gallery{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.album-grid,.lightbox-gallery{grid-template-columns:1fr}.dekan-photo{height:280px}.content-section,.dekan-section{padding:22px}.brand-text strong{font-size:12px}.brand-text small{font-size:11px}}

/* UPDATE V30 - tipografi website dan sosial media berwarna */
body{font-family:Inter,Segoe UI,Arial,sans-serif}.brand-text strong{font-weight:700;letter-spacing:.2px;line-height:1.18}.brand-text small{font-weight:500;letter-spacing:.15px}.menu a{font-weight:600;letter-spacing:.1px}.top-social.social-colorful{display:flex;align-items:center;gap:9px}.top-social .soc{width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff !important;text-decoration:none;box-shadow:0 4px 12px rgba(0,0,0,.12);transition:.25s}.top-social .soc:hover{transform:translateY(-3px)}.top-social .youtube{background:#ff0000}.top-social .instagram{background:linear-gradient(135deg,#f58529,#dd2a7b,#8134af)}.top-social .facebook{background:#1877f2}.top-social .tiktok{background:#111}.top-social .linkedin{background:#0a66c2}.top-social span{font-weight:700;color:#073b76;display:flex;gap:5px;align-items:center}

/* UPDATE V31 - fix sosial media agar tidak putih dan tipografi menu lebih modern */
html body .topbar .top-social.social-colorful a.soc{
    width:30px !important;
    height:30px !important;
    border-radius:50% !important;
    color:#fff !important;
    border:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:14px !important;
    box-shadow:0 6px 16px rgba(0,0,0,.15) !important;
}
html body .topbar .top-social.social-colorful a.soc i{color:#fff !important;line-height:1 !important;}
html body .topbar .top-social.social-colorful a.soc.youtube{background:#ff0000 !important;}
html body .topbar .top-social.social-colorful a.soc.instagram{background:linear-gradient(135deg,#f58529,#dd2a7b,#8134af,#515bd4) !important;}
html body .topbar .top-social.social-colorful a.soc.facebook{background:#1877f2 !important;}
html body .topbar .top-social.social-colorful a.soc.tiktok{background:#111 !important;}
html body .topbar .top-social.social-colorful a.soc.linkedin{background:#0a66c2 !important;}
.brand-text strong{font-weight:600 !important;letter-spacing:.02em !important;font-size:13.5px !important;}
.brand-text small{font-weight:400 !important;letter-spacing:.01em !important;}
.menu>li>a{font-weight:500 !important;font-size:14px !important;}


/* Riset dan Inovasi */
.filter-pills{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 26px;}
.filter-pills a{display:inline-flex;align-items:center;padding:10px 16px;border-radius:999px;background:#eef4ff;color:#24415f;font-weight:700;text-decoration:none;border:1px solid #dbe8ff;transition:.2s ease;}
.filter-pills a:hover,.filter-pills a.active{background:var(--button);color:#fff;border-color:var(--button);}
.ri-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:36px;}
.ri-card{background:#fff;border:1px solid #e8edf5;border-radius:18px;overflow:hidden;box-shadow:0 12px 34px rgba(15,34,67,.08);}
.ri-card>img{width:100%;height:190px;object-fit:cover;display:block;}
.ri-card-body{padding:20px;}
.ri-badge{display:inline-block;padding:6px 10px;border-radius:999px;background:#eef5ff;color:#004aad;font-size:12px;font-weight:800;margin-bottom:10px;}
.ri-card h3{margin:0 0 8px;color:#0f2948;font-size:20px;line-height:1.3;}
.ri-card small{display:block;color:#718096;margin-bottom:12px;}
.ri-card p{color:#475569;line-height:1.65;margin:0 0 12px;}
.ri-content{color:#475569;line-height:1.65;border-top:1px solid #edf2f7;margin-top:12px;padding-top:12px;}
.btn-link{display:inline-flex;align-items:center;gap:6px;margin-top:14px;color:var(--button);font-weight:800;text-decoration:none;}
.empty-state{grid-column:1/-1;text-align:center;background:#fff;border:1px dashed #cbd5e1;border-radius:18px;padding:36px;color:#475569;}
@media(max-width:900px){.ri-grid{grid-template-columns:1fr;}.filter-pills a{font-size:13px;padding:9px 12px;}}


/* Dosen dan Staf Page */
.dosen-hero{background:linear-gradient(135deg,#061a3a 0%,#0d5ce4 65%,#f5ad00 100%);padding:72px 0;color:#fff;position:relative;overflow:hidden;}
.dosen-hero:after{content:"";position:absolute;right:-120px;top:-120px;width:360px;height:360px;border-radius:50%;background:rgba(255,255,255,.14);}
.dosen-hero-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;position:relative;z-index:1;}
.dosen-hero h1{font-size:46px;margin:10px 0 12px;}
.dosen-hero p{font-size:18px;max-width:680px;line-height:1.7;margin:0;color:#eef5ff;}
.dosen-hero .section-kicker{color:#ffd55c;}
.dosen-hero-badge{width:150px;height:150px;border-radius:28px;background:rgba(255,255,255,.16);backdrop-filter:blur(8px);display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.25);}
.dosen-hero-badge strong{font-size:44px;line-height:1;color:#ffd55c;}.dosen-hero-badge span{font-weight:700;margin-top:8px;}
.dosen-page{padding-bottom:46px;}.dosen-title{text-align:center;font-size:34px;color:#111827;margin:18px 0 24px;}
.dosen-filter{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin:0 0 25px;}
.dosen-filter a{padding:11px 18px;border-radius:999px;background:#fff;border:1px solid #dbe7ff;color:#14325c;font-weight:800;box-shadow:0 8px 24px rgba(10,32,64,.06);}
.dosen-filter a.active,.dosen-filter a:hover{background:#0d5ce4;color:#fff;border-color:#0d5ce4;}
.dosen-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;align-items:stretch;}
.dosen-card{background:#fff;border:1px solid #e7edf6;border-radius:18px;overflow:hidden;box-shadow:0 14px 34px rgba(15,34,67,.08);transition:.25s ease;}
.dosen-card:hover{transform:translateY(-7px);box-shadow:0 20px 48px rgba(15,34,67,.14);}.dosen-photo{height:340px;background:#243268;overflow:hidden;}
.dosen-photo img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;}.dosen-info{text-align:center;padding:22px 20px 24px;}
.dosen-info h3{font-size:21px;line-height:1.25;margin:0 0 12px;color:#111827;text-transform:uppercase;font-weight:850;}.dosen-role{display:inline-block;background:#eef2ff;color:#3b41ff;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:850;text-transform:uppercase;}
.dosen-line{height:1px;background:#edf2f7;margin:24px 0 15px;}.dosen-info p{margin:8px 0;color:#6b7280;font-size:14px;line-height:1.45;}.dosen-info i{color:#0d5ce4;margin-right:6px;}
@media(max-width:1000px){.dosen-grid{grid-template-columns:repeat(2,1fr)}.dosen-hero-inner{display:block}.dosen-hero-badge{margin-top:24px}.dosen-photo{height:310px}}
@media(max-width:600px){.dosen-grid{grid-template-columns:1fr}.dosen-hero h1{font-size:36px}.dosen-photo{height:360px}}


/* UPDATE V32 - Dosen/Staf grouped modern */
.dosen-hero-modern{background:radial-gradient(circle at 15% 20%,rgba(255,213,92,.35),transparent 28%),linear-gradient(135deg,#071d45 0%,#075fe5 58%,#f5ad00 100%);}
.dosen-hero-modern:before{content:"";position:absolute;left:-90px;bottom:-120px;width:330px;height:330px;border-radius:50%;background:rgba(255,255,255,.12)}
.dosen-page-modern{background:#f6f9fe;border-radius:28px;margin-top:-26px;position:relative;z-index:2;padding-top:32px;}
.glass-filter{background:rgba(255,255,255,.82);border:1px solid #e7effc;border-radius:22px;padding:12px;box-shadow:0 18px 45px rgba(13,92,228,.08);backdrop-filter:blur(10px)}
.homebase-section{margin:34px 0 46px;}
.homebase-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:18px;padding:0 6px;}
.homebase-heading span{display:inline-block;color:#0d5ce4;font-weight:900;text-transform:uppercase;letter-spacing:1px;font-size:12px;margin-bottom:5px;}
.homebase-heading h2{margin:0;color:#0a1f44;font-size:30px;letter-spacing:-.5px;}
.homebase-heading strong{background:#fff7db;color:#9a6500;border:1px solid #ffe2a6;padding:10px 15px;border-radius:999px;box-shadow:0 10px 24px rgba(245,173,0,.12)}
.dosen-grid-modern{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;}
.dosen-card-modern{background:#fff;border:1px solid #e7edf6;border-radius:24px;overflow:hidden;box-shadow:0 16px 40px rgba(7,29,69,.08);transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease;opacity:0;animation:cardFadeUp .65s ease forwards;}
.dosen-card-modern:hover{transform:translateY(-8px);box-shadow:0 26px 60px rgba(7,29,69,.15);border-color:#bcd4ff;}
.dosen-photo-modern{height:310px;background:linear-gradient(135deg,#101f55,#273c8d);position:relative;overflow:hidden;}
.dosen-photo-modern:after{content:"";position:absolute;inset:auto 0 0 0;height:40%;background:linear-gradient(transparent,rgba(0,0,0,.18));}
.dosen-photo-modern img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform .4s ease;}
.dosen-card-modern:hover .dosen-photo-modern img{transform:scale(1.04);}
.dosen-info-modern{padding:19px 18px 22px;text-align:center;}
.homebase-pill{display:inline-block;margin-top:-36px;position:relative;z-index:2;background:#0d5ce4;color:#fff;padding:7px 13px;border-radius:999px;font-size:11px;font-weight:900;box-shadow:0 8px 20px rgba(13,92,228,.25);}
.dosen-info-modern h3{font-size:19px;line-height:1.28;margin:13px 0 9px;color:#111827;text-transform:uppercase;font-weight:900;}
.dosen-role-modern{display:inline-block;background:#eef2ff;color:#263cff;border-radius:999px;padding:7px 13px;font-size:12px;font-weight:900;text-transform:uppercase;}
.dosen-meta-modern{border-top:1px solid #edf2f7;margin-top:18px;padding-top:12px;text-align:left;}
.dosen-meta-modern p{margin:8px 0;color:#5d6b82;font-size:13px;line-height:1.45;}
.dosen-meta-modern i{color:#0d5ce4;margin-right:7px;width:15px;text-align:center;}
.modern-empty{border-radius:22px;background:#fff;box-shadow:0 12px 30px rgba(7,29,69,.08)}
@keyframes cardFadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1100px){.dosen-grid-modern{grid-template-columns:repeat(3,1fr)}}
@media(max-width:850px){.dosen-grid-modern{grid-template-columns:repeat(2,1fr)}.homebase-heading{align-items:flex-start;flex-direction:column}.dosen-photo-modern{height:290px}}
@media(max-width:560px){.dosen-grid-modern{grid-template-columns:1fr}.dosen-photo-modern{height:350px}.dosen-page-modern{border-radius:18px}.homebase-heading h2{font-size:25px}}

/* V40 Dosen dan Staf - modern grouped directory */
.dosen-page-hero-v40{position:relative;overflow:hidden;background:linear-gradient(105deg,rgba(5,57,36,.94),rgba(90,91,21,.86)),url('../img/hero-building.svg') right center/560px auto no-repeat;color:#fff;padding:86px 0 90px;margin-bottom:0;}
.dosen-page-hero-v40:after{content:"";position:absolute;right:0;bottom:-1px;width:100%;height:44px;background:#f7f9fc;border-radius:100% 100% 0 0/80% 80% 0 0;}
.breadcrumb-v40{display:flex;gap:10px;align-items:center;font-weight:700;font-size:14px;margin-bottom:25px;color:rgba(255,255,255,.85)}
.breadcrumb-v40 a{color:#ffd55c}.dosen-page-hero-v40 h1{font-size:48px;line-height:1.1;margin:0;font-weight:900;letter-spacing:-1px}.hero-line-v40{width:72px;height:4px;background:#f5ad00;border-radius:10px;margin:18px 0 22px}.dosen-page-hero-v40 p{max-width:760px;font-size:17px;line-height:1.75;margin:0;color:rgba(255,255,255,.92)}
.dosen-wrap-v40{background:#f7f9fc;padding:0 0 0}.dosen-panel-v40{position:relative;z-index:3;margin-top:-32px;background:rgba(255,255,255,.92);border:1px solid #e7edf6;border-radius:24px;padding:22px;box-shadow:0 18px 50px rgba(10,31,68,.08);backdrop-filter:blur(12px)}
.dosen-tabs-v40{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:20px}.dosen-tabs-v40 a{display:flex;align-items:center;gap:10px;padding:15px 22px;border-radius:12px;background:#fff;border:1px solid #e7edf6;color:#637083;font-weight:900;box-shadow:0 10px 28px rgba(10,31,68,.05);transition:.25s}.dosen-tabs-v40 a i{color:#73829a}.dosen-tabs-v40 a b{background:#eef4ff;color:#0d5ce4;border-radius:999px;padding:3px 8px;font-size:12px}.dosen-tabs-v40 a.active,.dosen-tabs-v40 a:hover{color:#0a1f44;border-color:#ffd55c;box-shadow:0 16px 32px rgba(245,173,0,.13);transform:translateY(-2px)}.dosen-tabs-v40 a.active{border-bottom:3px solid #f5ad00}.dosen-tabs-v40 a.active i{color:#f5ad00}
.dosen-tools-v40{display:grid;grid-template-columns:1fr 270px 110px;gap:14px;align-items:center}.search-box-v40{position:relative}.search-box-v40 i{position:absolute;left:17px;top:50%;transform:translateY(-50%);color:#7b8ba3}.search-box-v40 input,.dosen-tools-v40 select{width:100%;height:52px;border:1px solid #dce6f4;border-radius:12px;background:#fff;padding:0 16px;color:#0a1f44;font-weight:700;outline:none}.search-box-v40 input{padding-left:46px}.search-box-v40 input:focus,.dosen-tools-v40 select:focus{border-color:#0d5ce4;box-shadow:0 0 0 4px rgba(13,92,228,.08)}.dosen-tools-v40 button{height:52px;border:0;border-radius:12px;background:#0d5ce4;color:#fff;font-weight:900;cursor:pointer;box-shadow:0 12px 24px rgba(13,92,228,.22)}
.homebase-block-v40{margin:44px 0 52px}.homebase-title-v40{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.homebase-title-v40>div{display:flex;align-items:center;gap:14px;flex:1}.homebase-title-v40>div:after{content:"";height:1px;background:#dfe7f1;flex:1}.homebase-title-v40 span{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;box-shadow:0 12px 28px rgba(0,0,0,.12)}.homebase-title-v40 h2{margin:0;font-size:27px;color:#0a1f44;font-weight:900}.homebase-title-v40 em{font-style:normal;background:#fff;border:1px solid #dfe7f1;border-radius:999px;padding:10px 16px;font-weight:900;box-shadow:0 10px 28px rgba(10,31,68,.05)}.homebase-title-v40.green span{background:#14913f}.homebase-title-v40.green em{color:#14913f}.homebase-title-v40.blue span{background:#0d5ce4}.homebase-title-v40.blue em{color:#0d5ce4}.homebase-title-v40.orange span{background:#f59e0b}.homebase-title-v40.orange em{color:#d97706}.homebase-title-v40.purple span{background:#8b2bb3}.homebase-title-v40.purple em{color:#8b2bb3}
.lecturer-grid-v40{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.lecturer-card-v40{display:grid;grid-template-columns:145px 1fr;min-height:210px;background:#fff;border:1px solid #e8eef7;border-radius:18px;overflow:hidden;box-shadow:0 16px 42px rgba(7,29,69,.07);transition:.28s ease;opacity:0;animation:cardFadeUp .65s ease forwards}.lecturer-card-v40:hover{transform:translateY(-7px);box-shadow:0 28px 60px rgba(7,29,69,.13);border-color:#bdd5ff}.lecturer-img-v40{height:100%;min-height:210px;background:#eaf0f8;overflow:hidden}.lecturer-img-v40 img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:.4s}.lecturer-card-v40:hover img{transform:scale(1.05)}.lecturer-body-v40{position:relative;padding:22px 20px}.mail-v40{position:absolute;top:16px;right:16px;width:34px;height:34px;border-radius:9px;background:#f3fbf6;color:#0a9b4a;display:grid;place-items:center;border:1px solid #d9f1e3}.lecturer-body-v40 h3{margin:8px 38px 6px 0;color:#0a1f44;font-size:18px;line-height:1.25;font-weight:900}.role-v40{display:inline-block;color:#0b8b3a;font-weight:900;font-size:13px;margin-bottom:14px}.lecturer-body-v40 ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}.lecturer-body-v40 li{display:grid;grid-template-columns:18px 82px 1fr;gap:7px;align-items:start;color:#5d6b82;font-size:12.5px;line-height:1.35}.lecturer-body-v40 li i{color:#50678c}.lecturer-body-v40 li b{color:#334155}.lecturer-body-v40 li span{color:#506078}.empty-v40{background:#fff;border:1px solid #e8eef7;border-radius:18px;padding:42px;text-align:center;box-shadow:0 14px 36px rgba(7,29,69,.06);margin:44px 0}.empty-v40 i{font-size:42px;color:#b8c8df}.empty-v40 h3{margin:12px 0 6px;color:#0a1f44}.empty-v40 p{margin:0;color:#6b7280}
footer .footer-logo-v40{display:flex;gap:14px;align-items:center;margin-bottom:16px}footer .footer-logo-v40 img{width:58px;height:58px;object-fit:contain;background:rgba(255,255,255,.12);border-radius:14px;padding:6px}footer .footer-logo-v40 strong{display:block;color:#fff;font-size:15px;line-height:1.25}footer .footer-logo-v40 small{display:block;color:rgba(255,255,255,.78);font-weight:600;margin-top:3px}
@media(max-width:1100px){.lecturer-grid-v40{grid-template-columns:repeat(2,1fr)}.dosen-tools-v40{grid-template-columns:1fr 220px 100px}}
@media(max-width:760px){.dosen-page-hero-v40{padding:60px 0 78px}.dosen-page-hero-v40 h1{font-size:36px}.dosen-tools-v40{grid-template-columns:1fr}.lecturer-grid-v40{grid-template-columns:1fr}.lecturer-card-v40{grid-template-columns:120px 1fr}.homebase-title-v40{align-items:flex-start;flex-direction:column}.homebase-title-v40>div{width:100%}}
@media(max-width:480px){.lecturer-card-v40{grid-template-columns:1fr}.lecturer-img-v40{height:300px}.dosen-tabs-v40 a{width:100%;justify-content:space-between}}
/* FIX FINAL BUKU HOME */
.panel.majalah{
    min-height: 460px !important;
    overflow: hidden !important;
}

.panel.majalah .book-slider{
    position: relative !important;
    width: 100% !important;
    min-height: 300px !important;
    overflow: hidden !important;
}

.panel.majalah .book-slide{
    display: none !important;
    width: 100% !important;
    height: auto !important;
    text-decoration: none !important;
    color: #071f4d !important;
}

.panel.majalah .book-slide.active{
    display: block !important;
}

.panel.majalah .cover-img,
.panel.majalah .book-slide img{
    width: 100% !important;
    height: 320px !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 12px !important;
    display: block !important;
    margin-bottom: 16px !important;
    background: #f8fafc !important;
}

.panel.majalah .book-slide b{
    display: block !important;
    font-size: 18px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
    color: #071f4d !important;
}
/* Update profil dekan selurus dengan nama dan foto full body */
.dekan-section-wide{grid-template-columns:390px 1fr;align-items:start;gap:46px;padding:46px;background:linear-gradient(90deg,#ffffff 0%,#f7fbff 100%)}
.dekan-photo-full{height:610px;border-radius:22px;background:#f2f2f2;box-shadow:0 22px 45px rgba(10,32,64,.12)}
.dekan-photo-full img{width:100%;height:100%;object-fit:contain;object-position:center bottom;background:#f3f3f3}
.dekan-text{padding-top:4px}.dekan-text h2{font-size:42px;line-height:1.15}.dekan-text p{text-align:justify}
.fasilitas-grid{margin-top:20px}.fasilitas-card{text-decoration:none;color:inherit}.fasilitas-card img{width:100%;height:210px;object-fit:cover}.album-placeholder{height:210px;display:flex;align-items:center;justify-content:center;background:#eef4ff;color:#004aad;font-size:46px}.kemahasiswaan-grid{margin-top:20px}.kemahasiswaan-card img{height:210px;object-fit:cover}.kemahasiswaan-card .news-body p{text-align:left;color:#596a80}
@media(max-width:900px){.dekan-section-wide{grid-template-columns:1fr}.dekan-photo-full{height:520px}.dekan-text h2{font-size:32px}}
@media(max-width:600px){.dekan-photo-full{height:430px}.dekan-section-wide{padding:24px}}

/* FIX HOME STATISTIK + PRESTASI DARI DATABASE */
.statistik-home-dynamic{
    max-width:1180px;
    margin-left:auto !important;
    margin-right:auto !important;
    min-height:310px;
    padding:42px 54px;
}
.prestasi-list-home{
    display:flex;
    flex-direction:column;
    gap:14px;
}
.statistik-home-dynamic .prestasi-row{
    margin-bottom:0;
    grid-template-columns:64px 1fr;
    gap:15px;
}
.statistik-home-dynamic .prestasi-photo{
    width:64px;
    height:64px;
    font-size:28px;
    overflow:hidden;
}
.statistik-home-dynamic .prestasi-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:50%;
}
.statistik-home-dynamic .prestasi-text b{
    display:block;
    color:#fff;
    font-size:15px;
    line-height:1.35;
    margin-bottom:4px;
}
.statistik-home-dynamic .prestasi-text p{
    color:rgba(255,255,255,.92);
    font-size:13px;
    line-height:1.45;
    margin:0;
}
.prestasi-empty{
    background:rgba(255,255,255,.13);
    border:1px solid rgba(255,255,255,.22);
    border-radius:16px;
    padding:14px 16px;
    color:#fff;
    text-align:center;
    font-size:14px;
}
@media(max-width:900px){
    .statistik-home-dynamic{
        max-width:calc(100% - 28px);
        min-height:auto;
        padding:32px 24px;
    }
    .statistik-home-dynamic .prestasi-row{
        grid-template-columns:56px 1fr;
        max-width:100%;
    }
    .statistik-home-dynamic .prestasi-photo{
        width:56px;
        height:56px;
    }
}

/* =========================================================
   FINAL MODERN DESIGN - Statistik Prestasi + Shortcut Home
   Mempercantik area Mahasiswa Berprestasi dan menu cepat
   ========================================================= */
.statistik-blue-card.statistik-home-dynamic{
    position:relative !important;
    max-width:1120px !important;
    margin-top:-86px !important;
    margin-bottom:22px !important;
    padding:46px 54px !important;
    min-height:282px !important;
    border-radius:26px !important;
    display:grid !important;
    grid-template-columns:1fr 1.35fr 1fr !important;
    align-items:center !important;
    gap:36px !important;
    overflow:hidden !important;
    isolation:isolate !important;
    background:
        radial-gradient(circle at 12% 15%, rgba(255,255,255,.25), transparent 24%),
        radial-gradient(circle at 80% 15%, rgba(255,255,255,.16), transparent 22%),
        linear-gradient(135deg,#35a4ff 0%,#0d67ef 46%,#0647b4 100%) !important;
    box-shadow:
        0 28px 70px rgba(8,72,180,.25),
        inset 0 1px 0 rgba(255,255,255,.28) !important;
    border:1px solid rgba(255,255,255,.22) !important;
}

.statistik-blue-card.statistik-home-dynamic:before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    background:
        linear-gradient(90deg,rgba(255,255,255,.075) 1px,transparent 1px),
        linear-gradient(0deg,rgba(255,255,255,.06) 1px,transparent 1px) !important;
    background-size:70px 70px !important;
    opacity:.55 !important;
    z-index:-2 !important;
}

.statistik-blue-card.statistik-home-dynamic:after{
    content:"" !important;
    position:absolute !important;
    width:380px !important;
    height:380px !important;
    right:-150px !important;
    top:-120px !important;
    border-radius:50% !important;
    background:rgba(255,255,255,.12) !important;
    box-shadow:-420px 220px 0 rgba(255,255,255,.07) !important;
    z-index:-1 !important;
}

.statistik-home-dynamic .stat-left,
.statistik-home-dynamic .stat-right{
    min-height:165px !important;
    border-radius:22px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    background:rgba(255,255,255,.10) !important;
    border:1px solid rgba(255,255,255,.18) !important;
    backdrop-filter:blur(10px) !important;
    transition:transform .35s ease, background .35s ease, box-shadow .35s ease !important;
}

.statistik-home-dynamic .stat-left:hover,
.statistik-home-dynamic .stat-right:hover{
    transform:translateY(-6px) !important;
    background:rgba(255,255,255,.15) !important;
    box-shadow:0 18px 38px rgba(0,31,95,.18) !important;
}

.statistik-home-dynamic .stat-number-yellow,
.statistik-home-dynamic .stat-number-white{
    font-size:48px !important;
    font-weight:950 !important;
    letter-spacing:.5px !important;
    margin-bottom:10px !important;
    text-shadow:0 8px 18px rgba(0,0,0,.15) !important;
    animation:febStatPop .9s ease both !important;
}

.statistik-home-dynamic .stat-number-yellow{
    color:#fff22b !important;
}

.statistik-home-dynamic .stat-number-white{
    color:#ffffff !important;
}

.statistik-home-dynamic h3{
    font-size:20px !important;
    line-height:1.25 !important;
    font-weight:900 !important;
    margin:0 !important;
    color:#fff !important;
}

.statistik-home-dynamic .stat-center{
    padding:4px 0 !important;
}

.statistik-home-dynamic .stat-center > h3{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    gap:12px !important;
    margin-bottom:22px !important;
    font-size:22px !important;
    letter-spacing:.2px !important;
}

.statistik-home-dynamic .stat-center > h3 span{
    width:34px !important;
    height:34px !important;
    border-radius:50% !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:rgba(255,255,255,.16) !important;
    border:1px solid rgba(255,255,255,.25) !important;
    font-size:32px !important;
    margin:0 !important;
    line-height:1 !important;
    animation:febArrowMove 1.8s ease-in-out infinite !important;
}

.prestasi-list-home{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
}

.statistik-home-dynamic .prestasi-row{
    grid-template-columns:60px 1fr !important;
    gap:14px !important;
    padding:9px 12px !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.09) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    backdrop-filter:blur(8px) !important;
    transition:transform .3s ease, background .3s ease, border-color .3s ease !important;
    animation:febFadeUp .7s ease both !important;
}

.statistik-home-dynamic .prestasi-row:nth-child(2){animation-delay:.08s !important;}
.statistik-home-dynamic .prestasi-row:nth-child(3){animation-delay:.16s !important;}

.statistik-home-dynamic .prestasi-row:hover{
    transform:translateX(8px) !important;
    background:rgba(255,255,255,.16) !important;
    border-color:rgba(255,255,255,.28) !important;
}

.statistik-home-dynamic .prestasi-photo{
    width:58px !important;
    height:58px !important;
    border-radius:50% !important;
    background:linear-gradient(135deg,rgba(255,255,255,.34),rgba(255,255,255,.08)) !important;
    border:2px solid rgba(255,255,255,.45) !important;
    box-shadow:0 10px 22px rgba(0,0,0,.16) !important;
    overflow:hidden !important;
}

.statistik-home-dynamic .prestasi-photo img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    border-radius:50% !important;
    transition:transform .4s ease !important;
}

.statistik-home-dynamic .prestasi-row:hover .prestasi-photo img{
    transform:scale(1.08) !important;
}

.statistik-home-dynamic .prestasi-text b{
    color:#fff !important;
    font-size:14.5px !important;
    line-height:1.35 !important;
    font-weight:850 !important;
}

.statistik-home-dynamic .prestasi-text p{
    margin-top:3px !important;
    color:rgba(255,255,255,.82) !important;
    font-size:12.5px !important;
    line-height:1.45 !important;
}

.shortcut.reveal,
.shortcut{
    max-width:1120px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    margin-top:18px !important;
    border-radius:16px !important;
    overflow:hidden !important;
    display:grid !important;
    grid-template-columns:repeat(5,1fr) !important;
    background:rgba(255,255,255,.92) !important;
    box-shadow:0 18px 45px rgba(10,31,68,.12) !important;
    border:1px solid rgba(14,76,170,.08) !important;
}

.shortcut a{
    position:relative !important;
    min-height:86px !important;
    padding:20px 22px !important;
    display:flex !important;
    align-items:center !important;
    gap:14px !important;
    font-weight:800 !important;
    color:#061a3a !important;
    background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%) !important;
    border-right:1px solid rgba(14,76,170,.10) !important;
    transition:transform .3s ease, box-shadow .3s ease, color .3s ease, background .3s ease !important;
    overflow:hidden !important;
}

.shortcut a:before{
    content:"" !important;
    position:absolute !important;
    inset:auto 18px 0 18px !important;
    height:4px !important;
    border-radius:4px 4px 0 0 !important;
    background:linear-gradient(90deg,#f7cf02,#0d5ce4) !important;
    transform:scaleX(0) !important;
    transform-origin:left !important;
    transition:transform .3s ease !important;
}

.shortcut a:after{
    content:"" !important;
    position:absolute !important;
    width:120px !important;
    height:120px !important;
    right:-70px !important;
    top:-70px !important;
    border-radius:50% !important;
    background:rgba(13,92,228,.08) !important;
    transition:.3s ease !important;
}

.shortcut a:hover{
    transform:translateY(-7px) !important;
    color:#0d5ce4 !important;
    background:#fff !important;
    box-shadow:0 18px 36px rgba(13,92,228,.16) !important;
    z-index:2 !important;
}

.shortcut a:hover:before{transform:scaleX(1) !important;}
.shortcut a:hover:after{right:-46px !important;top:-46px !important;background:rgba(247,207,2,.18) !important;}

.shortcut a b{
    position:relative !important;
    z-index:1 !important;
    font-size:15px !important;
    line-height:1.18 !important;
}

@keyframes febStatPop{
    from{opacity:0;transform:translateY(14px) scale(.94)}
    to{opacity:1;transform:translateY(0) scale(1)}
}

@keyframes febFadeUp{
    from{opacity:0;transform:translateY(12px)}
    to{opacity:1;transform:translateY(0)}
}

@keyframes febArrowMove{
    0%,100%{transform:translateX(0)}
    50%{transform:translateX(5px)}
}

@media(max-width:980px){
    .statistik-blue-card.statistik-home-dynamic{
        max-width:calc(100% - 30px) !important;
        grid-template-columns:1fr !important;
        gap:18px !important;
        margin-top:-54px !important;
        padding:28px 20px !important;
        text-align:center !important;
    }
    .statistik-home-dynamic .stat-left,
    .statistik-home-dynamic .stat-right{
        min-height:120px !important;
    }
    .statistik-home-dynamic .prestasi-row{
        max-width:100% !important;
        text-align:left !important;
        transform:none !important;
    }
    .shortcut.reveal,
    .shortcut{
        max-width:calc(100% - 30px) !important;
        grid-template-columns:1fr 1fr !important;
    }
}

@media(max-width:560px){
    .statistik-home-dynamic .stat-number-yellow,
    .statistik-home-dynamic .stat-number-white{font-size:40px !important;}
    .statistik-home-dynamic .stat-center > h3{font-size:19px !important;}
    .statistik-home-dynamic .prestasi-row{grid-template-columns:52px 1fr !important;padding:9px !important;}
    .statistik-home-dynamic .prestasi-photo{width:50px !important;height:50px !important;}
    .shortcut.reveal,
    .shortcut{grid-template-columns:1fr !important;}
    .shortcut a{min-height:72px !important;}
}

@media(prefers-reduced-motion:reduce){
    .statistik-home-dynamic *,
    .shortcut *{
        animation:none !important;
        transition:none !important;
    }
}


/* FINAL UPDATE - Modern Mitra Kerjasama + Footer */
.partner-modern-section{
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%) !important;
    padding:58px 0 48px !important;
    margin-top:48px !important;
    border-bottom:6px solid var(--primary);
    position:relative;
    overflow:hidden;
}
.partner-modern-section:before{
    content:"";
    position:absolute;
    left:-120px;
    top:-130px;
    width:330px;
    height:330px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(13,92,228,.12),transparent 65%);
}
.partner-modern-head{
    text-align:center;
    max-width:720px;
    margin:0 auto 30px;
}
.partner-modern-head span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--button);
    font-size:13px;
    font-weight:800;
    letter-spacing:2px;
    text-transform:uppercase;
}
.partner-modern-head span:before,
.partner-modern-head span:after{
    content:"";
    width:38px;
    height:3px;
    border-radius:20px;
    background:var(--primary);
}
.partner-modern-head h3{
    margin:12px 0 10px;
    font-size:30px;
    color:var(--dark);
    line-height:1.25;
}
.partner-modern-head p{
    margin:0;
    color:#53627a;
    font-size:15px;
    line-height:1.7;
}
.partner-modern-row{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(155px,1fr));
    gap:18px;
    align-items:stretch;
}
.partner-modern-card{
    min-height:142px;
    background:#fff;
    border:1px solid rgba(13,92,228,.10);
    border-radius:22px;
    padding:18px 14px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    gap:12px;
    box-shadow:0 12px 35px rgba(8,31,74,.08);
    transition:transform .32s ease, box-shadow .32s ease, border-color .32s ease;
    animation:partnerFadeUp .7s ease both;
    animation-delay:var(--delay,0s);
}
.partner-modern-card:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 45px rgba(13,92,228,.16);
    border-color:rgba(13,92,228,.28);
}
.partner-logo-wrap{
    width:92px;
    height:58px;
    border-radius:16px;
    background:linear-gradient(180deg,#fff,#f3f7ff);
    border:1px solid #edf2fb;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:8px;
}
.partner-logo-wrap img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
}
.partner-modern-card strong{
    color:#0b1f3f;
    font-size:13px;
    line-height:1.35;
    font-weight:800;
}
.partner-empty{
    grid-column:1/-1;
    text-align:center;
    padding:26px;
    background:#fff;
    border-radius:18px;
    color:#64748b;
}
.footer-modern{
    background:
        radial-gradient(circle at 12% 20%,rgba(255,255,255,.16),transparent 28%),
        linear-gradient(135deg,#0d6ff2 0%,#0752d7 52%,#063c9f 100%) !important;
    color:#fff !important;
    position:relative;
    overflow:hidden;
    padding:62px 0 0 !important;
}
.footer-modern:before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px),
        linear-gradient(0deg,rgba(255,255,255,.06) 1px,transparent 1px);
    background-size:52px 52px;
    opacity:.26;
}
.footer-glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
}
.footer-glow-1{
    width:420px;
    height:420px;
    right:-120px;
    top:-140px;
    border:1px solid rgba(255,255,255,.18);
    box-shadow:0 0 0 42px rgba(255,255,255,.05),0 0 0 84px rgba(255,255,255,.03);
}
.footer-glow-2{
    width:260px;
    height:260px;
    left:-80px;
    bottom:-120px;
    background:rgba(255,223,0,.10);
    filter:blur(2px);
}
.footer-modern .container{
    position:relative;
    z-index:1;
}
.footer-modern-grid{
    display:grid;
    grid-template-columns:1.6fr .8fr .95fr 1.25fr;
    gap:34px;
    padding-bottom:34px;
}
.footer-logo-v40{
    display:flex;
    gap:14px;
    align-items:center;
    margin-bottom:17px;
}
.footer-logo-v40 img{
    width:60px;
    height:60px;
    object-fit:contain;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.20);
    border-radius:18px;
    padding:7px;
}
.footer-logo-v40 strong{
    display:block;
    color:#fff;
    font-size:15px;
    line-height:1.25;
}
.footer-logo-v40 small{
    display:block;
    color:rgba(255,255,255,.78);
    font-weight:600;
    margin-top:4px;
    font-size:12px;
}
.footer-about p,
.footer-contact p{
    color:rgba(255,255,255,.88) !important;
    line-height:1.65;
    margin:0;
}
.footer-modern h4{
    color:#fff !important;
    font-size:18px;
    margin:4px 0 18px;
    position:relative;
    padding-bottom:12px;
}
.footer-modern h4:after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:42px;
    height:3px;
    border-radius:99px;
    background:var(--primary);
}
.footer-col ul{
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    gap:10px;
}
.footer-col li,
.footer-col a{
    color:rgba(255,255,255,.90) !important;
    font-weight:600;
    line-height:1.35;
}
.footer-col a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    transition:.25s ease;
}
.footer-col a:before{
    content:"›";
    color:var(--primary);
    font-weight:900;
    font-size:18px;
    line-height:1;
}
.footer-col a:hover{
    color:#fff !important;
    transform:translateX(6px);
}
.contact-item{
    display:flex;
    gap:11px;
    align-items:flex-start;
    margin-bottom:12px;
}
.contact-item span{
    width:34px;
    height:34px;
    border-radius:12px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.16);
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 34px;
}
.footer-modern-bottom{
    border-top:1px solid rgba(255,255,255,.22);
    padding:17px 0 19px;
    text-align:center;
    color:rgba(255,255,255,.90);
    font-weight:600;
    font-size:13px;
}
@keyframes partnerFadeUp{
    from{opacity:0;transform:translateY(18px)}
    to{opacity:1;transform:translateY(0)}
}
@media(max-width:900px){
    .partner-modern-head h3{font-size:24px;}
    .footer-modern-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:600px){
    .partner-modern-row{grid-template-columns:repeat(2,1fr);}
    .partner-modern-card{min-height:132px;}
    .footer-modern-grid{grid-template-columns:1fr;}
}


/* FINAL FIX - Mitra Kerjasama berjalan bergantian tanpa kotak */
.mitra-marquee-section{
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%) !important;
    padding:56px 0 44px !important;
    margin-top:46px !important;
    border-bottom:6px solid var(--primary);
    overflow:hidden !important;
    position:relative;
}
.mitra-marquee-section:before{
    content:"";
    position:absolute;
    inset:auto auto -120px -140px;
    width:330px;
    height:330px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(13,92,228,.10),transparent 68%);
    pointer-events:none;
}
.mitra-marquee-head{
    text-align:center;
    max-width:760px;
    margin:0 auto 28px !important;
}
.mitra-marquee-wrap{
    width:100%;
    overflow:hidden;
    position:relative;
    padding:18px 0;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
}
.mitra-marquee-wrap:hover .mitra-marquee-track{
    animation-play-state:paused;
}
.mitra-marquee-track{
    display:flex;
    align-items:center;
    gap:54px;
    width:max-content;
    animation:mitraMarquee 34s linear infinite;
}
.mitra-marquee-item{
    min-width:145px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:12px;
    text-align:center;
    color:#0b1f3f;
    text-decoration:none;
    transform:translateY(0);
    transition:transform .28s ease, filter .28s ease;
}
.mitra-marquee-item:hover{
    transform:translateY(-6px);
    filter:drop-shadow(0 12px 18px rgba(13,92,228,.16));
}
.mitra-marquee-item img{
    width:96px;
    height:58px;
    object-fit:contain;
    display:block;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:0 !important;
}
.mitra-marquee-item span{
    max-width:150px;
    min-height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    line-height:1.25;
    font-weight:800;
    color:#0b1f3f;
}
@keyframes mitraMarquee{
    from{transform:translateX(0);}
    to{transform:translateX(-50%);}
}
@media(max-width:768px){
    .mitra-marquee-section{padding:42px 0 34px !important;}
    .mitra-marquee-track{gap:36px;animation-duration:24s;}
    .mitra-marquee-item{min-width:118px;}
    .mitra-marquee-item img{width:78px;height:48px;}
    .mitra-marquee-item span{font-size:12px;max-width:125px;}
}
@media(prefers-reduced-motion:reduce){
    .mitra-marquee-track{animation:none;}
}

/* Animasi angka statistik beranda */
.js-counter{
    display:inline-block;
    min-width:110px;
    transition:transform .25s ease, text-shadow .25s ease;
}
.js-counter.counter-running{
    animation:counterPulse .9s ease-in-out infinite alternate;
}
.js-counter.counter-done{
    animation:counterPop .55s ease both;
}
@keyframes counterPulse{
    from{transform:translateY(0) scale(1); text-shadow:0 0 0 rgba(255,255,255,0);}
    to{transform:translateY(-2px) scale(1.035); text-shadow:0 10px 24px rgba(255,255,255,.28);}
}
@keyframes counterPop{
    0%{transform:scale(.96);}
    55%{transform:scale(1.08);}
    100%{transform:scale(1);}
}


/* Profil visual: struktur organisasi dan logo FEB */
.visual-profile-section{
    position:relative;
    overflow:hidden;
}
.visual-profile-section::before{
    content:"";
    position:absolute;
    width:180px;
    height:180px;
    right:-60px;
    top:-70px;
    background:radial-gradient(circle, rgba(13,92,228,.12), transparent 70%);
    pointer-events:none;
}
.profil-visual-image{
    margin:20px 0 18px;
    background:linear-gradient(135deg,#f8fbff,#ffffff);
    border:1px solid rgba(13,92,228,.12);
    border-radius:24px;
    padding:18px;
    box-shadow:0 18px 45px rgba(15,39,87,.08);
    text-align:center;
}
.profil-visual-image img{
    max-width:100%;
    max-height:620px;
    object-fit:contain;
    border-radius:16px;
    animation:profileVisualFade .8s ease both;
}
.profil-visual-text{
    color:#243b64;
    line-height:1.8;
    font-size:15px;
}
@keyframes profileVisualFade{
    from{opacity:0;transform:translateY(16px) scale(.98)}
    to{opacity:1;transform:translateY(0) scale(1)}
}
/* ===== FIX KONTAK FAKULTAS + GOOGLE MAPS ===== */
.kontak-modern{
    max-width:1180px;
    margin:35px auto 50px;
    padding:0 18px;
}

.kontak-card-modern{
    display:grid;
    grid-template-columns:360px 1fr;
    gap:24px;
    background:#fff;
    border-radius:24px;
    padding:24px;
    box-shadow:0 18px 45px rgba(10,32,64,.08);
    border:1px solid #eef2f7;
}

.kontak-info-modern{
    background:linear-gradient(135deg,#0d5ce4,#073b8f);
    color:#fff;
    border-radius:20px;
    padding:28px;
}

.kontak-info-modern h2{
    margin:0 0 22px;
    color:#fff;
    font-size:26px;
    font-weight:800;
}

.kontak-item{
    display:flex;
    gap:14px;
    margin-bottom:18px;
    line-height:1.6;
    font-size:15px;
}

.kontak-item i{
    width:38px;
    height:38px;
    border-radius:12px;
    background:rgba(255,255,255,.16);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#ffd400;
    flex:none;
}

.kontak-map-modern{
    border-radius:20px;
    overflow:hidden;
    min-height:430px;
    box-shadow:0 10px 28px rgba(10,32,64,.10);
}

.kontak-map-modern iframe{
    width:100%;
    height:100%;
    min-height:430px;
    border:0;
    display:block;
}

.btn-open-map{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-top:18px;
    background:#ffd400;
    color:#08285d !important;
    padding:12px 18px;
    border-radius:999px;
    font-weight:800;
    text-decoration:none;
}

@media(max-width:900px){
    .kontak-card-modern{
        grid-template-columns:1fr;
        padding:18px;
    }

    .kontak-map-modern,
    .kontak-map-modern iframe{
        min-height:360px;
    }
}
/* =========================================================
   FEB UNISAN RESPONSIVE FINAL FIX - 80% DESKTOP FEEL
   Tujuan: menu tidak terpotong di zoom browser 100%, namun
   tampilan tetap terasa ringkas seperti 80%, dan aman mobile.
   ========================================================= */
html, body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
}
body{
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
}
img, iframe, video{
    max-width:100%;
}
.container{
    width:min(1280px, calc(100% - 32px)) !important;
    max-width:1280px !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

/* Top bar dibuat fleksibel agar search, sosial media, dan bahasa tidak memotong layar */
.topbar-modern{
    overflow:visible !important;
}
.top-modern-flex{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:18px !important;
    flex-wrap:nowrap !important;
}
.pmb-link{
    flex:0 1 auto !important;
    white-space:nowrap !important;
    font-size:clamp(13px, .95vw, 16px) !important;
}
.top-search{
    flex:1 1 340px !important;
    max-width:420px !important;
    min-width:180px !important;
}
.top-search input{
    width:100% !important;
    min-width:0 !important;
}
.top-social{
    flex:0 0 auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:9px !important;
    flex-wrap:nowrap !important;
}
.top-social .soc{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    font-size:13px !important;
}
.top-social img{
    max-height:34px !important;
    width:auto !important;
}
.feb-lang-btn{
    min-height:36px !important;
    padding:8px 12px !important;
    white-space:nowrap !important;
}

/* Navbar desktop: lebih ringkas dan tidak terpotong */
.navbar{
    padding:14px 0 !important;
    overflow:visible !important;
}
.nav-flex{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:18px !important;
    flex-wrap:nowrap !important;
    min-width:0 !important;
}
.brand{
    flex:0 1 390px !important;
    min-width:245px !important;
    gap:12px !important;
    overflow:hidden !important;
}
.brand img{
    width:58px !important;
    height:58px !important;
    flex:0 0 58px !important;
}
.brand-text{
    min-width:0 !important;
    display:block !important;
    line-height:1.25 !important;
}
.brand-text strong,
.brand-text small{
    display:block !important;
    white-space:normal !important;
}
.brand-text strong{
    font-size:clamp(12px, .95vw, 14px) !important;
    line-height:1.2 !important;
}
.brand-text small{
    font-size:clamp(10px, .8vw, 12px) !important;
    line-height:1.2 !important;
}
.menu,
.menu-mega{
    flex:1 1 auto !important;
    min-width:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:clamp(10px, 1.15vw, 18px) !important;
    white-space:nowrap !important;
}
.menu li{
    flex:0 0 auto !important;
}
.menu a,
.menu-mega a{
    font-size:clamp(11px, .86vw, 13px) !important;
    line-height:1.2 !important;
    padding:10px 0 !important;
}
.menu-mega .chevron{
    font-size:11px !important;
    margin-left:2px !important;
}
.mobile-btn{
    display:none !important;
}

/* Hero desktop dibuat proporsional seperti zoom 80%, tanpa memaksa zoom browser */
.hero-slider{
    min-height:auto !important;
    overflow:hidden !important;
}
.slide{
    padding:46px 0 72px !important;
}
.hero-flex{
    display:flex !important;
    align-items:center !important;
    gap:34px !important;
}
.hero-slider .hero-text,
.hero-text{
    width:auto !important;
    flex:0 1 43% !important;
    max-width:520px !important;
    padding-right:0 !important;
}
.hero-slider .hero-img,
.hero-img{
    width:auto !important;
    flex:1 1 57% !important;
    min-width:0 !important;
}
.hero-slider .hero-text h1,
.hero-text h1{
    font-size:clamp(34px, 3.25vw, 52px) !important;
    line-height:1.12 !important;
    margin-bottom:18px !important;
}
.hero-slider .hero-text p,
.hero-text p{
    font-size:clamp(14px, 1vw, 17px) !important;
    line-height:1.7 !important;
}
.hero-img img{
    height:clamp(300px, 31vw, 430px) !important;
    width:100% !important;
    object-fit:cover !important;
}
.btn{
    padding:12px 22px !important;
    font-size:14px !important;
}

/* Layout umum agar tidak memaksa horizontal scroll */
.shortcut,
.grid-two,
.prodi-grid,
.content-grid,
.testi-grid,
.footer-grid,
.news-grid,
.gallery-page{
    max-width:100% !important;
}
.content-grid{
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
}
.prodi-grid,
.news-grid,
.gallery-page,
.testi-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
}
.shortcut{
    grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
}
.shortcut a{
    min-width:0 !important;
    padding:20px 16px !important;
}

/* Tablet landscape: gunakan hamburger supaya menu tidak kepotong */
@media(max-width:1180px){
    .container{
        width:min(100% - 28px, 1040px) !important;
    }
    .top-modern-flex{
        flex-wrap:wrap !important;
    }
    .pmb-link{
        order:1 !important;
    }
    .top-search{
        order:2 !important;
        flex:1 1 320px !important;
        max-width:none !important;
    }
    .top-social{
        order:3 !important;
    }
    .nav-flex{
        position:relative !important;
        flex-wrap:wrap !important;
    }
    .brand{
        flex:1 1 auto !important;
        max-width:calc(100% - 62px) !important;
    }
    .mobile-btn{
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        width:44px !important;
        height:44px !important;
        margin:0 !important;
        float:none !important;
        border:0 !important;
        border-radius:12px !important;
        background:#0d5ce4 !important;
        color:#fff !important;
        font-size:24px !important;
        cursor:pointer !important;
    }
    .menu,
    .menu-mega{
        display:none !important;
        flex:0 0 100% !important;
        width:100% !important;
        white-space:normal !important;
        margin-top:14px !important;
        padding:12px !important;
        background:#fff !important;
        border-radius:18px !important;
        box-shadow:0 18px 45px rgba(10,32,64,.10) !important;
        gap:0 !important;
        align-items:stretch !important;
        justify-content:flex-start !important;
    }
    .menu.show,
    .menu-mega.show{
        display:flex !important;
        flex-direction:column !important;
    }
    .menu li{
        width:100% !important;
    }
    .menu a,
    .menu-mega a{
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        width:100% !important;
        padding:13px 12px !important;
        border-radius:12px !important;
        font-size:14px !important;
    }
    .menu a:hover{
        background:#f3f7ff !important;
    }
    .menu a:after{
        display:none !important;
    }
    .has-mega .mega-menu,
    .has-small-dropdown .dropdown-menu{
        position:static !important;
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
        transform:none !important;
        opacity:1 !important;
        visibility:visible !important;
        display:none !important;
        margin:4px 0 10px !important;
        box-shadow:none !important;
        border:1px solid #eef2f7 !important;
        border-radius:14px !important;
    }
    .has-mega:hover .mega-menu,
    .has-mega:focus-within .mega-menu,
    .has-small-dropdown:hover .dropdown-menu,
    .has-small-dropdown:focus-within .dropdown-menu{
        display:block !important;
    }
    .mega-profile{
        grid-template-columns:1fr !important;
    }
    .hero-flex{
        gap:26px !important;
    }
    .hero-slider .hero-text,
    .hero-text{
        flex-basis:46% !important;
    }
    .hero-slider .hero-text h1,
    .hero-text h1{
        font-size:clamp(30px, 4vw, 42px) !important;
    }
    .content-grid{
        grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    }
    .shortcut{
        grid-template-columns:repeat(3, minmax(0,1fr)) !important;
    }
}

/* Tablet portrait */
@media(max-width:900px){
    .container{
        width:calc(100% - 24px) !important;
    }
    .top-modern-flex{
        flex-direction:column !important;
        align-items:stretch !important;
        gap:12px !important;
    }
    .pmb-link{
        white-space:normal !important;
        text-align:center !important;
    }
    .top-search{
        flex:0 0 auto !important;
        width:100% !important;
    }
    .top-social{
        justify-content:center !important;
        flex-wrap:wrap !important;
    }
    .hero-flex{
        display:flex !important;
        flex-direction:column !important;
        align-items:stretch !important;
        gap:28px !important;
    }
    .hero-slider .hero-text,
    .hero-text,
    .hero-slider .hero-img,
    .hero-img{
        width:100% !important;
        max-width:100% !important;
        flex:0 0 auto !important;
    }
    .hero-slider .hero-text h1,
    .hero-text h1{
        font-size:clamp(30px, 8vw, 42px) !important;
    }
    .hero-img img{
        height:360px !important;
    }
    .slide{
        padding:38px 0 58px !important;
    }
    .slide-btn{
        width:38px !important;
        height:38px !important;
        font-size:28px !important;
    }
    .prev{left:10px !important;}
    .next{right:10px !important;}
    .grid-two,
    .content-grid,
    .prodi-grid,
    .news-grid,
    .gallery-page,
    .testi-grid,
    .footer-grid{
        grid-template-columns:1fr !important;
    }
    .shortcut{
        grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    }
}

/* Mobile */
@media(max-width:600px){
    .container{
        width:calc(100% - 18px) !important;
    }
    .navbar{
        padding:10px 0 !important;
    }
    .brand{
        min-width:0 !important;
        max-width:calc(100% - 56px) !important;
        gap:9px !important;
    }
    .brand img{
        width:48px !important;
        height:48px !important;
        flex-basis:48px !important;
    }
    .brand-text strong{
        font-size:12px !important;
    }
    .brand-text small{
        font-size:10px !important;
    }
    .mobile-btn{
        width:40px !important;
        height:40px !important;
        font-size:22px !important;
    }
    .menu,
    .menu-mega{
        padding:8px !important;
    }
    .menu a,
    .menu-mega a{
        font-size:13px !important;
        padding:12px 10px !important;
    }
    .topbar-modern{
        padding:12px 0 !important;
    }
    .feb-lang-wrap,
    .feb-lang-btn{
        max-width:100% !important;
    }
    .hero-slider .hero-text h1,
    .hero-text h1{
        font-size:clamp(28px, 9vw, 36px) !important;
    }
    .hero-slider .hero-text p,
    .hero-text p{
        font-size:14px !important;
    }
    .hero-img img{
        height:260px !important;
        border-radius:18px !important;
    }
    .btn{
        display:block !important;
        width:100% !important;
        margin:10px 0 0 !important;
        text-align:center !important;
    }
    .shortcut{
        grid-template-columns:1fr !important;
    }
    .floating-card,
    .statistik-blue-card{
        margin-top:18px !important;
    }
    .tanya-kami,
    .chat-widget,
    .floating-whatsapp,
    #tanyaKami{
        max-width:calc(100% - 24px) !important;
        right:12px !important;
        bottom:12px !important;
    }
}

/* =========================================================
   UPDATE MODERN HOME SECTION - Statistik, Prestasi, Layanan
   Dibuat untuk tampilan desktop 100% yang terasa ringkas seperti 80%
   dan mobile yang lebih fresh, pendek, serta mudah dibaca.
   ========================================================= */
.home-modern-section{
    position:relative;
    z-index:3;
    margin-top:-58px;
    padding:0 0 28px;
}
.home-modern-section .container{
    width:min(1180px,94%);
    max-width:1180px;
}
.modern-stats-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    overflow:hidden;
    background:rgba(255,255,255,.96);
    border:1px solid rgba(15,45,90,.08);
    border-radius:20px;
    box-shadow:0 18px 50px rgba(15,45,90,.12);
    backdrop-filter:blur(14px);
}
.modern-stat-card{
    display:flex;
    align-items:center;
    gap:18px;
    min-height:118px;
    padding:24px 32px;
    border-right:1px solid rgba(15,45,90,.08);
}
.modern-stat-card:last-child{border-right:0}
.modern-stat-icon{
    width:64px;
    height:64px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:27px;
    flex:none;
    box-shadow:0 12px 25px rgba(0,0,0,.09);
}
.stat-mahasiswa .modern-stat-icon{background:#eaf3ff;color:#1268e5}
.stat-prestasi .modern-stat-icon{background:#fff6d8;color:#d9a500}
.stat-alumni .modern-stat-icon{background:#e8fbef;color:#13a85c}
.modern-stat-number{
    font-size:36px;
    line-height:1;
    font-weight:900;
    letter-spacing:-1px;
    color:#071f46;
}
.modern-stat-label{
    margin-top:8px;
    font-weight:800;
    color:#071f46;
}
.modern-stat-card small{
    display:block;
    margin-top:4px;
    color:#6f7b90;
    font-size:12px;
}
.modern-home-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    margin-top:24px;
}
.modern-panel{
    background:rgba(255,255,255,.97);
    border:1px solid rgba(15,45,90,.08);
    border-radius:20px;
    padding:22px;
    box-shadow:0 14px 38px rgba(15,45,90,.09);
}
.modern-panel-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-bottom:16px;
}
.modern-panel-head h3{
    margin:0;
    color:#071f46;
    font-size:20px;
}
.modern-panel-head a{
    color:#1268e5;
    font-size:13px;
    font-weight:800;
}
.modern-prestasi-list{
    display:grid;
    gap:12px;
}
.modern-prestasi-item{
    display:flex;
    align-items:center;
    gap:14px;
    padding:10px;
    border-radius:15px;
    border:1px solid rgba(15,45,90,.08);
    background:linear-gradient(180deg,#fff,#f7fbff);
    transition:.25s ease;
}
.modern-prestasi-item:hover{
    transform:translateY(-3px);
    box-shadow:0 12px 26px rgba(15,45,90,.1);
}
.modern-prestasi-photo{
    width:76px;
    height:58px;
    border-radius:12px;
    overflow:hidden;
    flex:none;
    background:#eaf3ff;
    display:flex;
    align-items:center;
    justify-content:center;
}
.modern-prestasi-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.modern-prestasi-item b{
    display:block;
    color:#071f46;
    font-size:14px;
    line-height:1.35;
}
.modern-prestasi-item small{
    display:block;
    margin-top:6px;
    color:#6f7b90;
    font-size:12px;
}
.modern-empty{
    padding:16px;
    border-radius:14px;
    background:#f7fbff;
    color:#6f7b90;
}
.modern-shortcut-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
}
.modern-shortcut-grid a{
    min-height:116px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    gap:10px;
    padding:16px 12px;
    border-radius:17px;
    border:1px solid rgba(15,45,90,.08);
    background:linear-gradient(180deg,#fff,#f8fbff);
    color:#071f46;
    transition:.25s ease;
}
.modern-shortcut-grid a:hover{
    transform:translateY(-4px);
    box-shadow:0 14px 28px rgba(15,45,90,.12);
    border-color:rgba(18,104,229,.22);
}
.modern-shortcut-grid span{
    width:42px;
    height:42px;
    border-radius:13px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:23px;
    background:#eef5ff;
}
.modern-shortcut-grid b{
    font-size:13px;
    line-height:1.25;
}

/* Sembunyikan desain shortcut lama bila masih ter-load dari cache/halaman lain */
.shortcut:not(.keep-old-shortcut){display:none !important}

@media(max-width:980px){
    .home-modern-section{margin-top:24px;padding-bottom:22px}
    .modern-stats-grid{grid-template-columns:repeat(2,1fr);border-radius:18px}
    .modern-stat-card{padding:20px;min-height:108px}
    .modern-stat-card:nth-child(2){border-right:0}
    .modern-stat-card:nth-child(3){grid-column:1/3;border-top:1px solid rgba(15,45,90,.08);justify-content:center;text-align:left}
    .modern-home-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
    .home-modern-section{margin-top:18px}
    .modern-stats-grid{
        grid-template-columns:repeat(2,1fr);
        gap:10px;
        background:transparent;
        border:0;
        box-shadow:none;
        overflow:visible;
    }
    .modern-stat-card{
        display:block;
        min-height:98px;
        padding:16px 12px;
        border:1px solid rgba(15,45,90,.08) !important;
        border-radius:16px;
        background:rgba(255,255,255,.98);
        box-shadow:0 10px 26px rgba(15,45,90,.09);
        text-align:center;
    }
    .modern-stat-card:nth-child(3){grid-column:1/3}
    .modern-stat-icon{
        width:38px;
        height:38px;
        margin:0 auto 10px;
        font-size:20px;
        box-shadow:none;
    }
    .modern-stat-number{font-size:27px}
    .modern-stat-label{font-size:12px;margin-top:6px}
    .modern-stat-card small{display:none}
    .modern-panel{
        border-radius:18px;
        padding:16px;
    }
    .modern-panel-head h3{font-size:17px}
    .modern-prestasi-photo{width:70px;height:54px}
    .modern-prestasi-item{align-items:flex-start}
    .modern-prestasi-item b{font-size:12.5px}
    .modern-shortcut-grid{grid-template-columns:repeat(3,1fr);gap:10px}
    .modern-shortcut-grid a{
        min-height:92px;
        padding:12px 6px;
        border-radius:15px;
    }
    .modern-shortcut-grid span{width:36px;height:36px;font-size:20px;border-radius:12px}
    .modern-shortcut-grid b{font-size:11px}
}
@media(max-width:390px){
    .modern-shortcut-grid{grid-template-columns:repeat(2,1fr)}
}


/* =========================================================
   UPDATE FINAL HERO CLEAN MODERN
   - Menghilangkan efek kotak putih pada area gambar hero
   - Mengurangi jarak atas/bawah hero
   - Membuat gambar menyatu dengan background
   - Statistik dibuat menempel halus di bawah hero
   ========================================================= */
.hero-slider{
    min-height:560px !important;
    padding:0 !important;
    background:
        radial-gradient(circle at 12% 18%, rgba(255,255,255,.98) 0, rgba(255,255,255,.72) 22%, rgba(255,255,255,0) 44%),
        linear-gradient(100deg,#ffffff 0%,#f7fbff 42%,#eaf6ff 100%) !important;
    overflow:hidden !important;
}
.hero-slider .slide{
    padding:44px 0 86px !important;
}
.hero-slider .hero-flex{
    width:min(1180px,94%) !important;
    min-height:430px !important;
    display:grid !important;
    grid-template-columns:.92fr 1.08fr !important;
    align-items:center !important;
    gap:26px !important;
    margin:0 auto !important;
}
.hero-slider .container.hero-flex{
    max-width:1180px !important;
}
.hero-slider .hero-text{
    width:auto !important;
    padding:0 !important;
    position:relative !important;
    z-index:3 !important;
}
.hero-slider .hero-text h1{
    font-size:clamp(36px,4.2vw,60px) !important;
    line-height:1.08 !important;
    letter-spacing:-1.5px !important;
    margin:0 0 18px !important;
    color:#06285b !important;
    font-weight:900 !important;
}
.hero-slider .hero-text h1 span,
.hero-slider .hero-text h1 strong{
    color:#0d5ce4 !important;
}
.hero-slider .hero-text p{
    max-width:520px !important;
    margin:0 0 24px !important;
    color:#344767 !important;
    font-size:16px !important;
    line-height:1.75 !important;
}
.hero-slider .btn{
    border-radius:999px !important;
    padding:13px 24px !important;
    box-shadow:none !important;
}
.hero-slider .btn.dark{
    background:linear-gradient(135deg,#0d5ce4,#0648a8) !important;
    color:#fff !important;
}
.hero-slider .btn.light{
    background:#fff !important;
    color:#0d5ce4 !important;
    border:2px solid #0d5ce4 !important;
}
.hero-slider .hero-img{
    width:auto !important;
    height:430px !important;
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    overflow:visible !important;
}
.hero-slider .hero-img:before,
.hero-slider .hero-img:after{
    display:none !important;
    content:none !important;
}
.hero-slider .hero-img img{
    width:100% !important;
    height:100% !important;
    max-width:700px !important;
    object-fit:cover !important;
    object-position:center !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:transparent !important;
    animation:none !important;
    display:block !important;
    -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
    mask-image:linear-gradient(90deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
}
.hero-slider .slide-btn{
    z-index:5 !important;
    background:#fff !important;
    color:#0d5ce4 !important;
    box-shadow:0 10px 30px rgba(15,45,90,.14) !important;
}
.home-modern-section{
    margin-top:-72px !important;
    position:relative !important;
    z-index:6 !important;
}
.modern-stats-grid{
    border-radius:20px !important;
    box-shadow:0 18px 45px rgba(15,45,90,.12) !important;
}
@media(max-width:980px){
    .hero-slider{min-height:auto !important;}
    .hero-slider .slide{padding:36px 0 44px !important;}
    .hero-slider .hero-flex{
        display:block !important;
        min-height:auto !important;
    }
    .hero-slider .hero-text{text-align:left !important;}
    .hero-slider .hero-img{
        height:auto !important;
        margin-top:24px !important;
    }
    .hero-slider .hero-img img{
        height:auto !important;
        max-height:360px !important;
        -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
        mask-image:linear-gradient(180deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
    }
    .home-modern-section{margin-top:20px !important;}
}
@media(max-width:640px){
    .hero-slider .hero-text h1{font-size:34px !important;}
    .hero-slider .hero-text p{font-size:14px !important;}
    .hero-slider .btn{display:block !important;text-align:center !important;margin:0 0 10px !important;}
}


/* UPDATE V31 - Halaman Program Studi Modern seperti referensi */
.prodi-stat-hero-v31{
    background:#f8fbff;
    padding:34px 0 22px;
}

.prodi-stat-grid-v31{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:22px;
}

.prodi-stat-card-v31{
    background:#fff;
    border:1px solid #edf2f8;
    border-radius:18px;
    padding:26px 28px;
    display:flex;
    align-items:center;
    gap:20px;
    box-shadow:0 12px 32px rgba(20,52,96,.08);
}

.prodi-stat-card-v31.dosen-border{
    border:1.5px solid #3b82f6;
}

.stat-icon-v31{
    width:70px;
    height:70px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    flex:none;
}

.stat-icon-v31.blue{background:#e8f1ff;color:#0d5ce4}
.stat-icon-v31.yellow{background:#fff2c4;color:#d99500}
.stat-icon-v31.green{background:#dff8e8;color:#198754}
.stat-icon-v31.purple{background:#eee5ff;color:#6d28d9}

.prodi-stat-card-v31 h2{
    margin:0;
    color:#08285d;
    font-size:38px;
    line-height:1;
    font-weight:900;
}

.prodi-stat-card-v31 h3{
    margin:8px 0 5px;
    color:#08285d;
    font-size:18px;
    font-weight:900;
}

.prodi-stat-card-v31 p{
    margin:0;
    color:#5c6a80;
    font-size:13px;
}

.prodi-modern-wrap-v31{
    margin:28px auto 70px;
}

.prodi-layout-v31{
    display:grid;
    grid-template-columns:1fr 420px;
    gap:24px;
    margin-bottom:38px;
}

.prodi-main-v31,
.dosen-stat-v31,
.dosen-list-v31{
    background:#fff;
    border:1px solid #e8eef7;
    border-radius:18px;
    box-shadow:0 12px 32px rgba(20,52,96,.08);
}

.prodi-main-v31{
    padding:26px;
}

.breadcrumb-v31{
    display:flex;
    gap:9px;
    align-items:center;
    margin-bottom:24px;
    color:#5c6a80;
    font-size:14px;
}

.breadcrumb-v31 a{
    color:#0d5ce4;
    font-weight:700;
}

.prodi-title-v31{
    display:flex;
    gap:22px;
    align-items:center;
    margin-bottom:24px;
}

.prodi-icon-v31{
    width:88px;
    height:88px;
    border-radius:16px;
    background:#ffd400;
    color:#08285d;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:44px;
    flex:none;
}

.prodi-icon-v31 img{
    width:58px;
    height:58px;
    object-fit:contain;
}

.prodi-title-v31 h1{
    margin:0 0 8px;
    color:#08285d;
    font-size:33px;
    font-weight:900;
}

.prodi-title-v31 h4{
    margin:0;
    color:#0d5ce4;
    line-height:1.45;
    font-size:17px;
}

.prodi-tabs-v31{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    border:1px solid #dfe8f5;
    border-radius:12px;
    overflow:hidden;
    margin:10px 0 28px;
}

.prodi-tabs-v31 button{
    border:0;
    background:#f8fbff;
    color:#68758a;
    padding:15px;
    font-weight:900;
    font-size:14px;
}

.prodi-tabs-v31 button.active{
    background:#0d5ce4;
    color:#fff;
}

.prodi-text-v31 h3,
.prodi-two-v31 h3,
.prospek-v31 h3{
    color:#08285d;
    font-size:20px;
    font-weight:900;
    margin:0 0 12px;
}

.prodi-text-v31 p,
.prodi-two-v31 p,
.prodi-two-v31 li{
    color:#344154;
    line-height:1.75;
    font-size:15px;
}

.prodi-mini-v31{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    margin:24px 0;
}

.prodi-mini-v31>div{
    border:1px solid #e1eaf5;
    border-radius:14px;
    padding:18px;
    display:grid;
    grid-template-columns:48px 1fr;
    column-gap:12px;
    align-items:center;
}

.prodi-mini-v31 span{
    grid-row:1 / 4;
    width:48px;
    height:48px;
    border-radius:50%;
    background:#0d5ce4;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
}

.prodi-mini-v31 p{
    margin:0;
    color:#5c6a80;
    font-size:13px;
}

.prodi-mini-v31 h3{
    margin:3px 0;
    color:#08285d;
    font-size:21px;
}

.prodi-mini-v31 small{
    color:#5c6a80;
}

.prodi-two-v31{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}

.prodi-two-v31>div{
    border:1px solid #e8eef7;
    border-radius:16px;
    padding:20px;
    background:#fff;
}

.prodi-two-v31 ul{
    margin:0 0 18px;
    padding-left:18px;
}

.prodi-two-v31 li{
    margin-bottom:8px;
}

.prospek-v31{
    margin-top:20px;
    border:1px solid #e8eef7;
    border-radius:16px;
    padding:20px;
    background:#fff;
}

.prospek-tags-v31{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

.prospek-tags-v31 span{
    border:1px solid #dbe7f7;
    background:#f8fbff;
    color:#08285d;
    border-radius:12px;
    padding:12px 16px;
    font-weight:800;
    font-size:14px;
}

.dosen-stat-v31{
    overflow:hidden;
    margin-bottom:18px;
}

.dosen-stat-v31 h3{
    margin:0;
    padding:18px 22px;
    background:#ffd400;
    color:#08285d;
    font-size:19px;
    font-weight:900;
}

.dosen-stat-row-v31{
    display:flex;
    justify-content:space-between;
    gap:16px;
    padding:15px 22px;
    border-bottom:1px solid #e8eef7;
    color:#344154;
}

.dosen-stat-row-v31 b{
    color:#0d5ce4;
}

.dosen-stat-row-v31.total{
    background:#f8fbff;
    font-weight:900;
}

.dosen-list-v31{
    padding:20px;
}

.dosen-list-head-v31{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:14px;
    gap:12px;
}

.dosen-list-head-v31 h3{
    margin:0;
    color:#08285d;
    font-size:19px;
}

.dosen-list-head-v31 a{
    background:#0d5ce4;
    color:#fff;
    padding:10px 14px;
    border-radius:8px;
    font-size:12px;
    font-weight:900;
}

.dosen-item-v31{
    display:grid;
    grid-template-columns:58px 1fr 18px;
    gap:14px;
    align-items:center;
    padding:12px 0;
    border-bottom:1px solid #e8eef7;
}

.dosen-item-v31 img,
.dosen-avatar-v31{
    width:58px;
    height:58px;
    border-radius:12px;
    object-fit:cover;
    background:#eef5ff;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#0d5ce4;
    font-size:22px;
}

.dosen-item-v31 h4{
    margin:0 0 4px;
    color:#08285d;
    font-size:15px;
}

.dosen-item-v31 p{
    margin:0;
    color:#526175;
    font-size:13px;
}

.dosen-item-v31 small{
    color:#7b8798;
    font-size:12px;
}

.empty-dosen-v31{
    color:#7b8798;
    padding:16px;
    background:#f8fbff;
    border-radius:12px;
}

.modal-xl{
    max-width:1040px !important;
}

@media(max-width:1180px){
    .prodi-stat-grid-v31{
        grid-template-columns:repeat(2,1fr);
    }
    .prodi-layout-v31{
        grid-template-columns:1fr;
    }
    .prodi-side-v31{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:18px;
    }
}

@media(max-width:760px){
    .prodi-stat-grid-v31,
    .prodi-mini-v31,
    .prodi-two-v31,
    .prodi-side-v31{
        grid-template-columns:1fr;
    }
    .prodi-title-v31{
        align-items:flex-start;
    }
    .prodi-tabs-v31{
        grid-template-columns:1fr;
    }
    .prodi-stat-card-v31 h2{
        font-size:31px;
    }
}


@media(max-width:768px){
    .hero-slider,
    .hero-section,
    .hero-slide{
        padding-top:25px !important;
        padding-bottom:30px !important;
        min-height:auto !important;
    }

    .hero-flex,
    .hero-content-wrap{
        display:flex !important;
        flex-direction:column !important;
        gap:20px !important;
    }

    .hero-text{
        order:1 !important;
        width:100% !important;
        max-width:100% !important;
        padding:0 20px !important;
    }

    .hero-image,
    .hero-img{
        order:2 !important;
        width:100% !important;
        max-width:100% !important;
        margin:0 !important;
        padding:0 20px !important;
    }

    .hero-image img,
    .hero-img img{
        width:100% !important;
        height:auto !important;
        max-height:none !important;
        object-fit:contain !important;
        border-radius:0 !important;
    }

    .hero-text h1{
        font-size:30px !important;
        line-height:1.15 !important;
    }

    .hero-text p{
        font-size:14px !important;
    }
}

.home-two-column,
.prestasi-layanan-wrap,
.section-prestasi-layanan{
    width:100%;
    max-width:1500px;
    margin-left:auto;
    margin-right:auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
    padding-left:20px;
    padding-right:20px;
    box-sizing:border-box;
}

@media(max-width:900px){
    .home-two-column,
    .prestasi-layanan-wrap,
    .section-prestasi-layanan{
        grid-template-columns:1fr;
    }
}

/* =========================================================
   FIX UPDATE - Responsive Hero, Grid Prestasi/Layanan,
   dan tampilan zoom kecil
   ========================================================= */

:root{
    --fix-container: min(95vw, 1480px);
}

.container{
    width: var(--fix-container);
    max-width: 1480px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

.prodi-stat-hero-v31 .container,
.modern-home-grid,
.grid-two,
.content-grid,
.prodi-grid,
.promo-slider-wrap{
    width: var(--fix-container);
    max-width: 1480px;
    margin-left:auto;
    margin-right:auto;
    box-sizing:border-box;
}

.modern-home-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(420px, 1fr));
    gap:24px;
    align-items:stretch;
}

.modern-panel{
    min-width:0;
    box-sizing:border-box;
}

.prodi-stat-grid-v31{
    grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
}

.prodi-stat-card-v31{
    min-width:0;
}

.riset-simple-item{
    align-items:flex-start;
}

@media(max-width:768px){
    .hero-slider{
        min-height:auto !important;
        padding:24px 0 30px !important;
        overflow:hidden;
    }

    .hero-slider .slide{
        position:relative !important;
        min-height:auto !important;
        padding:0 !important;
    }

    .hero-flex{
        display:flex !important;
        flex-direction:column !important;
        align-items:stretch !important;
        justify-content:flex-start !important;
        gap:18px !important;
        width:94% !important;
    }

    .hero-text{
        order:1 !important;
        width:100% !important;
        max-width:100% !important;
        padding:0 !important;
        text-align:left !important;
        position:relative !important;
        z-index:3 !important;
    }

    .hero-text h1{
        font-size:30px !important;
        line-height:1.13 !important;
        margin-bottom:14px !important;
    }

    .hero-text p{
        font-size:14px !important;
        line-height:1.65 !important;
        margin-bottom:18px !important;
    }

    .hero-text .btn{
        padding:11px 16px !important;
        margin:4px 5px 4px 0 !important;
        font-size:12px !important;
    }

    .hero-img{
        order:2 !important;
        width:100% !important;
        max-width:100% !important;
        margin:0 !important;
        padding:0 !important;
        position:relative !important;
        z-index:2 !important;
    }

    .hero-img img{
        width:100% !important;
        height:auto !important;
        max-height:none !important;
        object-fit:contain !important;
        border-radius:0 !important;
        box-shadow:none !important;
        display:block !important;
        animation:none !important;
    }

    .slide-btn{
        top:58% !important;
        width:40px !important;
        height:40px !important;
        font-size:26px !important;
        z-index:5 !important;
    }

    .prev{left:14px !important;}
    .next{right:14px !important;}

    .prodi-stat-hero-v31{
        padding:18px 0 !important;
    }

    .prodi-stat-grid-v31{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
        gap:12px !important;
        width:94% !important;
    }

    .prodi-stat-card-v31{
        padding:16px !important;
        gap:12px !important;
        border-radius:14px !important;
    }

    .stat-icon-v31{
        width:48px !important;
        height:48px !important;
        font-size:21px !important;
    }

    .prodi-stat-card-v31 h2{
        font-size:26px !important;
    }

    .prodi-stat-card-v31 h3{
        font-size:13px !important;
        margin:5px 0 3px !important;
    }

    .prodi-stat-card-v31 p{
        font-size:10.5px !important;
    }

    .modern-home-grid{
        width:94% !important;
        grid-template-columns:1fr !important;
        gap:16px !important;
        margin-top:16px !important;
    }

    .modern-shortcut-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    }
}

@media(max-width:480px){
    .prodi-stat-grid-v31{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    }

    .modern-shortcut-grid{
        grid-template-columns:1fr !important;
    }
}