/* Slideshow-recept van Harbour naar Rome (Swup-demo, MIT): .8 s cubic-bezier(.5,0,.15,1). De beweging zelf staat in study.js (Web Animations);
   hier staan alleen de lagen. Elke laag draagt zijn eigen papierkleur, dus nergens flitst wit of een lege vlak tijdens de wissel. */
:root { --paper:#f4f1e9; }
html[data-theme="dark"] { --paper:#191e1b; color-scheme:dark; }
html,body { margin:0; height:100%; overflow:hidden; background:var(--paper); }
.pages { position:relative; width:100%; height:100%; overflow:hidden; background:var(--paper); }
.page,.route-cache { position:absolute; inset:0; width:100%; height:100%; background:var(--paper); will-change:transform; contain:layout paint; }
iframe { display:block; width:100%; height:100%; border:0; background:var(--paper); }
/* Alleen de eerste pagina van een bezoek komt zacht binnen; wissels binnen de site schuiven al geverfd. */
.pages>.page:only-child>iframe { transition:opacity .28s ease; }
.pages>.page:only-child>iframe:not([data-ready="true"]) { opacity:0; }
@media(prefers-reduced-motion:reduce) { .pages>.page:only-child>iframe { transition:none; } }