body.login { background: #f3f7f7; color: #0f2a43; }
.login #login { box-sizing: border-box; width: min(100% - 2rem, 28rem); padding-block: clamp(2rem, 7vh, 5rem) 2rem; }
.login h1 a { background-image: url("brand/logo-horizontal.png"); background-size: contain; background-position: center; width: 195px; height: 39px; margin-bottom: 1.75rem; }
.login .sdir-login-title { font-size: clamp(1.6rem, 5vw, 2.2rem); font-weight: 700; line-height: 1.1; color: #0f2a43; text-align: center; }
.sdir-login-intro { margin-block: .65rem 1.25rem; text-align: center; font-size: .95rem; }
.login form { border: 1px solid #dce7e4; border-radius: 1rem; box-shadow: 0 10px 32px #0f2a4310; padding: 1.5rem; }
.login form .input { border-radius: .6rem; border-color: #a9beb8; font-size: 1rem; min-height: 2.9rem; }
.login .button-primary { min-height: 2.8rem; background: #23665a; border-color: #23665a; font-weight: 700; padding-inline: 1.25rem; }
.login .button-primary:hover, .login .button-primary:focus { background: #174b42; border-color: #174b42; }
.login .cf-turnstile { margin-block: .8rem; }
.login #nav, .login #backtoblog { text-align: center; }
