
.oa-hero{background:linear-gradient(135deg,#0f172a 0%,#1a1a2e 55%,#0d2b23 100%);color:#fff;padding:56px 5% 48px;text-align:center}
.oa-hero h1{font-size:clamp(1.8rem,4.2vw,2.6rem);font-weight:900;letter-spacing:-.02em;margin:0 0 12px;line-height:1.15}
.oa-hero p{font-size:1rem;opacity:.9;max-width:620px;margin:0 auto;line-height:1.6}
.oa-wrap{max-width:720px;margin:-28px auto 64px;padding:0 5%}
.oa-card{background:#fff;border:1px solid var(--bdr);border-radius:18px;box-shadow:0 18px 48px rgba(0,0,0,.09);padding:clamp(20px,4vw,34px)}
.oa-row{margin-bottom:15px}
.oa-row-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:15px;margin-bottom:15px}
.oa-card label{display:block;font-size:.82rem;font-weight:600;color:var(--dk);margin-bottom:5px}
.oa-card input[type=text],.oa-card input[type=email],.oa-card input[type=tel],.oa-card select,.oa-card textarea{
  width:100%;padding:12px 13px;border:1.5px solid var(--bdr);border-radius:10px;font-size:16px;font-family:inherit;color:#1a2436;background:#fff;outline:none;transition:border-color .15s,box-shadow .15s}
.oa-card input:focus,.oa-card select:focus,.oa-card textarea:focus{border-color:var(--g);box-shadow:0 0 0 3px rgba(0,128,90,.12)}
.oa-card textarea{min-height:110px;resize:vertical}
.oa-diensten{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:9px}
/* CASCADE-CHIP-20260921: `.oa-card label` (0,1,1) hieronder versloeg `.oa-chip` (0,1,0), dus de
   vakjes stonden als block i.p.v. flex: aanvinkvakje kleefde aan de tekst. Opgevraagd bij de
   browser (CSS.getMatchedStylesForNode), niet geraden. Daarom label.oa-chip = 0,2,1. */
.oa-card label.oa-chip{display:flex;align-items:center;gap:9px;border:1.5px solid var(--bdr);border-radius:11px;padding:11px 13px;cursor:pointer;font-size:.87rem;font-weight:500;min-height:44px;transition:all .15s}
.oa-card label.oa-chip:hover{border-color:var(--g)}
.oa-card label.oa-chip.on{border-color:var(--g);background:rgba(0,128,90,.06);font-weight:600}
.oa-card label.oa-chip input{width:18px;height:18px;flex:none;accent-color:var(--g)}
.oa-card label.oa-vw{display:flex;gap:9px;align-items:flex-start;font-size:.83rem;color:var(--nt);line-height:1.5;margin:4px 0 18px}
.oa-card label.oa-vw input{width:18px;height:18px;flex:none;margin-top:1px;accent-color:var(--g)}
.oa-btn{width:100%;padding:15px;border:none;border-radius:11px;background:var(--g);color:#fff!important;font-size:1rem;font-weight:700;font-family:inherit;cursor:pointer;min-height:48px;transition:background .15s}
.oa-btn:hover:not(:disabled){background:var(--g2)}
.oa-btn:disabled{opacity:.6;cursor:default}
.oa-err{display:none;background:#fef2f2;border:1px solid #fecaca;color:#991b1b;border-radius:10px;padding:11px 13px;font-size:.86rem;margin-bottom:14px;line-height:1.5}
.oa-ok{display:none;text-align:center;padding:12px 0}
.oa-ok .vink{width:58px;height:58px;border-radius:50%;background:rgba(0,128,90,.1);color:var(--g);display:flex;align-items:center;justify-content:center;font-size:1.9rem;margin:0 auto 14px}
.oa-ok h2{font-size:1.25rem;font-weight:800;color:var(--dk);margin-bottom:8px}
.oa-ok p{font-size:.92rem;color:var(--nt);line-height:1.6;max-width:430px;margin:0 auto 6px}
.oa-naast{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:18px}
.oa-naast a{border:1.5px solid var(--bdr);border-radius:10px;padding:10px 16px;font-size:.87rem;font-weight:600;color:var(--dk);min-height:44px;display:inline-flex;align-items:center}
.oa-hulp{text-align:center;font-size:.85rem;color:var(--nt);margin-top:18px;line-height:1.6}
.oa-hulp a{color:var(--g);font-weight:600}
