:root{--green:#075d32;--green2:#0a7a41;--gold:#d6a800;--bg:#f6f8f7;--text:#17211b}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff}a{color:inherit;text-decoration:none}.wrap{max-width:1280px;margin:auto;padding:28px}
.topbar{background:var(--green);color:#fff;padding:8px 5%;display:flex;justify-content:space-between;font-size:13px}.site-header{height:92px;padding:10px 5%;display:flex;align-items:center;justify-content:space-between;background:#fff;position:sticky;top:0;z-index:20;box-shadow:0 2px 8px #0001}.site-brand{display:flex;align-items:center;gap:12px}.site-brand img{width:72px;height:72px;object-fit:contain}.site-brand b{display:block;font-size:20px}.site-brand small{color:var(--green)}nav{display:flex;gap:24px;align-items:center}nav a{font-size:14px}.nav-cta,.btn{background:var(--green2);color:#fff!important;padding:12px 20px;border-radius:8px;border:0;display:inline-block;font-weight:700}
.hero{min-height:500px;background-size:cover;background-position:center;display:flex;align-items:center;padding:60px 8%;color:#fff}.hero>div{max-width:610px}.hero h1{font-size:52px;line-height:1.05;margin:0 0 18px}.hero p{font-size:18px;line-height:1.7}.cards{display:grid;gap:18px}.services{grid-template-columns:repeat(7,1fr)}.programs{grid-template-columns:repeat(5,1fr)}.card{background:#fff;border:1px solid #dfe8e2;border-radius:14px;padding:20px;box-shadow:0 4px 16px #0000000b}.card small{display:block;color:#66756d;margin-top:7px}.icon{font-size:28px}.badge{display:inline-block;padding:5px 10px;border-radius:20px;background:#e8f5ed;color:var(--green);font-size:12px}.intro{background:#f7faf8}.columns{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:22px}.columns>section{border:1px solid #e0e7e3;border-radius:14px;padding:22px}.news-item{border-bottom:1px solid #e7ece9;padding:10px 0}.news-item h3{margin-bottom:4px}.journal{padding:12px 0;border-bottom:1px solid #e5ebe7}.btn-outline{display:inline-block;border:1px solid var(--green);color:var(--green);padding:9px 14px;border-radius:8px}.download-box{background:#edf6f1;padding:20px;border-radius:10px;line-height:1.6}
footer{background:linear-gradient(135deg,#064d2b,#08713b);color:#fff;margin-top:40px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:35px}.footer-grid a{display:block;margin:9px 0}.footer-grid small{display:block;opacity:.8}.footer-brand{display:flex;align-items:center;gap:10px}.footer-brand img{width:70px}.copyright{border-top:1px solid #ffffff33;font-size:13px}
.chat-button{position:fixed;right:22px;bottom:20px;background:var(--green2);color:#fff;border:0;border-radius:28px;padding:14px 20px;font-weight:700;z-index:40}.chat-box{position:fixed;right:22px;bottom:78px;width:360px;max-height:560px;background:#fff;border-radius:15px;box-shadow:0 15px 45px #0003;display:none;z-index:40;overflow:auto}.chat-box.open{display:block}.chat-head{background:var(--green);color:#fff;padding:16px;display:flex;justify-content:space-between}.chat-head button{background:none;border:0;color:#fff;font-size:22px}.chat-content{padding:18px}.chat-content details{border:1px solid #dfe7e2;border-radius:8px;margin:8px 0;padding:10px}.chat-content summary{cursor:pointer;font-weight:700}
.login-body{background:#eef4f0;min-height:100vh;display:grid;place-items:center}.login-box{width:420px;background:#fff;border-radius:18px;padding:30px;box-shadow:0 14px 45px #0002}.login-box img{width:90px}.login-box input,.admin-main input,.admin-main textarea,.admin-main select{width:100%;padding:11px;border:1px solid #ccd8d0;border-radius:8px;margin:6px 0 12px}.alert{background:#ffe8e8;color:#a51e1e;padding:10px;border-radius:8px}
.admin-body{background:#f4f7f5}.sidebar{position:fixed;left:0;top:0;bottom:0;width:240px;background:linear-gradient(#075d32,#064324);color:#fff;padding:18px}.brand{display:flex;gap:10px;align-items:center;margin-bottom:22px}.brand img{width:55px}.brand small{display:block;color:#e5c834}.sidebar nav{display:block}.sidebar nav a{display:block;padding:11px 12px;border-radius:8px;margin:3px 0}.sidebar nav a.active,.sidebar nav a:hover{background:#0f8a4d}.admin-main{margin-left:240px;padding:28px}.admin-main header{display:flex;justify-content:space-between}.panel{background:#fff;border:1px solid #e1e8e4;border-radius:15px;padding:22px;margin:18px 0}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.stat{background:#fff;border:1px solid #dfe7e2;border-radius:13px;padding:22px}.stat strong{font-size:30px;color:var(--green);display:block}.grid-admin{display:grid;grid-template-columns:1fr 1.4fr;gap:20px}.list-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #e8ece9}.list-row small{display:block;color:#718078}.link-danger{border:0;background:none;color:#c0392b;cursor:pointer}.success{background:#def4e6;color:#146735;padding:12px;border-radius:9px}.article{max-width:850px}.article h1{font-size:42px}.lead{font-size:20px;color:#516158}.article-content{line-height:1.8}
@media(max-width:980px){nav{display:none}.services{grid-template-columns:repeat(2,1fr)}.programs{grid-template-columns:1fr 1fr}.columns,.footer-grid,.grid-admin{grid-template-columns:1fr}.hero h1{font-size:38px}.sidebar{position:static;width:auto}.admin-main{margin-left:0}.stats{grid-template-columns:1fr 1fr}.topbar{display:none}.chat-box{left:12px;right:12px;width:auto}}

.news-item{display:flex;gap:14px}
.news-thumb{width:120px;height:82px;object-fit:cover;border-radius:9px;flex:none}
.article-image{width:100%;max-height:520px;object-fit:cover;border-radius:14px;margin:22px 0}
.article-content img{max-width:100%;height:auto}
.article-content table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}
.article-content td,.article-content th{border:1px solid #d9e2dc;padding:8px}
/* =========================================
   TEMA HIJAU STAIBU — VERSI BERSIH
   ========================================= */

html,
body {
    background: #e8f6ed !important;
    color: #163c2a;
}

/* Header utama */
.site-header {
    background: linear-gradient(
        135deg,
        #008b50 0%,
        #006f40 55%,
        #005d35 100%
    ) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.20);
    box-shadow: 0 8px 24px rgba(0, 74, 42, 0.20);
}

/* Tulisan dan menu di header */
.site-header .site-brand b,
.site-header nav a {
    color: #ffffff !important;
}

.site-header .site-brand small {
    color: #f3cd42 !important;
}

/* Tombol daftar kuliah */
.site-header .nav-cta {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.85);
}

.site-header .nav-cta:hover {
    background: #ffffff !important;
    color: #006f40 !important;
}

/* Bagian profil */
.intro,
#profil {
    background: linear-gradient(
        135deg,
        #dff2e6 0%,
        #eef9f2 55%,
        #d9efdf 100%
    ) !important;
}

/* Bagian program studi dan konten */
.wrap,
#program-studi,
#layanan,
.columns {
    background: transparent !important;
}

/* Kartu */
.card,
.columns > section,
.download-box,
.news-item,
.journal {
    background: #f2faf5 !important;
    border: 1px solid #c8e3d1 !important;
    box-shadow: 0 8px 22px rgba(0, 92, 52, 0.08);
}

/* Hover kartu */
.card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 30px rgba(0, 92, 52, 0.14);
}

/* Status program studi */
.badge {
    background: #dff3e6 !important;
    color: #08723f !important;
    border: 1px solid #c4e4cf;
}

/* Tombol umum */
.btn,
.chat-button {
    background: linear-gradient(
        135deg,
        #008b50,
        #00683b
    ) !important;
    color: #ffffff !important;
}

/* Chat box */
.chat-box {
    background: #f4fbf6 !important;
    border: 1px solid #bdddc8;
}

.chat-head {
    background: linear-gradient(
        135deg,
        #008b50,
        #00683b
    ) !important;
}

/* Footer */
footer {
    background: linear-gradient(
        135deg,
        #00683a 0%,
        #00532f 55%,
        #003f24 100%
    ) !important;
    color: #ffffff;
}

/* Tampilan HP */
@media (max-width: 980px) {
    .site-header {
        background: linear-gradient(
            135deg,
            #008b50,
            #005d35
        ) !important;
    }
}