.b-register__in{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(1rem,calc(2*var(--vw)),1.5rem);align-items:start}
.b-register__in::before{content:"";position:absolute;left:calc(var(--pad,40px) - 2.5rem);bottom:-2.5rem;width:clamp(9rem,calc(16*var(--vw)),14rem);aspect-ratio:1;
background:url(/assets/img/deco/stippen-roze.svg) 0 0/contain no-repeat;opacity:.9;pointer-events:none}
.b-register .b-kopgroep{grid-column:1 / span 6;grid-row:1;position:relative;z-index:3;margin-bottom:clamp(1.6rem,calc(3*var(--vw)),2.4rem)}
.b-register__foto{position:relative;grid-column:7 / -1;grid-row:1 / span 2;align-self:start;aspect-ratio:3 / 4;margin:0}
.b-register__kader{position:absolute;inset:0;overflow:hidden;border-radius:var(--b-r-media);box-shadow:0 30px 60px -32px rgba(10,10,10,.5)}
.b-register__kader picture{display:block;width:100%;height:100%}
.b-register__kader img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--focus,72% 45%);transition:transform .8s var(--b-ease)}
.b-register__kader::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(180deg,rgba(69,10,20,0),rgba(69,10,20,.35));pointer-events:none}
.b-register__paneel{grid-column:1 / span 8;grid-row:2;position:relative;z-index:4;padding:clamp(1.3rem,calc(2.6*var(--vw)),2.2rem);
background:var(--b-donker);color:#fff;border-radius:var(--b-r-kaart);box-shadow:0 34px 60px -32px rgba(50,6,14,.7)}
.b-register__zoek{margin:0 0 1.1rem}
.b-register__zoek[hidden]{display:none}
.b-register__zoeklabel{display:block;margin:0 0 .65rem;font:600 1.05rem/1.3 var(--font-kop);color:#fff}
.b-register__veld{position:relative;display:flex;align-items:center}
.b-register__veld svg{position:absolute;left:1rem;width:22px;height:22px;color:var(--b-zacht);pointer-events:none}
.b-register__veld input{width:100%;min-height:58px;margin:0;padding:.8rem 1rem .8rem 3.1rem;border:0;border-radius:var(--b-r-control);background:#fff;color:var(--b-inkt);font:400 1.08rem/1.3 var(--font-tekst)}
.b-register__veld input::placeholder{color:#7A7A7A}
.b-register__veld input:focus-visible{outline:3px solid #fff;outline-offset:3px}
.b-register__uitslag{min-height:1.5rem;margin:.75rem 0 0;font-size:.95rem;line-height:1.5;color:rgba(255,255,255,.88)}
.b-register__uitslag p{margin:0}
.b-register__uitslag a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.b-register__telling{font-weight:600;color:#fff}
.b-register__zoek:not([hidden])+.b-register__nav{padding-top:1.1rem;border-top:1px solid rgba(255,255,255,.14)}
.b-register__vakken{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.b-register__vakken li{display:flex}
.b-register__vak{position:relative;flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:.15rem;
min-height:7.4rem;padding:.85rem 2.1rem .75rem .9rem;border-radius:var(--b-r-control) var(--b-r-control) 2px 2px;
background:rgba(255,255,255,.05);border-bottom:4px solid rgba(244,204,205,.35);color:#fff;text-decoration:none;transition:opacity .3s var(--b-ease)}
.b-register__vak::before{content:"";position:absolute;inset:0;border-radius:inherit;background:rgba(255,255,255,.08);opacity:0;transition:opacity .3s var(--b-ease)}
.b-register__stapel{order:3;position:relative;margin-top:auto;padding-top:.7rem;display:flex;flex-wrap:wrap-reverse;align-content:flex-start;gap:3px;width:calc(4 * 17px + 3 * 3px)}
.b-register__doos{position:relative;display:block;width:17px;height:14px;border-radius:2px;background:#fff;transition:transform .35s var(--b-ease),opacity .3s var(--b-ease)}
.b-register__doos::after{content:"";position:absolute;top:0;bottom:0;left:50%;width:3px;margin-left:-1.5px;background:var(--b-signaal)}
.b-register__doos:nth-child(2){transition-delay:.04s}.b-register__doos:nth-child(3){transition-delay:.08s}.b-register__doos:nth-child(4){transition-delay:.12s}
.b-register__naam{order:1;position:relative;font:600 1rem/1.25 var(--font-kop);overflow-wrap:break-word;hyphens:auto}
.b-register__aantal{order:2;position:relative;margin-top:0;font-size:.82rem;line-height:1.2;color:rgba(255,255,255,.74);font-variant-numeric:tabular-nums}
.b-register__pijl{position:absolute;top:.9rem;right:.8rem;width:15px;height:15px;color:var(--b-op-donker);transition:transform .3s var(--b-ease)}
.b-register--zoekt .b-register__doos{opacity:.22}
.b-register--zoekt .b-register__doos.is-treffer{opacity:1;background:var(--b-signaal)}
.b-register--zoekt .b-register__doos.is-treffer::after{background:var(--b-inkt)}
.b-register__vak.is-leeg{opacity:.5}
.b-register-weg{display:none!important}
::highlight(b-register){background-color:#FFD9C6;color:#0A0A0A}
.b-register__vak:focus-visible{outline:3px solid #fff;outline-offset:3px}
.b-register__vak:focus-visible::before{opacity:1}
.b-register__vak:focus-visible .b-register__doos{transform:translateY(-3px)}
.b-register__vak:focus-visible .b-register__pijl{transform:translate(2px,-2px)}
@media (hover:hover){
.b-register__vak:hover::before{opacity:1}
.b-register__vak:hover .b-register__doos{transform:translateY(-3px)}
.b-register__vak:hover .b-register__pijl{transform:translate(2px,-2px)}
.b-register__foto:hover .b-register__kader img{transform:scale(1.05)}
.b-register__uitslag a:hover{color:var(--b-op-donker)}
}
@media (max-width:1099.98px){
.b-register__paneel{grid-column:1 / -1}
}
@media (max-width:899.98px){
.b-register__in{grid-template-columns:minmax(0,1fr)}
.b-register__vakken{grid-template-columns:repeat(2,minmax(0,1fr))}
.b-register .b-kopgroep,.b-register__foto,.b-register__paneel{grid-column:1;grid-row:auto}
.b-register__foto{aspect-ratio:16 / 10;max-width:100%;margin:0 0 0 clamp(1rem,calc(5*var(--vw)),2.5rem)}
.b-register__paneel{margin-top:-2.5rem;margin-inline:.75rem 0}
.b-register__in::before{left:auto;right:0;top:auto;bottom:-2rem;width:8rem}
}
@media (max-width:560px){
.b-register__paneel{margin-inline:0}
.b-register__vakken{gap:.6rem}
.b-register__vak{min-height:6.6rem;padding:.8rem 1.9rem .7rem .85rem}
.b-register__pijl{top:.85rem;right:.7rem}
}
@media (prefers-reduced-motion:reduce){
.b-register__doos,.b-register__kader img,.b-register__pijl{transition:none}
.b-register__vak:hover .b-register__doos,.b-register__vak:focus-visible .b-register__doos,.b-register__vak:hover .b-register__pijl,.b-register__foto:hover .b-register__kader img{transform:none}
}
@media print{.b-register__foto,.b-register__zoek{display:none}}
