/* birthday.be, de mijlpaalrekenaar (bv. Abraham of Sarah zien). Bouwt voort op de stijl van "Hoe oud ben jij echt?". */
.bw-mp .bw-t1 b{font-size:clamp(26px,2.5vw,34px);line-height:1.08;letter-spacing:-.03em;overflow-wrap:normal;word-break:normal}
.bw-mp .sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.bw-keuze{margin-bottom:4px}
.bw-mp .bw-t6 b{font-size:clamp(40px,5vw,64px)}
.bw-mp:not(.is-klaar) .bw-t6 b{opacity:.35}
.bw-mp.is-voorbij .bw-t3,.bw-mp.is-voorbij .bw-t4{display:none}
.bw-keuze{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;border:0;min-width:0}
.bw-keuze label{position:relative;cursor:pointer}
.bw-keuze input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.bw-keuze span{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1.5px rgba(11,33,74,.22);font:700 15px var(--font);color:var(--navy);transition:background .2s,box-shadow .2s}
.bw-keuze input:checked+span{background:var(--navy);color:#fff;box-shadow:none}
.bw-keuze input:focus-visible+span{outline:3px solid var(--coral);outline-offset:2px}
.bw-keuze label:hover span{box-shadow:inset 0 0 0 1.5px var(--navy)}
@media (max-width:520px){.bw-mp .bw-t1 b{font-size:clamp(28px,8vw,36px)}.bw-mp .bw-t5 b{font-size:clamp(20px,6vw,26px)}}


/* bekende gezichten uit de jaargang */
.bw-jg-lijst{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin:26px 0 0;padding:0;list-style:none}
.bw-jg{background:var(--navy);color:#fff;border-radius:36px;width:calc(100% - 40px);max-width:calc(var(--wrap) - 40px);margin:clamp(8px,1.5vw,20px) auto;padding:clamp(36px,5vw,64px) 0;overflow:hidden}
.bw-jg .wg-in{max-width:none;padding:0 clamp(24px,4.4vw,56px)}
.bw-jg .wg-h{color:#fff}.bw-jg .wg-eyebrow{color:var(--yellow)}.bw-jg .bw-intro{color:rgba(255,255,255,.78)}
.bw-jg-lijst a{display:flex;flex-direction:column;gap:6px;height:100%;padding:18px 18px 20px;border-radius:18px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);color:#fff;text-decoration:none;transition:transform .25s cubic-bezier(.3,1.5,.5,1),background .25s}
.bw-jg-lijst a:hover{transform:translateY(-4px);background:rgba(255,255,255,.14)}
.bw-jg-lijst b{font:800 20px/1.15 var(--font-head);letter-spacing:-.02em}
.bw-jg-d{font:700 12px var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--yellow)}
.bw-jg-o{font-size:14.5px;line-height:1.35;color:rgba(255,255,255,.72)}
@media (max-width:760px){.bw-jg{border-radius:28px}}
/* veelgestelde vragen */
.bw-vr-lijst{display:grid;gap:10px;margin-top:22px}
.bw-vr{border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1.5px rgba(11,33,74,.12)}
.bw-vr summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:14px 20px;font:700 17px/1.3 var(--font);color:var(--navy);cursor:pointer;list-style:none}
.bw-vr summary::-webkit-details-marker{display:none}
.bw-vr summary::after{content:"+";flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#FFE3E2;font-size:20px;line-height:1;transition:transform .2s,background .2s}
.bw-vr[open] summary::after{transform:rotate(45deg);background:var(--yellow)}
.bw-vr p{margin:0;padding:0 20px 18px;font-size:16px;line-height:1.55;color:#3F4A6B}

/* Abraham en Sarah in het rood */
em.bw-rood{font-style:inherit;color:var(--coral)}
.bw-mp:not(.is-klaar) .bw-t1 b{opacity:.4}
.bw-mp:not(.is-klaar) .bw-t1 span{font-weight:700}
.bw-mp .bw-t6 b{opacity:1}
.bw-mp:not(.is-klaar) .bw-t6 b{opacity:.85}

/* reeks kaartjes */
.bw-kk-rij{display:flex;gap:16px;margin:28px 0 0;padding:6px 4px 18px;list-style:none;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.bw-kk-rij li{flex:0 0 clamp(150px,22%,230px);scroll-snap-align:start;transform:rotate(var(--r,0deg));transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.bw-kk-rij li:hover{transform:rotate(0) translateY(-6px) scale(1.03)}
.bw-kk-rij a{display:block;border-radius:14px;overflow:hidden;box-shadow:0 18px 30px -20px rgba(11,33,74,.6)}
.bw-kk-rij img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.bw-kk-knop{margin:12px 0 0}
@media (min-width:1000px){.bw-kk-rij{overflow:visible;flex-wrap:nowrap;justify-content:space-between}.bw-kk-rij li{flex:1 1 0;max-width:210px}}
@media (prefers-reduced-motion:reduce){.bw-kk-rij li{transition:none}}