:root{--banana-home-header-offset:calc(var(--header-height) + .65rem);--banana-home-bg-glow-a:color-mix(in srgb, var(--color-accent), transparent 72%);--banana-home-bg-glow-b:color-mix(in srgb, var(--color-accent), transparent 78%);--banana-home-bg-start:color-mix(in srgb, var(--color-bg), white 30%);--banana-home-bg-end:color-mix(in srgb, var(--color-bg), var(--color-accent) 10%);--banana-home-letter-shadow:0 12px 28px #1d180821;--banana-home-letter-shadow-mobile:0 5px 12px #1d18081a}:root[data-theme=dark]{--banana-home-bg-glow-a:color-mix(in srgb, var(--color-accent), transparent 86%);--banana-home-bg-glow-b:color-mix(in srgb, var(--color-accent), transparent 90%);--banana-home-bg-start:color-mix(in srgb, var(--color-bg), white 8%);--banana-home-bg-end:color-mix(in srgb, var(--color-bg), black 8%);--banana-home-letter-shadow:0 14px 30px #00000085;--banana-home-letter-shadow-mobile:0 6px 14px #0000006b}html,body{width:100%;min-height:100%}body{background:radial-gradient(circle at 10% 12%, var(--banana-home-bg-glow-a), transparent 42%), radial-gradient(circle at 78% 90%, var(--banana-home-bg-glow-b), transparent 48%), linear-gradient(180deg, var(--banana-home-bg-start) 0%, var(--banana-home-bg-end) 100%);color:var(--color-text)}.banana-home-page{width:100%}.intro-hero{width:100vw;height:100vh;min-height:100vh;margin-top:calc(var(--banana-home-header-offset) * -1);place-items:center;padding:clamp(.75rem,2.5vw,2rem);display:grid;overflow:hidden}.stage-stack{justify-items:center;display:grid}.word-wrap{place-items:center;width:min(100%,96vw);min-height:clamp(13rem,55vh,34rem);display:grid}.lockup{--slot:clamp(2.2rem, 8.8vw, 6.9rem);--banana-gap:clamp(.2rem, 1.05vw, .78rem);--word-gap:clamp(3rem, 6vw, 5rem);--step:calc(var(--slot) + var(--banana-gap));--walk-dur:1.88s;--look-start:2.55s;--look-dur:.72s;--swap-start:3.56s;--swap-dur:1.18s;--settle-start:4.94s;--settle-dur:.65s;--push-start:6.25s;--push-dur:2.35s;--tagline-start:calc(var(--push-start) + var(--push-dur) + 30ms);--final-right-edge:100%;--banana-push-distance:clamp(3.8rem, 8.2vw, 8.9rem);--web-entry-distance:clamp(17rem, 43vw, 42rem);--ease-walk:cubic-bezier(.18, .92, .24, 1.28);--ease-look:cubic-bezier(.31, .08, .19, 1);--ease-swap:cubic-bezier(.23, .98, .33, 1);--ease-settle:cubic-bezier(.16, .82, .24, 1.14);--ease-push:cubic-bezier(.22, .84, .27, 1);--ease-web:cubic-bezier(.2, .88, .3, 1);user-select:none;pointer-events:none;justify-content:center;align-items:flex-end;display:inline-flex;position:relative}.banana-track{will-change:transform;transform-origin:50% 72%;animation:banana-slide var(--push-dur) var(--ease-push) var(--push-start) forwards}.banana-word{align-items:flex-end;gap:var(--banana-gap);will-change:transform;transform-origin:50% 72%;animation:banana-resist var(--push-dur) var(--ease-push) var(--push-start) forwards;display:flex}.letter{opacity:0;transform-origin:50% 74%;font-variation-settings:"wght" 790;letter-spacing:-.055em;color:var(--color-text);text-shadow:var(--banana-home-letter-shadow);will-change:transform;animation:letter-appear 1ms step-end var(--walk-delay,0s) forwards, walk-in var(--walk-dur) var(--ease-walk) var(--walk-delay,0s) forwards, look-around var(--look-dur) var(--ease-look) calc(var(--look-start) + var(--look-delay,0s)) forwards, final-settle var(--settle-dur) var(--ease-settle) calc(var(--settle-start) + var(--look-delay,0s)) forwards;flex:none;place-items:center;font-family:Satoshi,Avenir Next,Segoe UI,sans-serif;font-size:clamp(3.55rem,12.8vw,11.8rem);font-weight:790;line-height:.76;display:inline-grid;position:relative}.n-swap,.b-swap{animation:letter-appear 1ms step-end var(--walk-delay,0s) forwards, walk-in var(--walk-dur) var(--ease-walk) var(--walk-delay,0s) forwards, look-around var(--look-dur) var(--ease-look) calc(var(--look-start) + var(--look-delay,0s)) forwards, var(--swap-name) var(--swap-dur) var(--ease-swap) var(--swap-start) forwards, final-settle var(--settle-dur) var(--ease-settle) var(--settle-start) forwards;--final-x:0px}.n-swap{--swap-name:swap-n;--swap-delta:var(--swap-distance,calc(var(--step) * 2));--final-x:var(--swap-delta)}.b-swap{--swap-name:swap-b;--swap-delta:calc(var(--swap-distance,calc(var(--step) * 2)) * -1);--final-x:var(--swap-delta)}.glyph{grid-area:1/1;transition:opacity 80ms linear}.n-swap .glyph-upper{opacity:1;animation:n-upper var(--swap-dur) steps(1, end) var(--swap-start) forwards}.n-swap .glyph-lower{opacity:0;animation:n-lower var(--swap-dur) steps(1, end) var(--swap-start) forwards}.b-swap .glyph-lower{opacity:1;animation:b-lower var(--swap-dur) steps(1, end) var(--swap-start) forwards}.b-swap .glyph-upper{opacity:0;animation:b-upper var(--swap-dur) steps(1, end) var(--swap-start) forwards}.web-track{left:calc(100% + var(--word-gap));transform:translateX(var(--web-entry-distance));will-change:transform;transform-origin:0 72%;animation:web-drive var(--push-dur) var(--ease-web) var(--push-start) forwards;position:absolute;bottom:0}.web-word{align-items:flex-end;gap:var(--banana-gap);will-change:transform;transform-origin:0 72%;animation:web-struggle var(--push-dur) var(--ease-push) var(--push-start) forwards;display:flex}.web-letter{transform-origin:50% 74%;font-variation-settings:"wght" 790;letter-spacing:-.055em;color:var(--color-text);text-shadow:var(--banana-home-letter-shadow);will-change:transform;animation:web-step .54s cubic-bezier(.2, .9, .22, 1.2) calc(var(--push-start) + var(--effort-delay,0s)) 3 both;font-family:Satoshi,Avenir Next,Segoe UI,sans-serif;font-size:clamp(3.55rem,12.8vw,11.8rem);font-weight:790;line-height:.76;display:inline-block}.studio-tagline{left:var(--final-right-edge);font-variation-settings:"wght" 560;letter-spacing:.02em;color:color-mix(in srgb, var(--color-text), transparent 12%);white-space:nowrap;text-align:right;opacity:0;animation:tagline-reveal .32s cubic-bezier(.2, .82, .26, 1) var(--tagline-start) forwards;font-family:Satoshi,Avenir Next,Segoe UI,sans-serif;font-size:clamp(.98rem,1.92vw,1.8rem);font-weight:590;line-height:1.2;position:absolute;top:calc(100% + clamp(.25rem,.85vw,.74rem));transform:translate(-100%,.42em)}html.intro-running,html.intro-running body{overflow:hidden}html.intro-running,html.intro-running *,html.intro-running :before,html.intro-running :after{cursor:none!important}[data-site-header] .header-row{opacity:1;will-change:opacity, transform;transition:opacity .5s cubic-bezier(.22,.84,.27,1),transform .5s cubic-bezier(.22,.84,.27,1);transform:translateY(0)}html.intro-running [data-site-header] .header-row{opacity:0;pointer-events:none;transform:translateY(-1.2rem)}html.intro-complete [data-site-header] .header-row{animation:.62s cubic-bezier(.22,.84,.27,1) 80ms both banana-home-header-reveal}[data-site-footer],[data-home-reveal]{opacity:1;transition:opacity .56s cubic-bezier(.22,.84,.27,1),transform .56s cubic-bezier(.22,.84,.27,1);transform:translateY(0)}html.intro-running [data-site-footer],html.intro-running [data-home-reveal]{opacity:0;pointer-events:none;transform:translateY(1.4rem)}@keyframes letter-appear{0%{opacity:0}to{opacity:1}}@keyframes banana-home-header-reveal{0%{opacity:0;transform:translateY(-1.2rem)}to{opacity:1;transform:translateY(0)}}@keyframes walk-in{0%{transform:translate(var(--from-x), var(--from-y)) rotate(var(--from-r)) scale(.68, 1.2)}26%{transform:translate(calc(var(--from-x) * .4), calc(var(--from-y) * .4)) rotate(calc(var(--from-r) * -.2)) scale(1.16, .84)}48%{transform:translate(calc(var(--from-x) * .08), calc(var(--from-y) * .08)) rotate(calc(var(--from-r) * -.12)) scale(.91, 1.1)}66%{transform:translate(.09em, -.17em) rotate(calc(var(--from-r) * -.1)) scale(1.06, .94)}82%{transform:translate(-.07em, .09em) rotate(calc(var(--from-r) * .05)) scale(.98, 1.03)}to{transform:translate(0)rotate(0)scale(1)}}@keyframes look-around{0%,to{transform:translate(0)rotate(0)scale(1)}36%{transform:translate(var(--look-x), var(--look-y)) rotate(var(--look-r)) scale(1.02, .99)}67%{transform:translate(var(--look-x-back), var(--look-y-back)) rotate(var(--look-r-back)) scale(.99, 1.02)}}@keyframes swap-n{0%,8%{transform:translate(0)rotate(0)scale(1)}48%{transform:translate(calc(var(--swap-delta) * .29), calc(var(--slot) * -.45)) rotate(-12deg) scale(1.05, .93)}66%{transform:translate(calc(var(--swap-delta) * .67), calc(var(--slot) * -.26)) rotate(-4deg) scale(.94, 1.05)}84%{transform:translate(calc(var(--swap-delta) * 1.04), calc(var(--slot) * -.07)) rotate(4deg) scale(1.02, .98)}to{transform:translate(var(--swap-delta), 0) rotate(0deg) scale(1, 1)}}@keyframes swap-b{0%,8%{transform:translate(0)rotate(0)scale(1)}44%{transform:translate(calc(var(--swap-delta) * .28), calc(var(--slot) * .4)) rotate(12deg) scale(1.06, .93)}66%{transform:translate(calc(var(--swap-delta) * .67), calc(var(--slot) * .25)) rotate(5deg) scale(.94, 1.05)}84%{transform:translate(calc(var(--swap-delta) * 1.04), calc(var(--slot) * .05)) rotate(-4deg) scale(1.02, .98)}to{transform:translate(var(--swap-delta), 0) rotate(0deg) scale(1, 1)}}@keyframes final-settle{0%{transform:translate(var(--final-x), 0) rotate(0deg) scale(1, 1)}36%{transform:translate(var(--final-x), calc(var(--slot) * .11)) rotate(0deg) scale(1.07, .88)}58%{transform:translate(var(--final-x), calc(var(--slot) * -.045)) rotate(0deg) scale(.95, 1.06)}77%{transform:translate(var(--final-x), calc(var(--slot) * .03)) rotate(0deg) scale(1.03, .96)}to{transform:translate(var(--final-x), 0) rotate(0deg) scale(1, 1)}}@keyframes banana-slide{0%,14%{transform:translate(0)rotate(0)}30%{transform:translateX(calc(var(--banana-push-distance) * .06)) rotate(.8deg)}47%{transform:translateX(calc(var(--banana-push-distance) * -.56)) rotate(-1.25deg)}66%{transform:translateX(calc(var(--banana-push-distance) * -.88)) rotate(-.95deg)}82%{transform:translateX(calc(var(--banana-push-distance) * -1.08)) rotate(-.35deg)}to{transform:translateX(calc(var(--banana-push-distance) * -1)) rotate(0deg)}}@keyframes banana-resist{0%,12%{transform:rotate(0)skew(0)scale(1)}29%{transform:rotate(-1.25deg)skew(-2deg)scale(.99,1.02)}48%{transform:rotate(.9deg)skew(1.6deg)scale(1.015,.985)}71%{transform:rotate(-.4deg)skew(-.75deg)scale(.995,1.005)}to{transform:rotate(0)skew(0)scale(1)}}@keyframes web-drive{0%{transform:translateX(var(--web-entry-distance)) rotate(-9deg) scale(.9, 1.08)}22%{transform:translateX(calc(var(--banana-push-distance) * .42)) rotate(-4deg) scale(1.02, .98)}42%{transform:translateX(calc(var(--banana-push-distance) * -.16)) rotate(2.8deg) scale(1.05, .95)}61%{transform:translateX(calc(var(--banana-push-distance) * -.92)) rotate(-1.6deg) scale(.98, 1.03)}79%{transform:translateX(calc(var(--banana-push-distance) * -1.1)) rotate(.8deg) scale(1.02, .99)}to{transform:translateX(calc(var(--banana-push-distance) * -1)) rotate(0deg) scale(1, 1)}}@keyframes web-struggle{0%,14%{transform:rotate(0)scale(1)}32%{transform:rotate(-1.8deg)scale(1.05,.96)}50%{transform:rotate(1.5deg)scale(.98,1.03)}74%{transform:rotate(-.55deg)scale(1.01,.99)}to{transform:rotate(0)scale(1)}}@keyframes web-step{0%,to{transform:translateY(0)rotate(0)}45%{transform:translateY(calc(var(--slot) * -.055)) rotate(-2.2deg)}70%{transform:translateY(calc(var(--slot) * .03)) rotate(1deg)}}@keyframes tagline-reveal{0%{opacity:0;transform:translate(-100%,.42em)}to{opacity:1;transform:translate(-100%)}}@keyframes n-upper{0%,82%{opacity:1}82.01%,to{opacity:0}}@keyframes n-lower{0%,82%{opacity:0}82.01%,to{opacity:1}}@keyframes b-lower{0%,42%{opacity:1}42.01%,to{opacity:0}}@keyframes b-upper{0%,42%{opacity:0}42.01%,to{opacity:1}}@media (width<=960px){[data-site-header]{visibility:visible}[data-site-header] .header-row{opacity:1;will-change:auto;transition:none;animation:none;transform:none}html.intro-running [data-site-header]{visibility:hidden;pointer-events:none}html.intro-running [data-site-header] .header-row,html.intro-complete [data-site-header] .header-row{opacity:1;transform:none}html.intro-complete [data-site-header]{visibility:visible;pointer-events:auto}}@media (width<=640px){.lockup{--slot:clamp(1.7rem, 8.7vw, 3.4rem);--banana-gap:clamp(.06rem, .7vw, .22rem);--word-gap:clamp(.9rem, 6vw, 3rem)}.letter,.web-letter{text-shadow:var(--banana-home-letter-shadow-mobile);font-size:clamp(2.05rem,13vw,4.4rem)}.studio-tagline{font-size:clamp(.72rem,3.6vw,1.12rem)}.word-wrap{min-height:clamp(9rem,39vh,18rem)}}@media (prefers-reduced-motion:reduce){[data-site-header] .header-row{transition:none}.letter,.glyph,.banana-track,.banana-word,.web-track,.web-word,.web-letter,.studio-tagline{transition:none!important;animation:none!important}.letter{opacity:1}.n-swap,.b-swap{transform:translate(var(--swap-delta), 0)}.n-swap .glyph-upper,.b-swap .glyph-lower{opacity:0}.n-swap .glyph-lower,.b-swap .glyph-upper{opacity:1}.banana-track,.web-track{transform:translateX(calc(var(--banana-push-distance) * -1))}.studio-tagline{opacity:1;transform:translate(-100%)}}
