/* — laadscherm, alleen gebruikt op de homepage — */
.loader{position:fixed;inset:0;z-index:100;background:var(--color-accent);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;animation:loaderHide .55s cubic-bezier(.7,0,.3,1) 2.3s forwards}
@keyframes loaderHide{to{transform:translateY(-100%);visibility:hidden}}
.loader-block{width:72px;height:72px;background:#ffffff;display:flex;align-items:center;justify-content:center;font-family:ui-monospace,monospace;font-weight:700;font-size:30px;color:var(--color-accent);flex:none;animation:blockIn .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes blockIn{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}
.loader-cursor{animation:blink .9s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.loader-letter{display:inline-block;animation:letterIn .35s cubic-bezier(.2,.8,.2,1) both}
@keyframes letterIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.loader-sub{font-family:var(--font-heading);font-weight:600;font-size:13px;letter-spacing:0.34em;text-transform:uppercase;color:#ffffff;animation:letterIn .4s cubic-bezier(.2,.8,.2,1) 1.15s both}
.loader-bar{width:220px;height:4px;background:color-mix(in srgb,#ffffff 25%,transparent);overflow:hidden}
.loader-bar-fill{height:100%;background:#ffffff;transform-origin:left;animation:barFill 1.9s cubic-bezier(.4,.1,.2,1) .2s both}
@keyframes barFill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
