& {
padding: 45px 20px 70px;
background: linear-gradient(180deg, #fff7fb 0%, #ffffff 100%);
}
.container {
max-width: 1050px;
padding: 45px;
background: linear-gradient(145deg, #ffffff, #fff1f8);
border: 1px solid #ffd2e6;
border-radius: 30px;
box-shadow: 0 22px 55px rgba(209, 0, 112, 0.1);
}
.page-header {
margin-bottom: 35px;
text-align: center;
}
.majortitle {
margin: 0;
color: #d10070;
font-family: Poppins, sans-serif;
font-size: 48px;
font-weight: 300;
letter-spacing: -1px;
}
.account-form {
max-width: 780px;
margin: auto;
padding: 32px;
background: #ffffff;
border: 1px solid #ffd2e6;
border-radius: 24px;
box-shadow: 0 12px 35px rgba(255, 11, 134, 0.07);
}
.account-form h2 {
margin: 0 0 12px;
color: #d10070;
font-family: Poppins, sans-serif;
font-size: 30px;
font-weight: 300;
}
.account-form label {
display: block;
margin-bottom: 8px;
color: #7b3d5e;
font-family: Poppins, sans-serif;
font-size: 13px;
font-weight: 500;
}
.account-form input,
.account-form textarea,
.account-form select {
width: 100%;
margin: 0;
padding: 16px 18px;
color: #402132;
background: #fffafd;
border: 1px solid #ffd0e5;
border-radius: 15px;
outline: none;
box-shadow: none;
}
.account-form input:focus,
.account-form textarea:focus,
.account-form select:focus {
border-color: #ff0b86;
box-shadow: 0 0 0 4px rgba(255, 11, 134, 0.1);
}
.account-form textarea {
min-height: 170px;
}
.account-form .btn {
min-height: 54px;
padding: 15px 32px;
color: #ffffff;
background: linear-gradient(135deg, #ff4da6, #ff0b86, #ce006d);
border: 0;
border-radius: 999px;
box-shadow: 0 13px 28px rgba(255, 11, 134, 0.25);
}
.account-form .btn:hover {
transform: translateY(-2px);
box-shadow: 0 17px 32px rgba(255, 11, 134, 0.32);
}
@media screen and (max-width: 749px) {
& {
padding: 18px 10px 45px;
}
.container {
padding: 25px 15px;
border-radius: 22px;
}
.majortitle {
font-size: 36px;
}
.account-form {
padding: 22px 15px;
border-radius: 20px;
}
.account-form .btn {
width: 100%;
}
}
