:root{--font-sans: "Fredoka", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;--step--1: clamp(12px, .8vw, 14px);--step-0: clamp(14px, 1vw, 16px);--step-1: clamp(18px, 1.6vw, 22px);--step-2: clamp(22px, 2.2vw, 28px);--step-3: clamp(28px, 3.2vw, 36px);--step-4: clamp(36px, 4.6vw, 48px)}html,body{font-family:var(--font-sans);font-size:var(--step-0);line-height:1.6}.typo-display{font-size:var(--step-4);font-weight:700;line-height:1.15;letter-spacing:.2px}.typo-h1{font-size:var(--step-3);font-weight:700;line-height:1.2}.typo-h2{font-size:var(--step-2);font-weight:600;line-height:1.25}.typo-lead{font-size:var(--step-1);font-weight:400;color:#cfd6e4}.typo-body{font-size:var(--step-0);font-weight:400}.typo-small{font-size:var(--step--1);color:#9aa0a6}.typo-nav{font-size:var(--step-1);font-weight:700;letter-spacing:.2px}.typo-button{font-size:var(--step-0);font-weight:700;letter-spacing:.2px}:root{--sloganSize: clamp(28px, 6vw, 28px);--sloganTop: 15%;--sloganLineGap: .4em;--sloganLines: 3;--sloganLineH: 1em;--sloganReserve: calc( var(--sloganLines) * var(--sloganLineH) + (var(--sloganLines) - 1) * var(--sloganLineGap) );--stackTop: var(--sloganTop);--stackGap: 24px;--b2-left: 25%;--b2-top: 57%;--b2-pos: translate(-100%, -50%);--b3-left: 75%;--b3-top: 57%;--b3-pos: translate(0, -50%)}.hero{position:relative;width:100vw;height:100dvh;overflow:hidden}.needle{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}.home-hero-overlay{position:relative;z-index:2;min-height:100dvh;font-family:Fredoka,system-ui,sans-serif;pointer-events:none;font-size:calc(var(--sloganSize) * var(--mobileScale, 1))}.home-hero-overlay .keytext,.home-hero-overlay .block-1,.home-hero-overlay .block-2,.home-hero-overlay .block-3{font-size:inherit!important;line-height:1}.home-hero-overlay .keytext>*,.home-hero-overlay .keytext span{font-size:inherit!important;line-height:inherit!important}html[data-slogan-hold] .home-hero-overlay .keytext{opacity:0;transform:translateY(6px)}html[data-transitioning] .logo{pointer-events:none;opacity:.72}html[data-transitioning][data-route=interaction] main.content,html[data-transitioning][data-route=visualisation] main.content{opacity:0;pointer-events:none}.u-fade-slide{opacity:1;transform:translateY(0);transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1);will-change:opacity,transform}.u-fade-slide.is-hidden,.u-fade-slide[data-anim-hidden]{opacity:0;transform:translateY(10px);pointer-events:none}@media (prefers-reduced-motion: reduce){.u-fade-slide{transition:opacity .2s ease;transform:none!important}.u-fade-slide.is-hidden,.u-fade-slide[data-anim-hidden]{transform:none!important}}.route-hero{position:relative;width:100vw;min-height:100dvh;display:grid;place-items:center;overflow:hidden}.route-title{padding:2rem clamp(12px,2vw,24px);text-align:center}.route-title h1{margin:0}.route-title--center{display:grid;place-items:center;min-height:70vh}.slogan-stack{position:absolute;left:50%;top:var(--stackTop);transform:translate(-50%);display:flex;flex-direction:column;align-items:center;pointer-events:none;transition:top .45s cubic-bezier(.2,.7,.2,1),transform .45s cubic-bezier(.2,.7,.2,1);will-change:top,transform}.slogan-stack .keytext{text-align:center;color:#c8dbff;font-weight:600;display:inline-flex;flex-direction:column;align-items:center;gap:var(--sloganLineGap);pointer-events:none;min-height:var(--sloganReserve);justify-content:center}.slogan-stack .keytext .l1,.slogan-stack .keytext .l2,.slogan-stack .keytext .l3{margin:0;font-weight:300;line-height:1;white-space:nowrap}.block-1{transform:var(--fx);text-align:center;white-space:nowrap;color:#faeacf;font-weight:300;pointer-events:auto;margin-top:var(--stackGap);transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1),margin-top .45s cubic-bezier(.2,.7,.2,1)}.hover-block,.hover-block *,.block-link,.block-link *{cursor:pointer}.hover-block{pointer-events:auto;-webkit-user-select:none;user-select:none}.fancy-word{position:relative;display:inline-block;color:#eb95ba;font-weight:500;letter-spacing:var(--track, 0em);transition:letter-spacing .25s ease}.fancy-word .base{font-variation-settings:"wght" 600;font-weight:600;color:transparent;-webkit-text-stroke:0 transparent;font-kerning:none;font-feature-settings:"kern" 0,"liga" 0,"clig" 0}.fancy-word .anim{position:absolute;inset:0;white-space:nowrap;color:currentColor;font-variation-settings:"wght" 500;font-weight:500;pointer-events:none;transition:font-variation-settings .25s ease;font-kerning:none;font-feature-settings:"kern" 0,"liga" 0,"clig" 0}.rest{transition:color .25s ease}.hover-block:hover .fancy-word .anim,.hover-block:has(.block-link:hover) .fancy-word .anim{font-variation-settings:"wght" 600;color:#f07baf}.hover-block:hover .rest,.hover-block:has(.block-link:hover) .rest{color:#fff}.no-has .hover-block:hover .fancy-word .anim{font-variation-settings:"wght" 600;color:#f07baf}.no-has .hover-block:hover .rest{color:#fff}.block-1,.block-2,.block-3{--fx: translateY(0) scale(1);transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1);color:#faeacf;font-weight:300;white-space:nowrap}.block-2{position:absolute;left:var(--b2-left);top:var(--b2-top);--pos: var(--b2-pos);transform:var(--pos) var(--fx);text-align:right;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1),left .45s cubic-bezier(.2,.7,.2,1),top .45s cubic-bezier(.2,.7,.2,1)}.block-2 .line{display:block}.block-3{position:absolute;left:var(--b3-left);top:var(--b3-top);--pos: var(--b3-pos);transform:var(--pos) var(--fx);text-align:left;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1),left .45s cubic-bezier(.2,.7,.2,1),top .45s cubic-bezier(.2,.7,.2,1)}.block-3 .line{display:block}html[data-blocks-hold] .block-1,html[data-blocks-hold] .block-2,html[data-blocks-hold] .block-3{opacity:0;--fx: translateY(6px) scale(.98);pointer-events:none}html:not([data-blocks-hold]) .block-1,html:not([data-blocks-hold]) .block-2,html:not([data-blocks-hold]) .block-3{opacity:1;--fx: translateY(0) scale(1)}@media (max-aspect-ratio: 1/1),(orientation: portrait){:root{--mobileScale: .8;--mobileTopPad: 50px;--stackTop: calc( var(--headerTop, 0px) + env(safe-area-inset-top, 0px) + var(--mobileTopPad) );--sloganSize: clamp(13px, 5.2vw, 18px);--stackGap: 30px;--sloganLineGap: 6px;--b1-h: 20px;--b2-offset: 20px;--b3-offset: 40px;--b2-left: 50%;--b3-left: 50%;--b2-pos: translate(-50%, 0);--b3-pos: translate(-50%, 0);--b2-top: calc( var(--stackTop) + var(--sloganReserve) + var(--stackGap) + var(--b1-h) + var(--b2-offset) );--b3-top: calc( var(--b2-top) + var(--b3-offset) )}.slogan-stack{transform:translate(-50%)!important}.block-2,.block-3{white-space:nowrap;text-align:center}.block-2 .line,.block-3 .line{display:inline}.block-2 .line:last-child,.block-3 .line:last-child{display:none}.block-2 .rest{margin-right:.25em}.block-2 .rest:before{content:"< "}.block-2 .block-link:after{content:" projects"}.block-3 .block-link:after{content:" projects >"}.no-has .hover-block:hover .rest,.hover-block:hover .rest{color:#fff}.home-hero-overlay{pointer-events:none}}@media (prefers-reduced-motion: reduce){.fancy-word .anim,.slogan-stack{transition:none!important}.block-1,.block-2,.block-3{transition:opacity .2s linear!important}}:root{--edgeRadius: 12px;--edgePadX: clamp(12px, 2vw, 24px);--headerTop: calc(env(safe-area-inset-top, 0px) + 18px) ;--brandSize: 54px}@media (max-aspect-ratio: 1/1),(orientation: portrait){:root{--brandSize: 46px}}@media (min-aspect-ratio: 1001/1000){:root{--brandSize: 54px}}html,body{height:100%;margin:0;background:#152240;color:#eaeaea}a{color:inherit;text-decoration:none}#needleStage{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}#needleStage .needle{display:block;width:100%;height:100%;border:0}html[data-slogan-hold] .home-hero-overlay>.keytext{visibility:hidden}.logo,#menuBtn,.logo *,#menuBtn *{cursor:pointer}.topbar{position:fixed;inset-inline:0;top:var(--headerTop);z-index:1000;display:flex;align-items:center;justify-content:space-between;gap:12px;height:var(--brandSize);padding-inline:var(--edgePadX);background:transparent;pointer-events:auto}.menu,main.content{position:relative;z-index:1;pointer-events:auto}.logo{position:relative;z-index:2;display:inline-block}.edge-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--brandSize);height:var(--brandSize);padding:0;background:transparent;border:1px solid transparent;border-radius:var(--edgeRadius)}.edge-btn:focus-visible{outline:3px solid #ffd166;outline-offset:3px}.menu-icon{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.fancy-lock{position:relative;display:inline-block;line-height:1.1;font-size:var(--brandSize);transform:rotate(var(--rot, 0deg)) scaleY(.95);transform-origin:bottom left;pointer-events:auto}.fancy-lock .base{color:transparent;-webkit-text-stroke:0 transparent;user-select:none;font-family:Fredoka,system-ui,sans-serif;font-variation-settings:"wght" 600;font-weight:600}.fancy-lock .anim{position:absolute;inset:0;display:inline-flex;align-items:baseline;white-space:nowrap;color:#eb95ba;pointer-events:none;font-family:Fredoka,system-ui,sans-serif}.fancy-lock .anim .ch{display:block;font-variation-settings:"wght" 600;font-weight:600;transition:font-variation-settings .4s ease,color .2s ease}.fancy-lock:hover .anim .ch{font-variation-settings:"wght" 700;font-weight:700;color:#f07baf}.fancy-lock:hover .anim .ch:nth-child(1){transition-delay:.12s}.fancy-lock:hover .anim .ch:nth-child(2){transition-delay:0ms}.fancy-lock:hover .anim .ch:nth-child(3){transition-delay:.12s}.fancy-lock:not(:hover) .anim .ch{transition-delay:0ms}.fancy-lock.rot-90ccw{--rot: -90deg;transform-origin:center}
