.icon-img-footer {
    width: 80px;
    padding: 0 5px;
}

@media (min-width: 768px) {
    .icon-img-footer {
        width: 120px;
    }
}

@media (min-width: 992px) {
    .icon-img-footer {
        width: 120px;
    }
}

.button-login-daftar {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    font-weight: 700;
    gap: 10px;
}

.button-login-daftar a {
    text-align: center;
    text-decoration: none;
}

.login,
.register {
    padding: 15px 10px;
    font-size: 23px;
    font-weight: 800;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
}

/* LOGIN - ORANGE KUNING ELEGANT */
.login,
.login-button {
    background:
        radial-gradient(circle at top, rgb(0 0 0 / 28%), transparent 42%), linear-gradient(to bottom, #000000 0%, #674e09 48%, #000000 72%, #000000 100%);
    border: 2px solid #ffdf3d;
    color: #ffffff;
    text-shadow:
        0 1px 2px rgba(0, 0, 0, 0.9),
        0 0 8px rgba(255, 196, 0, 0.72);
    box-shadow:
        0 0 16px rgba(255, 208, 0, 0.58),
        0 0 26px rgba(255, 215, 60, 0.30),
        inset 0 0 12px rgba(255, 245, 160, 0.14);
}

/* REGISTER - KUNING TERANG PREMIUM */
.register,
.register-button {
    background:
        radial-gradient(circle at top, rgb(0 0 0 / 28%), transparent 42%), linear-gradient(to bottom, #000000 0%, #674e09 48%, #000000 72%, #000000 100%);
    border: 2px solid #fff6a8;
    color: #3b2b00;
    text-shadow:
        0 1px 2px rgba(255, 255, 255, 0.62),
        0 0 6px rgba(255, 176, 0, 0.70);
    box-shadow:
        0 0 18px rgba(255, 210, 0, 0.58),
        0 0 30px rgba(255, 217, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.48);
}

/* SHINE EFFECT */
.login::before,
.register::before,
.login-button::before,
.register-button::before {
    content: "";
    position: absolute;
    top: 0;
    left: -80%;
    width: 55%;
    height: 100%;
    background: linear-gradient(
        120deg,
        transparent,
        rgba(255, 255, 255, 0.42),
        transparent
    );
    transform: skewX(-22deg);
    transition: left 0.65s ease;
    pointer-events: none;
}

.login:hover::before,
.register:hover::before,
.login-button:hover::before,
.register-button:hover::before {
    left: 130%;
}

.login:hover,
.register:hover,
.login-button:hover,
.register-button:hover {
    filter: brightness(1.12) contrast(1.06);
    transform: translateY(-2px);
    box-shadow:
        0 0 24px rgba(255, 196, 0, 0.78),
        0 0 38px rgba(255, 225, 70, 0.48),
        inset 0 0 14px rgba(255, 255, 255, 0.14);
}