/* ===========================
   RESET
=========================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{

    font-family:'Inter',sans-serif;

    background:#f5f5f5;

    color:#222;

}

/* ===========================
   COLOR
=========================== */

:root{

    --primary:#7B1113;

    --gold:#C9A227;

    --silver:#D9D9D9;

    --white:#ffffff;

    --dark:#222;

}

/* ===========================
   HERO
=========================== */

.hero{

    min-height:100vh;

    display:flex;

    justify-content:center;

    align-items:center;

    text-align:center;

    background:linear-gradient(
    180deg,
    #7B1113 0%,
    #5E0E10 100%);

    position:relative;

    overflow:hidden;

}

.hero-overlay{

    position:absolute;

    inset:0;

    background:
    radial-gradient(circle at top,
    rgba(255,255,255,.08),
    transparent 60%);

}

.hero-content{

    position:relative;

    z-index:10;

    width:90%;

    max-width:700px;

}

.hero-logo{
    width:120px;
    max-width:120px;
    height:auto;
    display:block;
    margin:0 auto 20px;
    object-fit:contain;
}

.hero-badge{

    display:inline-block;

    padding:10px 22px;

    border-radius:50px;

    background:rgba(255,255,255,.12);

    color:white;

    border:1px solid rgba(255,255,255,.25);

    margin-bottom:25px;

}

.hero h1{

    font-size:52px;

    color:white;

    font-weight:800;

    margin-bottom:15px;

}

.hero p{

    color:#f2f2f2;

    font-size:20px;

    margin-bottom:35px;

}

.hero button{

    padding:16px 42px;

    background:var(--gold);

    color:#222;

    font-weight:700;

    border:none;

    border-radius:12px;

    cursor:pointer;

    transition:.3s;

}

.hero button:hover{

    transform:translateY(-4px);

    box-shadow:0 15px 30px rgba(0,0,0,.25);

}

/* Card Tombol Utama */
/* Card Tombol Utama - Tambahkan ini tepat di atas .admin-btn-card:hover */
.admin-btn-card {
    display: inline-flex !important;
    align-items: center !important;
    gap: 12px !important;
    background-color: #ffffff !important; /* Latar Putih Tegas */
    border: 2px solid #e5e7eb !important;
    padding: 10px 20px !important;
    border-radius: 14px !important;
    color: #1f2937 !important;
    text-decoration: none !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
    transition: all 0.3s ease !important;
    margin-top: 15px !important;
}

/* Efek Hover */
.admin-btn-card:hover {
    background-color: #f3f4f6 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
}

/* Kotak Ikon Kunci */
.admin-btn-icon {
    background: #dc2626 !important; /* Warna merah KPU */
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
    flex-shrink: 0 !important;
}

/* Teks Didalam Tombol */
.admin-btn-text {
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
}

.admin-btn-sub {
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    color: #6b7280 !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
}

.admin-btn-title {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #111827 !important;
    line-height: 1.2 !important;
}