/* ==========================
MITTIVAH SIGNUP
========================== */

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

body{

background:linear-gradient(135deg,#f4fff3,#eef9ec,#ffffff);

display:flex;

justify-content:center;

align-items:center;

min-height:100vh;

padding:20px;

overflow-x:hidden;

}


/* Container */

.container{

width:100%;

display:flex;

justify-content:center;

align-items:center;

}


/* Card */

.signup-card{

width:100%;

max-width:430px;

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

backdrop-filter:blur(18px);

padding:35px 28px;

border-radius:28px;

box-shadow:

0 20px 45px rgba(0,0,0,.10);

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

text-align:center;

transition:.35s;

}

.signup-card:hover{

transform:translateY(-5px);

}


/* Logo */

.logo img{

width:95px;

margin-bottom:18px;

}


/* Heading */

.signup-card h1{

font-size:30px;

color:#206b2e;

margin-bottom:10px;

font-weight:700;

}

.signup-card p{

font-size:15px;

color:#666;

margin-bottom:28px;

line-height:1.6;

}


/* Inputs */

.signup-card input{

width:100%;

padding:15px 18px;

margin-bottom:18px;

border-radius:15px;

border:1px solid #d9ead7;

outline:none;

font-size:15px;

transition:.30s;

background:#fff;

}

.signup-card input:focus{

border-color:#4CAF50;

box-shadow:0 0 0 4px rgba(76,175,80,.12);

}


/* Password */

.password-box{

position:relative;

}

.password-box input{

padding-right:50px;

margin-bottom:18px;

}

.toggle-password{

position:absolute;

right:16px;

top:15px;

cursor:pointer;

font-size:18px;

color:#666;

}


/* Button */

.signup-card button{

width:100%;

padding:16px;

border:none;

border-radius:16px;

background:linear-gradient(90deg,#1f6b2f,#4CAF50);

color:#fff;

font-size:17px;

font-weight:600;

cursor:pointer;

transition:.35s;

}

.signup-card button:hover{

transform:translateY(-3px);

box-shadow:0 12px 25px rgba(31,107,47,.30);

}


/* Login */

.login-link{

margin-top:22px;

font-size:15px;

color:#666;

}

.login-link a{

text-decoration:none;

font-weight:700;

color:#1f6b2f;

}

.login-link a:hover{

text-decoration:underline;

}


/* Features */

.features{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:14px;

margin-top:30px;

}

.features div{

background:#f7fff5;

border-radius:15px;

padding:16px;

font-size:28px;

box-shadow:0 8px 20px rgba(0,0,0,.05);

transition:.30s;

}

.features div:hover{

transform:translateY(-4px);

}

.features span{

display:block;

margin-top:8px;

font-size:14px;

font-weight:600;

color:#206b2e;

}


/* Mobile */

@media(max-width:480px){

.signup-card{

padding:28px 20px;

border-radius:22px;

}

.signup-card h1{

font-size:24px;

}

.features{

grid-template-columns:1fr;

}

}