@font-face{font-family:"Nunito Sans";font-weight:400;font-display:swap;src:url(/assets/fonts/nunito-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Nunito Sans";font-weight:600;font-display:swap;src:url(/assets/fonts/nunito-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Nunito Sans";font-weight:700;font-display:swap;src:url(/assets/fonts/nunito-sans-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-weight:600;font-display:swap;src:url(/assets/fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Noto Naskh Arabic";font-weight:400;font-display:swap;src:url(/assets/fonts/noto-naskh-arabic-arabic-400-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Noto Naskh Arabic";font-weight:700;font-display:swap;src:url(/assets/fonts/noto-naskh-arabic-arabic-700-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
:root{--teal:#2E5252;--dark:#172929;--sage:#90A9A9;--sage2:#BDD4D4;--purple:#A037AE;--ink:#32302F;--paper:#F2ECE4}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:"Nunito Sans","Noto Naskh Arabic",system-ui,sans-serif;color:var(--ink);background:var(--paper);font-size:18px;line-height:1.5;padding-bottom:96px}
header{background:var(--teal);color:#fff;text-align:center;padding:20px 16px 18px}
header img{height:64px;width:auto}
header p{margin:6px 0 0;font-family:"Cormorant Garamond","Noto Naskh Arabic",serif;font-style:italic;font-size:19px}
main{max-width:560px;margin:0 auto;padding:20px 16px 24px}
h1{font-family:"Cormorant Garamond","Noto Naskh Arabic",serif;font-weight:600;color:var(--teal);font-size:34px;line-height:1.1;margin:4px 0 18px}
.stap{display:none}.stap.actief{display:block}
.teller{font-size:15px;font-weight:600;color:var(--purple);letter-spacing:.04em;text-transform:uppercase}
.keuze{display:block;width:100%;text-align:start;background:#fff;border:2px solid var(--sage2);border-radius:14px;padding:16px 18px;margin:0 0 12px;font:inherit;font-weight:700;color:var(--teal);cursor:pointer}
.keuze small{display:block;font-weight:400;color:var(--ink);font-size:15px}
.keuze:hover,.keuze:focus-visible{border-color:var(--teal);outline:none}
label{display:block;font-weight:600;margin:14px 0 6px}
input[type=text],input[type=tel]{width:100%;font:inherit;padding:14px;border:2px solid var(--sage2);border-radius:12px;background:#fff}
input:focus{border-color:var(--teal);outline:none}
.melding{border-radius:14px;padding:14px 16px;margin:14px 0;background:#fff;border-inline-start:6px solid var(--teal)}
.melding.uit{border-inline-start-color:var(--purple)}
.melding p{margin:0}
.melding ol{margin:8px 0 0;padding-inline-start:22px}
.knop{display:block;width:100%;border:0;border-radius:14px;padding:16px;font:inherit;font-weight:700;font-size:19px;background:var(--purple);color:#fff;cursor:pointer;margin-top:18px;text-align:center;text-decoration:none}
.knop.licht{background:var(--teal)}
.terug{background:none;border:0;color:var(--teal);font:inherit;text-decoration:underline;cursor:pointer;padding:0;margin-top:14px}
.verborgen{display:none}
.klein{font-size:15px;color:#555}
.talen{font-size:15px;text-align:center;margin-top:22px;color:var(--teal)}
.balk{position:fixed;left:0;right:0;bottom:0;display:flex;gap:10px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--dark)}
.balk a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;text-decoration:none;font-weight:700;border-radius:12px;padding:12px 8px}
/* Zelfde kleuren als de website: WhatsApp donkergroen met witte letters, bellen met een rand */
.balk .bel{background:transparent;border:2px solid var(--sage2);color:#fff;padding:10px 6px}.balk .bel span[dir]{white-space:nowrap}
.balk .app{background:var(--teal);color:#fff}
.honing{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}

#naar-site{text-align:center;margin-top:28px}
main a{color:var(--teal)}

/* Taalkeuze bovenaan (17-10-2026) */
.talen-kies{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.talen-kies button{font:inherit;font-size:15px;font-weight:600;line-height:1.2;color:var(--teal);background:#fff;border:2px solid var(--sage2);border-radius:999px;padding:7px 14px;cursor:pointer}
.talen-kies button[aria-pressed="true"]{background:var(--teal);border-color:var(--teal);color:#fff}
.talen-kies button:focus-visible{outline:3px solid var(--purple);outline-offset:2px}

/* Inwonende zorg apart in stap 1, en wat u koos in stap 2 */
.of{margin:22px 0 10px;padding-top:16px;border-top:1px solid var(--sage2);font-weight:700;color:var(--teal)}
.gekozen{margin:6px 0 2px;font-size:15px}
.gekozen strong{color:var(--teal)}

/* Wlz, Wmo en inwonende zorg: pgb of zorg in natura */
.vorm-groep{margin:0 0 6px}
.vorm-titel{font-family:"Cormorant Garamond","Noto Naskh Arabic",serif;font-weight:600;color:var(--teal);font-size:26px;line-height:1.15;margin:4px 0 12px}
.vorm-titel:focus{outline:none}
.vorm{position:relative;padding-inline-end:56px}
.vorm[aria-pressed="true"]{border-color:var(--teal);background:#E6EFEF}
.vorm[aria-pressed="true"]::after{content:"\2713";position:absolute;inset-inline-end:16px;top:50%;width:28px;height:28px;margin-top:-14px;border-radius:50%;background:var(--teal);color:#fff;font-size:16px;line-height:28px;text-align:center;font-weight:700}

/* Arabisch: van rechts naar links, rustiger regelafstand */
html[lang="ar"] body{line-height:1.75}
html[lang="ar"] header p{font-style:normal}
html[lang="ar"] h1,html[lang="ar"] .vorm-titel{line-height:1.4}
html[lang="ar"] .teller{letter-spacing:0}
