html,
    body {
        height: 100%;
        margin: 0;
        padding: 0;
    }

    body {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        /* setinggi layar */
        position: relative;
        overflow-x: hidden;
    }

    /* 🧭 Header */
    .img-header {
        display: block;
        margin: 60px auto 80px auto;
        /* atas 60px, bawah 80px */
        max-width: 100%;
        width: 750px;
        height: auto;
    }


    @media (max-width: 768px) {
        .img-header {
            width: 80%;
            margin: 40px auto 60px auto;
        }
    }

    /* 📦 Kontainer utama */
    .container {
        flex: 1;
        position: relative;
        z-index: 2;
        padding: 40px 20px 100px 20px;
        /* tambahkan padding bawah 100px */
    }

    @media (max-width: 768px) {
        .container {
            padding-bottom: 80px;
        }
    }

    @media (max-width: 480px) {
        .container {
            padding-bottom: 60px;
        }
    }


    /* 🧍‍♀️ Footer */
    .img-footer {
        position: fixed;
        bottom: 20px;
        /* jarak dari bawah 20px */
        left: 50%;
        transform: translateX(-50%);
        width: 600px;
        max-width: 90%;
        height: auto;
        z-index: 10;
    }

    @media (max-width: 768px) {
        .img-footer {
            width: 80%;
            margin: 30px auto 15px auto;
        }
    }