:root {
    --v2-auth-black: #202020;
    --v2-auth-pink: #fa2851;
    --v2-auth-yellow: #ffc107;
    --v2-auth-paper: #f5f6f9;
    --v2-auth-muted: #73737b;
}

.v2-auth-page { background: var(--v2-auth-paper); }
.v2-auth-page main { overflow: hidden; }
.v2-auth-page .rounded-bar { z-index: 1100; }
.v2-login-section { background: var(--v2-auth-paper); min-height: 900px; overflow: hidden; padding: 175px 0 115px; position: relative; }
.v2-login-section > .container { position: relative; z-index: 2; }
.v2-login-shape { display: block; pointer-events: none; position: absolute; transform: rotate(45deg); }
.v2-login-shape-pink { background: var(--v2-auth-pink); border-radius: 68px; height: 520px; left: -415px; top: 300px; width: 520px; }
.v2-login-shape-yellow { background: var(--v2-auth-yellow); border-radius: 78px; height: 690px; right: -485px; top: -315px; width: 690px; }
.v2-login-shape-black { background: var(--v2-auth-black); border-radius: 34px; bottom: -185px; height: 310px; left: 42%; width: 310px; }

.v2-auth-back { align-items: center; color: var(--v2-auth-black); display: inline-flex; font: 700 12px/1 "Raleway", sans-serif; gap: 8px; letter-spacing: .1em; margin-bottom: 54px; text-transform: uppercase; }
.v2-auth-back:hover { color: var(--v2-auth-pink); }
.v2-auth-eyebrow { background: var(--v2-auth-yellow); color: var(--v2-auth-black); display: table; font: 700 12px/1 "Raleway", sans-serif; letter-spacing: .13em; margin-bottom: 22px; padding: 11px 16px; text-transform: uppercase; }
.v2-login-intro h1 { color: var(--v2-auth-black); font: 700 clamp(55px, 6.4vw, 88px)/.94 "Raleway", sans-serif; letter-spacing: -.055em; margin: 0; }
.v2-login-intro h1 span { color: var(--v2-auth-pink); }
.v2-login-intro > p { color: var(--v2-auth-muted); font: 400 16px/1.75 "Roboto", sans-serif; margin: 29px 0 38px; max-width: 500px; }
.v2-auth-feature { align-items: center; display: flex; gap: 16px; }
.v2-auth-feature > div { align-items: center; background: var(--v2-auth-black); border-radius: 50%; color: #fff; display: flex; flex: 0 0 52px; height: 52px; justify-content: center; }
.v2-auth-feature > div i { font-size: 19px; }
.v2-auth-feature p { display: flex; flex-direction: column; margin: 0; }
.v2-auth-feature strong { color: var(--v2-auth-black); font: 700 14px/1.4 "Raleway", sans-serif; }
.v2-auth-feature span { color: #87878e; font: 400 12px/1.5 "Roboto", sans-serif; }

.v2-login-card { background: #fff; box-shadow: 0 30px 80px rgba(32, 32, 32, .14); overflow: hidden; padding: 52px 48px 45px; position: relative; }
.v2-login-card::before { background: var(--v2-auth-pink); content: ""; height: 6px; left: 0; position: absolute; top: 0; width: 90px; }
.v2-login-card-mark { color: #f0f0f3; font: 900 145px/1 "Raleway", sans-serif; position: absolute; right: -18px; top: 15px; transform: rotate(-8deg); }
.v2-login-card-kicker { color: var(--v2-auth-pink); font: 700 11px/1 "Raleway", sans-serif; letter-spacing: .14em; margin: 0 0 11px; position: relative; text-transform: uppercase; }
.v2-login-card h2 { color: var(--v2-auth-black); font: 700 42px/1.1 "Raleway", sans-serif; margin: 0 0 8px; position: relative; }
.v2-login-card h2 span { color: var(--v2-auth-pink); }
.v2-login-card-copy { color: #87878d; font: 400 13px/1.6 "Roboto", sans-serif; margin: 0 0 33px; position: relative; }
.v2-auth-status, .v2-auth-error { font: 500 13px/1.5 "Roboto", sans-serif; margin-bottom: 22px; padding: 13px 15px; }
.v2-auth-status { background: #effaf4; color: #207a4a; }
.v2-auth-error { align-items: center; background: #fff0f3; color: #ad1734; display: flex; gap: 8px; }
.v2-auth-error i { font-size: 18px; }

.v2-auth-field { margin-bottom: 18px; }
.v2-forgot-password-form .v2-auth-field { margin-bottom: 12px; }
.v2-auth-field label { color: #44444a; font: 700 12px/1 "Raleway", sans-serif; margin: 0 0 10px; }
.v2-auth-label-row { align-items: center; display: flex; justify-content: space-between; }
.v2-auth-label-row a { color: var(--v2-auth-pink); font: 600 11px/1 "Raleway", sans-serif; margin-bottom: 10px; }
.v2-auth-label-row a:hover { color: var(--v2-auth-black); }
.v2-auth-control { align-items: center; border: 1px solid #dedee3; display: flex; height: 52px; position: relative; transition: border-color .2s ease, box-shadow .2s ease; }
.v2-auth-control:focus-within { border-color: var(--v2-auth-black); box-shadow: 4px 4px 0 var(--v2-auth-yellow); }
.v2-auth-control > i { color: var(--v2-auth-pink); font-size: 20px; margin-left: 17px; }
.v2-auth-control input { background: transparent; border: 0; box-sizing: border-box; color: var(--v2-auth-black); flex: 1 1 0; font: 400 14px/50px "Roboto", sans-serif; height: 50px; margin: 0; min-width: 0; outline: 0; padding: 0 14px; width: 0; }
.v2-auth-control input::placeholder { color: #aaaab0; }
.v2-password-toggle { align-items: center; align-self: stretch; background: transparent; border: 0; color: #85858c; cursor: pointer; display: flex; font-size: 20px; padding: 0 16px; }
.v2-password-toggle:hover { color: var(--v2-auth-pink); }
.v2-remember { align-items: center; color: #696970; cursor: pointer; display: inline-flex; font: 400 12px/1.4 "Roboto", sans-serif; gap: 9px; margin: 0 0 25px; }
.v2-remember input { height: 1px; opacity: 0; position: absolute; width: 1px; }
.v2-remember > span { align-items: center; border: 1px solid #cfd0d5; color: transparent; display: inline-flex; height: 18px; justify-content: center; transition: .2s ease; width: 18px; }
.v2-remember input:checked + span { background: var(--v2-auth-pink); border-color: var(--v2-auth-pink); color: #fff; }
.v2-remember input:focus + span { box-shadow: 0 0 0 3px rgba(250, 40, 81, .15); }
.v2-auth-submit { align-items: center; background: var(--v2-auth-pink); border: 1px solid var(--v2-auth-pink); color: #fff; cursor: pointer; display: flex; font: 700 13px/1 "Raleway", sans-serif; justify-content: space-between; padding: 18px 22px; transition: .25s ease; width: 100%; }
.v2-auth-submit i { font-size: 19px; transition: transform .25s ease; }
.v2-auth-submit:hover { background: var(--v2-auth-black); border-color: var(--v2-auth-black); }
.v2-auth-submit:hover i { transform: translateX(4px); }
.v2-auth-register { border-top: 1px solid #ececf0; color: #77777e; font: 400 12px/1.5 "Roboto", sans-serif; margin: 27px 0 0; padding-top: 24px; text-align: center; }
.v2-auth-register a { color: var(--v2-auth-pink); font-weight: 700; }
.v2-auth-register a:hover { color: var(--v2-auth-black); }
.v2-auth-text-button { background: transparent; border: 0; color: var(--v2-auth-pink); cursor: pointer; font: inherit; font-weight: 700; padding: 0; }
.v2-auth-text-button:hover { color: var(--v2-auth-black); }
.v2-auth-page .v2-site-footer { background: var(--v2-auth-paper); }

@media (max-width: 1199.98px) {
    .v2-login-card { padding-left: 38px; padding-right: 38px; }
    .v2-login-shape-pink { left: -455px; }
}
@media (max-width: 991.98px) {
    .v2-login-section { padding: 145px 0 90px; }
    .v2-login-intro { margin-bottom: 55px; }
    .v2-auth-back { margin-bottom: 35px; }
    .v2-login-intro > p { max-width: 630px; }
    .v2-login-shape-yellow { right: -565px; }
    .v2-login-shape-black { left: auto; right: 8%; }
}
@media (max-width: 767.98px) {
    .v2-login-section { min-height: auto; padding: 125px 0 70px; }
    .v2-login-shape { display: none; }
    .v2-login-intro h1 { font-size: 55px; }
    .v2-login-card { padding: 42px 25px 35px; }
    .v2-login-card-mark { font-size: 110px; }
}
@media (max-width: 360px) {
    .v2-login-intro h1 { font-size: 47px; }
    .v2-login-card { padding-left: 20px; padding-right: 20px; }
}
