*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Segoe UI',sans-serif;
}

/* =========================
   BODY
========================= */

body{

    background:#eef2f7;

    min-height:100vh;

    overflow:hidden;

}

/* =========================
   CONTAINER
========================= */

.container{

    width:100%;

    min-height:100vh;

    display:flex;

}

/* =========================
   LEFT SIDE
========================= */

.left{

    width:55%;

    background:
    linear-gradient(
    rgba(15,23,42,0.20),
    rgba(15,23,42,0.30)
    ),
    url('bg.jpg');

    background-size:cover;

    background-position:center;

    background-repeat:no-repeat;

    position:relative;

}

/* =========================
   OVERLAY
========================= */

.overlay{

    width:100%;

    height:100%;

}

/* =========================
   RIGHT SIDE
========================= */

.right{

    width:45%;

    display:flex;

    justify-content:center;

    align-items:center;

    background:#f8fafc;

    padding:25px;

}

/* =========================
   LOGIN BOX
========================= */

.login-box{

    width:100%;

    max-width:360px;

    background:white;

    padding:22px;

    border-radius:24px;

    border:2px solid #d4a24c;

    box-shadow:
    0 10px 30px rgba(0,0,0,0.10);

}

/* =========================
   LOGO
========================= */

.logo{

    margin-bottom:14px;

    text-align:center;

}

.logo h1{

    font-size:24px;

    color:#14532d;

    margin-bottom:5px;

    font-weight:800;

    line-height:1.2;

}

.logo h2{

    font-size:13px;

    color:#334155;

    line-height:1.5;

    font-weight:700;

}

.logo p{

    margin-top:10px;

    color:#64748b;

    font-size:12px;

    line-height:1.6;

}

/* =========================
   INPUT GROUP
========================= */

.input-group{

    margin-bottom:10px;

}

.input-group label{

    display:block;

    margin-bottom:4px;

    color:#334155;

    font-size:13px;

    font-weight:600;

}

/* =========================
   INPUT
========================= */

.input-group input,
.input-group select{

    width:100%;

    height:40px;

    padding:0 14px;

    border:1px solid #d1d5db;

    border-radius:10px;

    background:#ffffff;

    font-size:13px;

    outline:none;

    transition:0.3s;

}

.input-group input:focus,
.input-group select:focus{

    border-color:#166534;

    box-shadow:
    0 0 0 3px rgba(22,101,52,0.10);

}

/* =========================
   BUTTON LOGIN
========================= */

.btn-login{

    width:100%;

    height:42px;

    margin-top:6px;

    border:none;

    border-radius:10px;

    background:
    linear-gradient(
    135deg,
    #166534,
    #14532d
    );

    color:white;

    font-size:15px;

    font-weight:700;

    cursor:pointer;

    transition:0.3s;

    box-shadow:
    0 8px 18px rgba(22,101,52,0.20);

}

.btn-login:hover{

    opacity:0.95;

}

/* =========================
   INFO
========================= */

.info{

    margin-top:12px;

    color:#64748b;

    font-size:11px;

    line-height:1.7;

    text-align:center;

}

/* =========================
   RESPONSIVE MOBILE
========================= */

@media(max-width:768px){

    body{

        overflow:auto;

    }

    .container{

        flex-direction:column;

        min-height:100vh;

    }

    .left{

        width:100%;

        height:240px;

        display:block;

        background:
        linear-gradient(
        rgba(15,23,42,0.25),
        rgba(15,23,42,0.35)
        ),
        url('bg.jpg');

        background-size:cover;

        background-position:center;

        background-repeat:no-repeat;

    }

    .right{

        width:100%;

        margin-top:-45px;

        position:relative;

        z-index:5;

        background:transparent;

        padding:15px;

    }

    .login-box{

        width:100%;

        max-width:420px;

        margin:auto;

        border-radius:24px 24px 0 0;

        max-height:none;

        overflow:visible;

        padding:22px;

    }

    .logo h1{

        font-size:22px;

    }

}