/* Mireya — gedeelde stijl voor login, profiel en app. Zelfde taal als /privacy/ en /groep/. */
@font-face{font-family:'Mulish';font-style:normal;font-weight:400 900;font-display:swap;src:url("/fonts/mulish-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Mulish';font-style:normal;font-weight:400 900;font-display:swap;src:url("/fonts/mulish-latin.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

*{margin:0;padding:0;box-sizing:border-box}
body{background:#FDF8FF;color:#2E1065;font-family:'Mulish',sans-serif;-webkit-font-smoothing:antialiased;line-height:1.6;min-height:100vh;display:flex;flex-direction:column}
a{color:#7C3AED;text-decoration:none;font-weight:700}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #7C3AED;outline-offset:2px;border-radius:6px}

header.nav{background:#2E1065}
.nav-inner{display:flex;align-items:center;justify-content:space-between;max-width:560px;margin:0 auto;padding:15px 24px}
.brand{display:flex;align-items:center;gap:11px}
.brand .logo{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#7C3AED,#F472B6);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(124,58,237,.5)}
.brand .logo span{font-weight:900;font-size:21px;color:#fff;line-height:1;margin-top:-1px}
.brand .name{font-weight:800;font-size:21px;letter-spacing:-.01em;color:#fff}
.brand .name b{color:#6EE7B7}
.nav-inner .back{font-size:14px;color:#d9cdf2;font-weight:700}
.nav-inner .back:hover{color:#fff;text-decoration:none}

main{flex:1;width:100%;max-width:560px;margin:0 auto;padding:40px 20px 64px}
.card{background:#fff;border-radius:22px;padding:clamp(26px,5vw,38px);box-shadow:0 20px 50px rgba(46,16,101,.08)}
.eyebrow{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#7C3AED;font-weight:800;margin-bottom:8px}
h1{font-weight:900;font-size:clamp(26px,5vw,34px);letter-spacing:-.02em;line-height:1.1;margin-bottom:10px}
.lead{font-size:15.5px;color:#4b3a72;font-weight:600;margin-bottom:24px}

label{display:block;font-size:13.5px;font-weight:800;color:#2E1065;margin:18px 0 6px}
input,select{width:100%;padding:13px 15px;font-family:inherit;font-size:16px;font-weight:600;color:#2E1065;background:#FEFCFF;border:1.5px solid #E6D8FF;border-radius:12px}
input::placeholder{color:#a897c9;font-weight:500}
input:focus,select:focus{border-color:#7C3AED;background:#fff}
input.code{letter-spacing:.42em;text-align:center;font-size:24px;font-weight:800;padding:15px 10px}
.hint{font-size:13px;color:#6b5494;font-weight:600;margin-top:6px}

button{width:100%;margin-top:22px;padding:15px 20px;font-family:inherit;font-size:16px;font-weight:800;color:#fff;background:#7C3AED;border:0;border-radius:12px;cursor:pointer;transition:background .15s}
button:hover:not(:disabled){background:#6D28D9}
button:disabled{opacity:.55;cursor:not-allowed}
button.ghost{background:transparent;color:#7C3AED;border:1.5px solid #E6D8FF;margin-top:10px}
button.ghost:hover:not(:disabled){background:#F5EEFF}

.radio-row{display:flex;gap:10px;margin-top:6px}
.radio-row label{flex:1;margin:0;padding:14px 10px;text-align:center;border:1.5px solid #E6D8FF;border-radius:12px;background:#FEFCFF;cursor:pointer;font-size:15px;font-weight:700}
.radio-row input{position:absolute;opacity:0;width:0;height:0}
.radio-row label.on{border-color:#7C3AED;background:#F5EEFF;color:#7C3AED}

.msg{margin-top:18px;padding:13px 16px;border-radius:12px;font-size:14.5px;font-weight:700;display:none}
.msg.err{display:block;background:#FEF2F2;border:1px solid #FECACA;color:#9F1239}
.msg.ok{display:block;background:#ECFDF5;border:1px solid #A7F3D0;color:#065F46}
.step{display:none}
.step.on{display:block}

.who{background:#F5EEFF;border:1px solid #E6D8FF;border-radius:14px;padding:16px 18px;font-size:14.5px;color:#5b4a85;font-weight:600;margin-bottom:8px;overflow-wrap:anywhere}
.who b{color:#2E1065}

footer{background:#2E1065;color:#b6a6d9}
.foot-inner{max-width:560px;margin:0 auto;padding:24px;display:flex;justify-content:space-between;gap:12px 22px;flex-wrap:wrap;font-size:12.5px;font-weight:600}
.foot-inner a{color:#c3b4e6;font-weight:600}