/* Intro bij het eerste bezoek aan de homepage: NIRI tekent zich, de astronaut landt en wordt de hero. */
html.intro-launch body{overflow:hidden}
html.intro-launch .site-header,html.intro-launch .hero-top,html.intro-launch .hero-copy,html.intro-launch .hero-project-link,html.intro-launch .hero-bottom,html.intro-launch .hero-spark{opacity:0;translate:0 14px}
html.intro-launch .hero-wordmark{animation:launch-word 1s cubic-bezier(.7,0,.2,1) .15s both}
html.intro-launch .hero-mascot{animation:launch-mascot 1.25s cubic-bezier(.2,.9,.25,1.08) .55s both}
html.intro-reveal .site-header,html.intro-reveal .hero-top,html.intro-reveal .hero-copy,html.intro-reveal .hero-project-link,html.intro-reveal .hero-bottom,html.intro-reveal .hero-spark{transition:opacity .8s cubic-bezier(.2,.8,.2,1),translate .8s cubic-bezier(.2,.8,.2,1)}
@keyframes launch-word{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes launch-mascot{from{translate:0 75vh;opacity:0}40%{opacity:1}to{translate:0 0;opacity:1}}
@keyframes intro-fade{to{opacity:1}}
.intro-catcher{position:fixed;inset:0;z-index:9999;cursor:pointer}
.intro-hint{position:fixed;left:50%;bottom:26px;translate:-50% 0;z-index:10000;font:700 10px/1 var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);white-space:nowrap;opacity:0;animation:intro-fade .6s .4s forwards;pointer-events:none}
.launch-counter{position:fixed;right:var(--gutter);bottom:34px;z-index:10000;display:flex;align-items:baseline;gap:10px;font-family:var(--font);pointer-events:none;transition:opacity .5s,translate .5s}
.launch-counter b{font-size:clamp(44px,6vw,84px);font-weight:500;letter-spacing:-.06em;line-height:1;font-variant-numeric:tabular-nums}
.launch-counter small{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.launch-counter.is-done{opacity:0;translate:0 10px}
@media(max-width:760px){.launch-counter{bottom:60px}}