.login-area{

   
    position: relative;

    min-height: calc(100vh - 90px);

    padding-top: 110px;
   
    background-color:#080808;

    background-size:cover;

    background-position:center;

    overflow:hidden;

}

.bg-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(to right,

    rgba(0,0,0,.35),

    rgba(0,0,0,.55),

    rgba(0,0,0,.78));

}

.gold-glow{

    position:absolute;

    left:-120px;

    top:120px;

    width:700px;

    height:700px;

    border-radius:50%;

    background:radial-gradient(

    rgba(255,190,60,.55),

    transparent 70%);

    filter:blur(90px);

}

.left-side{

display:flex;

justify-content:center;

align-items:flex-end;

min-height:700px;

}

.couple-area{

    position:relative;

    width:100%;

}

.couple-img{

    width:100%;

    max-width:620px;

    height:auto;

    display:block;

    margin:auto;

    position:relative;

    left:0;

    bottom:-10 !important;

}
.login-card{

    width:100%;

    max-width:520px;

    margin:auto;

    background:rgba(8,8,8,.78);

    backdrop-filter:blur(18px);

    border:1px solid rgba(212,175,55,.55);

    border-radius:30px;

    padding:45px;

    box-shadow:

    0 0 60px rgba(212,175,55,.18);

    position:relative;

}

.login-card:before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:1px;

    background:

    linear-gradient(90deg,

    transparent,

    #f4d46a,

    transparent);

}

.logo-box{

    text-align:center;

    margin-bottom:15px;

}

.logo-box img{

    width:170px;

}

.login-card h1{

    color:#fff;

    text-align:center;

    font-size:58px;

    font-family:"Cinzel",serif;

    margin-bottom:8px;

}

.subtitle{

    color:#ddd;

    text-align:center;

    margin-bottom:35px;

    font-size:18px;

}
.divider{

    margin:40px 0;

    position:relative;

    text-align:center;

}

.divider span{

    color:#d4af37;

    background:#0d0d0d;

    padding:0 20px;

    position:relative;

    z-index:3;

}

.divider:before{

    content:"";

    position:absolute;

    left:0;

    top:50%;

    width:100%;

    height:1px;

    background:#5b4716;

}
.input-box{

    margin-bottom:25px;

}

.input-box label{

    display:block;

    color:#ffffff;

    font-size:15px;

    font-weight:500;

    margin-bottom:12px;

}

.input-group{

    display:flex;

    align-items:center;

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

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

    border-radius:14px;

    height:62px;

    transition:.35s;

    overflow:hidden;

}

.input-group:hover{

    border-color:#d4af37;

}

.input-group:focus-within{

    border-color:#d4af37;

    box-shadow:0 0 20px rgba(212,175,55,.18);

}

.input-group i{

    width:60px;

    text-align:center;

    color:#d4af37;

    font-size:18px;

}

.input-group input{

    flex:1;

    background:none;

    border:none;

    color:#fff;

    height:100%;

    outline:none;

    font-size:16px;

}

.input-group input::placeholder{

    color:#8c8c8c;

}
.radio-wrapper{

    display:flex;

    gap:15px;

    align-items:center;

    flex-wrap:nowrap;

}

.radio-card{

    flex:1;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    padding:14px 20px;

    border:1px solid rgba(212,175,55,.35);

    border-radius:14px;

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

    cursor:pointer;

    transition:.3s;

    color:#fff;

    margin:0;

}

.radio-card:hover{

    border-color:#d4af37;

    background:rgba(212,175,55,.08);

}

.radio-card input{

    margin:0;

    accent-color:#d4af37;

}
.eye{

    cursor:pointer;

    padding-right:20px;

}
.remember{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin:28px 0;

}

.remember label{

    color:#d5d5d5;

    display:flex;

    align-items:center;

    gap:10px;

    cursor:pointer;

}

.remember input{

    width:18px;

    height:18px;

    accent-color:#d4af37;

}

.remember a{

    color:#d4af37;

    text-decoration:none;

    font-weight:500;

}

.remember a:hover{

    color:#ffd86b;

}
.login-btn{

    width:100%;

    height:64px;

    border:none;

    border-radius:14px;

    font-size:22px;

    font-weight:700;

    color:#111;

    cursor:pointer;

    transition:.35s;

    background:

    linear-gradient(

    90deg,

    #b8860b,

    #d4af37,

    #f7df8c);

}

.login-btn:hover{

    transform:translateY(-3px);

    box-shadow:

    0 15px 35px

    rgba(212,175,55,.35);

}

.login-btn:active{

    transform:scale(.98);

}
.register{

    margin-top:30px;

    text-align:center;

    color:#cfcfcf;

    font-size:17px;

}

.register a{

    color:#d4af37;

    text-decoration:none;

    font-weight:600;

}

.register a:hover{

    color:#ffd86b;

}
@media(max-width:991px){

.left-side{

display:none;

}

.login-card{

max-width:560px;

width:100%;

margin:0 auto;

}
.login-card h1{

font-size:42px;

}

.logo-box img{

width:150px;

}

}.login-card::after{

    content:"";

    position:absolute;

    inset:-1px;

    border-radius:30px;

    background:linear-gradient(
        135deg,
        rgba(255,215,120,.45),
        transparent 30%,
        transparent 70%,
        rgba(255,215,120,.25)
    );

    pointer-events:none;

    opacity:.7;

}
.login-card{

    animation:floatCard 5s ease-in-out infinite;

}
.couple-area{

display:flex;

justify-content:flex-start;

align-items:flex-end;

height:100%;

}
@keyframes floatCard{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-10px);

    }

    100%{

        transform:translateY(0);

    }

}
.login-btn{

    position:relative;

    overflow:hidden;

}

.login-btn::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:70%;

    height:100%;

    background:

    linear-gradient(

        90deg,

        transparent,

        rgba(255,255,255,.45),

        transparent);

    transform:skewX(-25deg);

    transition:.7s;

}

.login-btn:hover::before{

    left:140%;

}
.google-btn{

    overflow:hidden;

    position:relative;

}

.google-btn::before{

    content:"";

    position:absolute;

    left:-120%;

    width:60%;

    height:100%;

    background:

    linear-gradient(

    90deg,

    transparent,

    rgba(255,255,255,.55),

    transparent);

    transform:skewX(-25deg);

    transition:.7s;

}

.google-btn:hover::before{

    left:150%;

}
.particles{

    position:absolute;

    inset:0;

    pointer-events:none;

    overflow:hidden;

}

.particles span{

    position:absolute;

    width:4px;

    height:4px;

    background:#d4af37;

    border-radius:50%;

    animation:particle 12s linear infinite;

    opacity:.7;

}

@keyframes particle{

    from{

        transform:translateY(100vh);

        opacity:0;

    }

    20%{

        opacity:1;

    }

    to{

        transform:translateY(-120px);

        opacity:0;

    }

}

.smoke{

    position:absolute;

    left:0;
    bottom:0;

    width:80%;
    max-width:80%;

    opacity:.18;

    pointer-events:none;

    animation:smokeMove 18s ease-in-out infinite;

}

@keyframes smokeMove{

    0%{

        transform:translateX(0);

    }

    50%{

        transform:translateX(12px);

    }

    100%{

        transform:translateX(0);

    }

}

.google-btn{

display:flex;

align-items:center;

justify-content:center;

gap:12px;

width:100%;

height:60px;

background:#fff;

border-radius:14px;

text-decoration:none;

font-weight:600;

color:#222;

margin-bottom:30px;

}

.google-btn img{

width:24px;

}


@media (min-width:1200px){



.login-card{

max-width:540px;

}

.couple-img{

max-width:650px;

}

}

@media (max-width:1366px){

.login-card{

padding:35px;

}

.login-card h1{

font-size:32px;

}

.couple-img{

max-width:520px;

}
.login-area{
	
	padding-top: 85px;
	}
	
	.divider {
    margin: 17px 0;
   
}
	.input-group {
		
		    height: 57px;
	}
	
	.login-btn{
		height: 57px;
		
	}
	
	.google-btn{
		height: 57px;
		
	}
	.input-box {
    margin-bottom: 13px;
}
	.subtitle
 {
    
    margin-bottom: 9px;
   
}
	.login-btn {
    
    font-size: 19px;
		font-weight: 600;}
}