/* Decorative artwork stays behind opaque, readable form surfaces. */
.auth-surface main { background-color: var(--secondary); background-image: linear-gradient(180deg, rgba(10,37,64,.65), rgba(10,37,64,.75)), url('../images/auth-background.webp'); background-size: cover; background-position: center top; background-repeat: no-repeat; min-height: 80vh; padding-bottom: 40px; }
.auth-form-page { min-height: 100vh; padding: 130px 0 56px; }
.auth-surface main .card { background: #fff; border: 1px solid rgba(255,255,255,.6); border-radius: 22px; box-shadow: 0 20px 55px rgba(0,0,0,.18) !important; }
.auth-surface main .form-control, .auth-surface main .form-select { border-radius: 10px; }
.auth-surface main .btn { border-radius: 10px; }
.auth-surface main .btn-primary { color: var(--secondary); }
.auth-surface .get-started-section { background: transparent; }
.auth-surface .start-card { background: #fff; box-shadow: 0 16px 40px rgba(0,0,0,.16); }
.auth-surface .public-page-heading { background: transparent; }
.auth-surface .page-heading-background { display: none; }
.auth-surface .public-page-heading::before { background: rgba(10,37,64,.2); }
.auth-surface main > .bg-light { background: transparent !important; }
@media (max-width: 575.98px) { .auth-form-page { padding: 110px 0 32px; } .auth-surface main { background-position: 35% top; padding-bottom: 24px; } .auth-surface main .card { border-radius: 16px; } }