/* A single entrance; the existing paintings, masks and layout stay in place. */
#huisjes [data-stay-entrance]{
  --stay-entry-duration:750ms;
  --stay-entry-lift:24px;
  opacity:1;transform:translate3d(0,0,0);
  transition:opacity var(--stay-entry-duration) cubic-bezier(.22,.61,.36,1) var(--stay-entry-delay,0ms),transform var(--stay-entry-duration) cubic-bezier(.22,.61,.36,1) var(--stay-entry-delay,0ms);
}
#huisjes .stay-section__heading[data-stay-entrance]{--stay-entry-duration:600ms;--stay-entry-lift:16px}
@media(prefers-reduced-motion:no-preference){
  #huisjes [data-stay-entrance="pending"]{opacity:0;transform:translate3d(0,var(--stay-entry-lift),0);will-change:opacity,transform}
  #huisjes [data-stay-entrance="revealing"]{will-change:opacity,transform}
}
#huisjes [data-stay-entrance="shown"]{transition:none}
/* Focus never has to wait for an entrance, including a card below the fold. */
#huisjes [data-stay-entrance]:focus-within{opacity:1;transform:none;transition:none}

/* Keep the separator still; only the arrow moves, at the artwork's pace. */
#huisjes{--stay-focus-ink:var(--cobalt,#0756a6)}
[data-theme="night"] #huisjes{--stay-focus-ink:var(--paper,#f3e6c8)}
/* Still and video share one fixed painted window and one zoom transform.
   The slight source bleed keeps their original rectangular edges outside it. */
#huisjes .stay-card__visual{-webkit-mask:var(--stay-card-mask,url(/assets/stays/card-frame-mask.svg)) 0 0/100% 100% no-repeat;mask:var(--stay-card-mask,url(/assets/stays/card-frame-mask.svg)) 0 0/100% 100% no-repeat;transition:transform 650ms cubic-bezier(.22,.61,.36,1)}
#huisjes .stay-card__scene{display:block;position:relative;transform:scale(1.01);transform-origin:center;transition:transform 650ms cubic-bezier(.22,.61,.36,1)}
#huisjes .stay-card__scene>.stay-card__motion{-webkit-mask:none;mask:none}
#huisjes .stay-card__link .stay-card__painting{transform:none;transition:none}
#huisjes .stay-card__link .stay-card__video{transform:translateZ(0);transition:none}
#huisjes .stay-card__arrow,#huisjes .stay-card__link:hover .stay-card__arrow{transform:none;transition:none}
#huisjes .stay-card__arrow svg{transition:transform 650ms cubic-bezier(.22,.61,.36,1)}
#huisjes .stay-card__link:focus-visible{outline:2px solid var(--stay-focus-ink);outline-offset:8px;border-radius:2px}
@media(prefers-reduced-motion:no-preference){
  #huisjes .stay-card__link:focus-visible .stay-card__visual{transform:translateY(-3px)}
  #huisjes .stay-card__link:focus-visible .stay-card__scene{transform:scale(1.03525)}
  #huisjes .stay-card__link:focus-visible .stay-card__arrow svg{transform:translateX(5px)}
  #huisjes .stay-card__link:active .stay-card__visual{transform:translateY(-1px);transition-duration:120ms}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  #huisjes .stay-card__link:hover .stay-card__visual{transform:translateY(-3px)}
  #huisjes .stay-card__link:hover .stay-card__scene{transform:scale(1.03525)}
  #huisjes .stay-card__link:hover .stay-card__arrow svg{transform:translateX(5px)}
}
@media(prefers-reduced-motion:reduce){
  #huisjes [data-stay-entrance]{opacity:1;transform:none;transition:none;will-change:auto}
  #huisjes .stay-card__visual,#huisjes .stay-card__scene,#huisjes .stay-card__painting,#huisjes .stay-card__video,#huisjes .stay-card__arrow svg{transition:none;transform:none}
  #huisjes .stay-card__link:hover .stay-card__painting,#huisjes .stay-card__link:hover .stay-card__video{transform:none}
}
