/* Reset */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

/* Body */

body{

font-family: "Segoe UI", Roboto, Arial, sans-serif;
background: linear-gradient(135deg,#5f2c82,#49a09d);
min-height:100vh;

display:flex;
align-items:center;
justify-content:center;

color:white;

}

/* Container */

.container{

width:90%;
max-width:600px;

padding:50px;

text-align:center;

background:rgba(255,255,255,0.1);
backdrop-filter: blur(12px);

border-radius:18px;

box-shadow:
0 10px 30px rgba(0,0,0,0.2),
inset 0 1px 1px rgba(255,255,255,0.2);

}

/* Logo */

.logo img{

width:140px;
margin-bottom:25px;

}

/* Title */

h1{

font-size:42px;
font-weight:700;
margin-bottom:15px;
letter-spacing:0.5px;

}

/* Text */

p{

font-size:18px;
line-height:1.6;
opacity:0.9;
margin-bottom:30px;

}

/* Form */

form{

display:flex;
flex-wrap:wrap;
justify-content:center;
gap:10px;

}

/* Email Input */

input{

padding:14px 16px;

border:none;
border-radius:8px;

width:260px;

font-size:16px;

outline:none;

transition:all 0.25s ease;

}

/* Input focus */

input:focus{

box-shadow:0 0 0 3px rgba(255,255,255,0.25);

}

/* Button */

button{

padding:14px 22px;

border:none;
border-radius:8px;

font-size:16px;
font-weight:600;

background:white;
color:#5f2c82;

cursor:pointer;

transition:all 0.25s ease;

}

/* Button hover */

button:hover{

transform:translateY(-2px);
box-shadow:0 6px 14px rgba(0,0,0,0.25);

}

/* Footer */

.footer{

margin-top:35px;
font-size:14px;
opacity:0.7;

}

/* Mobile */

@media(max-width:600px){

h1{
font-size:32px;
}

p{
font-size:16px;
}

.container{
padding:35px;
}

input{
width:100%;
}

button{
width:100%;
}

}