body:has(> .auth-main) > .navbar { display: none; }
.auth-main { min-height: 100svh; }
.auth-page { --auth-green: #02534d; --auth-deep: #003d38; --auth-orange: #ff9a00; min-height: 100svh; background: radial-gradient(circle at 82% 9%, #deede8 0, transparent 35%), #f5f9f8; color: var(--auth-deep); font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
.auth-page * { box-sizing: border-box; }
.auth-page :is(a, button, input):focus-visible { outline: 3px solid var(--auth-orange); outline-offset: 3px; }
.auth-header { padding: 1rem 1.5rem 0; }
.auth-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: min(100%, 1320px); min-height: 60px; margin-inline: auto; padding: .5rem; border-radius: 999px; background: var(--auth-deep); box-shadow: 0 14px 32px #003d3829; }
.auth-brand { display: inline-flex; align-items: center; gap: .75rem; color: #fff; font-size: 1.05rem; font-weight: 800; line-height: 1.1; letter-spacing: -.04em; text-decoration: none; white-space: nowrap; }
.auth-brand:hover { color: #fff; }
.auth-brand img { display: block; flex: none; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.auth-brand small { display: block; margin-top: .3rem; color: #b8d7cf; font-size: .6rem; font-weight: 750; letter-spacing: .12em; }
.auth-nav-links { display: flex; align-items: center; gap: .25rem; }
.auth-nav-links a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .5rem 1rem; border-radius: 999px; color: #e0efeb; font-size: .9rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.auth-nav-links a:hover { background: #ffffff1c; color: #fff; }
.auth-nav-links a.is-active { background: var(--auth-orange); color: var(--auth-deep); }
.auth-nav-links .auth-nav-back { background: var(--auth-orange); color: var(--auth-deep); }
.auth-nav-links .auth-nav-back:hover { background: #ffb84d; color: var(--auth-deep); }
.auth-layout { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1fr); align-items: center; gap: clamp(2rem, 5vw, 5rem); width: min(100% - 3rem, 1240px); margin-inline: auto; padding-block: clamp(2rem, 4vw, 4rem) 5rem; }
.auth-intro { display: flex; flex-direction: column; justify-content: space-between; min-height: min(720px, calc(100svh - 150px)); padding: clamp(2rem, 4vw, 3.5rem); overflow: hidden; border-radius: 28px; background: radial-gradient(circle at 74% 72%, #0a796c 0, transparent 42%), linear-gradient(140deg, #003d38, #02534d); box-shadow: 0 24px 60px #003d382e; color: #fff; }
.auth-intro-label, .auth-kicker { color: var(--auth-orange); font-size: .75rem; font-weight: 850; letter-spacing: .16em; }
.auth-intro h2 { max-width: 460px; margin: 1.2rem 0; font-size: clamp(2.4rem, 4vw, 4.25rem); font-weight: 800; letter-spacing: -.055em; line-height: 1.08; }
.auth-intro p { max-width: 420px; color: #d6ebe5; font-size: 1.05rem; line-height: 1.7; }
.auth-intro-art { position: relative; display: grid; place-items: center; min-height: 280px; margin-top: 2rem; }
.auth-intro-orbit { position: absolute; width: 260px; height: 260px; border: 1px solid #ffffff36; border-radius: 50%; box-shadow: 0 0 0 38px #ffffff08, 0 0 0 76px #ffffff05; }
.auth-intro-card { position: relative; display: flex; flex-direction: column; width: min(280px, 80%); min-height: 190px; padding: 1.25rem; border: 1px solid #ffffff70; border-radius: 20px; background: linear-gradient(145deg, #fff, #e7f1ef); box-shadow: 0 24px 45px #002b2861; color: var(--auth-green); transform: rotate(-6deg); }
.auth-intro-card img { width: 58px; height: 58px; margin-bottom: auto; border-radius: 50%; }
.auth-intro-card span { margin-top: 1rem; color: #526e68; font-size: .58rem; font-weight: 850; letter-spacing: .15em; }
.auth-intro-card strong { margin-top: .2rem; font-size: 1.7rem; letter-spacing: -.05em; }
.auth-intro-card small { color: #526e68; }
.auth-form-column { min-width: 0; }
.auth-card { padding: clamp(1.5rem, 3.5vw, 3rem); border: 1px solid #d4e3df; border-radius: 24px; background: #fff; box-shadow: 0 24px 55px #003d3814; }
@media (min-width: 901px) { .auth-page:is(.auth-page-login, .auth-page-registration, .auth-page-prospect) .auth-layout { align-items: stretch; } .auth-page:is(.auth-page-login, .auth-page-registration, .auth-page-prospect) .auth-card { display: flex; flex-direction: column; justify-content: center; height: 100%; } }
.auth-card h1 { margin: .55rem 0 .7rem; font-size: clamp(1.75rem, 2.6vw, 2.35rem); font-weight: 800; letter-spacing: -.04em; }
.auth-description { margin-bottom: 1.5rem; color: #526e68; line-height: 1.65; }
.auth-card .form-label { color: var(--auth-deep); font-size: .9rem; font-weight: 700; }
.auth-card .form-control, .auth-card .input-group-text { min-height: 46px; border-color: #cbded8; border-radius: 10px; }
.auth-card .input-group .input-group-text { border-radius: 10px 0 0 10px; background: #e7f1ef; color: var(--auth-green); font-weight: 700; }
.auth-card .input-group .form-control { border-radius: 0 10px 10px 0; }
.auth-card .form-control:focus { border-color: #3d9989; box-shadow: 0 0 0 .2rem #8abbb044; }
.auth-card .form-check-input:checked { border-color: var(--auth-green); background-color: var(--auth-green); }
.auth-card .form-text { color: #617a74; font-size: .8rem; }
.auth-submit, .auth-secondary { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 50px; padding: .7rem 1rem; border-radius: 11px; font-weight: 800; text-align: center; text-decoration: none; transition: background .2s, transform .2s; }
.auth-submit { border: 0; background: var(--auth-orange); color: var(--auth-deep); }
.auth-submit:hover { background: #ffb84d; transform: translateY(-1px); }
.auth-secondary { border: 1px solid #8abbb0; background: #fff; color: var(--auth-green); }
.auth-secondary:hover { background: #e7f1ef; color: var(--auth-green); }
.auth-card a:not(.auth-secondary) { color: var(--auth-green); font-weight: 750; }
.auth-card a:not(.auth-secondary):hover { color: var(--auth-deep); }
.auth-card .alert-info { border-color: #b7ddd3; background: #e7f4f0; color: var(--auth-deep); }
.auth-card .alert-warning { border-color: #f4d29c; background: #fff6e8; color: #684400; }
.auth-card .alert-success { border-color: #b7ddd3; background: #e7f4f0; color: var(--auth-deep); }
.auth-card .alert { border-radius: 12px; line-height: 1.55; }
.auth-card .alert code { color: var(--auth-green); font-weight: 800; }
.auth-hint { margin-top: 1.5rem; padding: 1rem 1.1rem; border-radius: 12px; background: #f2f7f5; color: #526e68; font-size: .85rem; line-height: 1.6; }
.auth-switch { margin: 1.5rem 0 0; color: #526e68; text-align: center; font-size: .9rem; }
.auth-progress { display: flex; align-items: center; gap: .5rem; margin: 1.2rem 0 1.6rem; }
.auth-progress span { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #cbded8; border-radius: 50%; background: #fff; color: #67827a; font-size: .8rem; font-weight: 800; }
.auth-progress span.is-complete { border-color: var(--auth-green); background: var(--auth-green); color: #fff; }
.auth-progress span.is-current { border-color: var(--auth-orange); background: var(--auth-orange); color: var(--auth-deep); }
.auth-progress i { flex: 1; height: 2px; background: #d4e3df; }
.auth-progress i.is-complete { background: var(--auth-green); }
.auth-preview-photo { display: block; width: 96px; height: 96px; margin-bottom: 1.5rem; border: 4px solid #e7f1ef; border-radius: 50%; object-fit: cover; }
@media (max-width: 900px) { .auth-layout { grid-template-columns: 1fr; gap: 1.5rem; max-width: 720px; } .auth-intro { min-height: 0; padding: 2rem; } .auth-intro h2 { max-width: 600px; font-size: clamp(2rem, 6vw, 3rem); } .auth-intro-art { display: none; } }
@media (max-width: 520px) { .auth-header { padding: .75rem .75rem 0; } .auth-nav { min-height: 56px; } .auth-brand { gap: .5rem; font-size: .9rem; } .auth-brand img { width: 40px; height: 40px; } .auth-brand small { font-size: .53rem; } .auth-nav-links { gap: 0; } .auth-nav-links a { min-height: 40px; padding: .4rem .65rem; font-size: .82rem; } .auth-nav-links .auth-nav-home { display: none; } .auth-layout { width: min(100% - 1.5rem, 720px); padding-top: 1rem; } .auth-intro { padding: 1.5rem; border-radius: 20px; } .auth-intro h2 { font-size: 2rem; } .auth-intro p { margin-bottom: 0; font-size: .92rem; } .auth-card { border-radius: 20px; } }
@media (max-width: 360px) { .auth-brand small { display: none; } .auth-nav-links a { padding-inline: .5rem; } }
@media (max-width: 400px) { .auth-page-prospect .auth-nav-back { max-width: 135px; font-size: .76rem; white-space: normal; text-align: center; } }
@media (prefers-reduced-motion: reduce) { .auth-submit, .auth-secondary { transition: none; } }