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

body{

background:#edf4ff;

display:flex;
justify-content:center;
padding:20px;

}

.container{

width:100%;
max-width:420px;

background:white;

border-radius:20px;

padding:24px;

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

}

.header{

text-align:center;
margin-bottom:24px;

}

.header h1{

color:#1E40AF;
font-size:24px;

}

.header p{

color:#666;

margin-top:6px;

}

label{

display:block;

margin-top:18px;
margin-bottom:6px;

font-weight:600;

}

input,
select,
textarea{

width:100%;

padding:14px;

border-radius:12px;

border:1px solid #ddd;

font-size:15px;

}

input[readonly]{

background:#f4f4f4;

}

textarea{

resize:none;

}

.checkbox{

display:flex;

align-items:flex-start;

gap:10px;

margin-top:20px;

}

.checkbox input{

width:18px;
margin-top:3px;

}

button{

margin-top:25px;

width:100%;

padding:15px;

border:none;

background:#2563EB;

color:white;

font-size:16px;

font-weight:bold;

border-radius:14px;

cursor:pointer;

transition:.2s;

}

button:hover{

background:#1d4ed8;

}

.modal{

display:none;

position:fixed;

left:0;
top:0;

width:100%;
height:100%;

background:rgba(0,0,0,.4);

justify-content:center;

align-items:center;

}

.modal-content{

background:white;

padding:25px;

border-radius:20px;

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

}

.modal-content h2{

color:#2563EB;

margin-bottom:15px;

}

.modal-content button{

margin-top:20px;

}