.art-direction-hero .sculpture-stage{height:clamp(650px,48vw,820px)}.hero .direction-statement{font-size:clamp(76px,8.6vw,165px);font-weight:700;line-height:.85;letter-spacing:-.075em}.statement-left{top:95px;width:46%;left:0}.statement-left>span,.statement-right>span{display:block;white-space:nowrap}.statement-left>span:last-child{text-align:right;padding-right:.08em;margin-top:10px}.direction-statement .statement-right{top:300px;bottom:auto;left:58%;right:0;padding-inline-end:.075em}.statement-right>span:first-child{text-align:left}.statement-right>span:last-child{text-align:right;margin-top:10px}.character-scene{position:absolute;left:50%;top:53%;translate:-50% -50%;width:clamp(280px,30vw,460px);height:540px;z-index:3}#designer-character{display:block;width:100%;height:100%;outline:none;touch-action:pan-y}#designer-character:focus-visible{outline:1px dashed var(--ink);outline-offset:5px}.character-fallback{position:absolute;inset:8% 25%;width:50%;height:80%;object-fit:contain;display:none}.character-scene.unavailable .character-fallback{display:block}.character-hint{position:absolute;bottom:4px;left:0;right:0;text-align:center;font-size:7px;letter-spacing:1px;pointer-events:none;color:var(--muted)}.art-hero-intro{bottom:26px}.art-hero-cta{bottom:32px}@media(min-width:1700px){.hero .direction-statement{font-size:165px}.character-scene{height:630px}.direction-statement .statement-right{top:350px}}@media(max-width:1100px){.hero .direction-statement{font-size:9.1vw}.character-scene{width:310px;height:490px}.direction-statement .statement-right{top:300px;left:58%}}@media(max-width:650px){.art-direction-hero .sculpture-stage{height:770px}.hero .direction-statement{font-size:14vw;line-height:.9}.statement-left{top:88px;width:62%}.direction-statement .statement-right{top:440px;left:36%;bottom:auto}.character-scene{top:335px;width:280px;height:365px;left:50%}.statement-left>span:last-child{margin-top:5px}.statement-right>span:last-child{margin-top:5px}.character-hint{bottom:8px;font-size:6px}.art-hero-intro{bottom:106px}.art-hero-cta{bottom:39px}.art-hero-location{bottom:7px}}@media(prefers-reduced-motion:reduce){.character-hint{display:none}}

.character-scene{perspective:1000px}#designer-character{overflow:visible;transform:rotateY(var(--turn,0deg));transition:transform .4s ease;filter:drop-shadow(10px 15px 0 rgba(11,48,245,.06));height:92%;width:100%;margin-top:2%;cursor:pointer}.character-pen{transform-box:view-box;transform-origin:350px 860px;transition:transform .65s cubic-bezier(.22,.8,.3,1)}#designer-character:hover .character-pen,#designer-character:focus .character-pen,#designer-character.thinking .character-pen{transform:rotate(-18deg) translate(25px,-30px)}@media(prefers-reduced-motion:reduce){#designer-character,.character-pen{transition:none;transform:none!important}}
.character-scene{height:560px}.character-figure#designer-character{position:absolute;inset:15px 0 30px;height:auto;margin:0;width:100%;transform-style:preserve-3d;filter:none;transition:none}.character-render{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.thinking-scribble{position:absolute;left:50%;top:-18px;translate:-50% 0;width:120px;height:55px;overflow:visible;transition:opacity .3s,transform .4s;pointer-events:none;color:var(--accent);transform:translateZ(40px)}.thinking-scribble path{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-dasharray:55 12 80 8;transform-box:fill-box;transform-origin:center;animation:thought-loop 2.7s linear infinite,thought-sway 2.7s ease-in-out infinite alternate}.is-smiling .thinking-scribble{opacity:0;transform:translateY(-12px) scale(.8)}@keyframes thought-loop{to{stroke-dashoffset:-310}}@keyframes thought-sway{from{rotate:-2.5deg}to{rotate:2.5deg}}@media(max-width:650px){.character-scene{height:365px}.thinking-scribble{width:85px;top:-13px}}@media(prefers-reduced-motion:reduce){.thinking-scribble path{animation:none}.thinking-scribble{transition:none}}

@font-face{font-family:'Ballet';font-style:normal;font-weight:400;font-display:swap;src:url('ballet.ttf') format('truetype')}.art-hero-eyebrow{font-family:'Ballet',cursive;font-style:normal;font-weight:400;font-size:clamp(30px,3.1vw,46px);line-height:1.15;letter-spacing:0;text-transform:none;font-optical-sizing:auto;top:21px;padding-right:12px}@media(max-width:650px){.art-hero-eyebrow{font-size:30px;top:25px}}
.character-scene{isolation:isolate}.character-figure#designer-character{z-index:2}.thinking-scribble{z-index:5}.character-hint{z-index:5}.skill-orbit-letter{position:absolute;display:block;pointer-events:none;font-family:Arial,Helvetica,sans-serif;font-size:11px;font-weight:600;letter-spacing:0;line-height:1;color:var(--accent);will-change:transform;user-select:none}@media(max-width:650px){.skill-orbit-letter{font-size:9px}}
.skill-orbit-webgl{position:absolute;left:50%;top:54%;translate:-50% -50%;width:160%;height:400px;pointer-events:none}.orbit-back{z-index:1}.orbit-front{z-index:4}@media(max-width:650px){.skill-orbit-webgl{width:140%;height:280px}}

.skill-orbit-webgl{top:61%}
.hero .reveal-statement{color:var(--ink);mask-image:linear-gradient(transparent,transparent);-webkit-mask-image:linear-gradient(transparent,transparent)}.direction-statement{mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat}.revealed-word{display:inline-block;transform-origin:left center}.statement-left>span:last-child .revealed-word,.statement-right>span:last-child .revealed-word{transform-origin:right center}

.hero .reveal-statement{color:var(--hero-reveal,var(--ink))}

.art-hero-cta{border-radius:9999px;background:var(--accent);color:var(--on-accent);border:1px solid var(--accent);padding:17px 22px;gap:18px;box-shadow:0 5px 0 color-mix(in srgb,var(--accent) 65%,var(--ink));font-weight:700;transition:transform .2s,box-shadow .2s,background .2s}.art-hero-cta .work-cta-label{font-size:16px}.work-cta-eyes{display:block;width:48px;height:32px;flex-shrink:0}.work-cta-eyes img{display:block;width:100%;height:100%;object-fit:contain}.art-hero-cta:hover{background:var(--accent);color:var(--on-accent);transform:translateY(-2px);box-shadow:0 7px 0 color-mix(in srgb,var(--accent) 65%,var(--ink))}.art-hero-cta:active{transform:translateY(4px);box-shadow:0 1px 0 color-mix(in srgb,var(--accent) 65%,var(--ink))}@media(max-width:650px){.art-hero-cta{padding:12px 18px;gap:14px}.art-hero-cta .work-cta-label{font-size:16px}.work-cta-eyes{width:39px;height:26px}}@media(prefers-reduced-motion:reduce){.art-hero-cta{transition:none}}

/* A fixed height and half-height radius keep both end caps circular. */
.art-direction-hero .art-hero-cta{box-sizing:border-box;height:64px;min-height:64px;width:max-content;max-width:100%;padding:0 32px;border-radius:32px;gap:16px;justify-content:center;line-height:1;box-shadow:none;white-space:nowrap}.art-direction-hero .art-hero-cta .work-cta-label{display:block;line-height:1;flex-shrink:0}.art-direction-hero .art-hero-cta:hover{box-shadow:none}.art-direction-hero .art-hero-cta:active{transform:translateY(1px);box-shadow:none}@media(max-width:650px){.art-direction-hero .art-hero-cta{height:56px;min-height:56px;border-radius:28px;padding:0 28px;gap:14px}}

#kuopio-time{font-variant-numeric:tabular-nums;white-space:nowrap;min-width:5ch}

.art-direction-hero .art-hero-cta{padding-right:20px}@media(max-width:650px){.art-direction-hero .art-hero-cta{padding-right:18px}}

/* Include the final glyph bearing when fitting tightly tracked reveal text. */
.revealed-word{padding-inline-end:.18em}

html[lang=fi] .revealed-word{letter-spacing:-.075em}

/* Give CLEAR breathing room beside the hero silhouette; match both text layers. */
@media(min-width:651px){.hero .direction-statement .statement-left>span:last-child{padding-right:clamp(38px,4.5vw,78px)}}

/* Let the wide-screen composition grow beyond the laptop typography cap. */
@media(min-width:1600px){
 .hero .direction-statement{font-size:165px}
 .hero .direction-statement .statement-right{top:32%;left:58%}
 .character-scene{width:clamp(460px,24vw,560px);height:clamp(560px,30vw,650px)}
 .art-hero-eyebrow{font-size:clamp(46px,2.4vw,64px)}
 .art-direction-hero .sculpture-stage .art-hero-intro{max-width:400px}
 .art-hero-intro p{font-size:clamp(16px,1.05vw,20px);line-height:1.5}
}

/* Above 1920px, use 81% of the original proportional heading size. */
@media(min-width:1921px){.hero .direction-statement{font-size:6.9609375vw}}