:root{--blue:#0a2cca;--orange:#ff6400;--ink:#122269;--muted:#67718e;--line:#e2e6f0;--bg:#f7f8fc}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{font-family:Arial,sans-serif;color:var(--ink);background:var(--bg);font-size:15px}
.scherm{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) 380px}
.kaart{align-self:center;justify-self:center;width:min(520px,100%);padding:48px 40px}
.eyebrow{font-size:10px;font-weight:bold;letter-spacing:1.5px;color:var(--muted)}
h1{font-size:52px;line-height:.97;letter-spacing:-1.7px;margin:18px 0 20px;color:var(--blue)}
.intro{color:var(--muted);line-height:1.6;margin:0 0 26px}
.gegevens{background:white;border:1px solid var(--line);border-left:3px solid var(--blue);border-radius:6px;padding:12px 16px;font-size:13px;overflow-wrap:anywhere}
button{font:inherit;cursor:pointer;border-radius:7px;font-weight:700;transition:.15s}
.primary{background:var(--orange);border:1px solid var(--orange);color:#fff;padding:15px 24px;font-size:16px;width:100%}
.primary:hover{background:#db5600;border-color:#db5600}.primary:disabled{opacity:.55;cursor:wait}
button:focus-visible{outline:3px solid #ff9c5c;outline-offset:3px}
.melding{min-height:1.4em;margin:16px 0 0;font-weight:bold;font-size:13px}.melding.fout{color:#b42828}.melding.ok{color:#2f7a5f}
.klein{font-size:12px;color:var(--muted);line-height:1.6;margin-top:28px;border-top:1px solid var(--line);padding-top:18px}
.merk{background:var(--blue);color:#fff;display:flex;flex-direction:column;padding:40px 32px}
.wordmark{font-size:26px;font-weight:700;letter-spacing:-1px}.wordmark span{display:block;letter-spacing:2.7px;font-size:10px;margin-top:10px;opacity:.7}
.merk p{margin-top:auto;font-size:30px;font-weight:bold;line-height:1;letter-spacing:-.8px}
.logo-frame{width:180px;height:160px;background:url(/auth/static/logo.jpg) center bottom / 540px 675px no-repeat;border-radius:6px;margin:24px auto 0}
@media(max-width:800px){.scherm{grid-template-columns:1fr}.merk{order:-1;padding:18px 16px;flex-direction:row;align-items:center;justify-content:space-between}.merk p,.logo-frame{display:none}.wordmark{font-size:20px}.kaart{padding:32px 16px}h1{font-size:40px}}