/* A human stepping out of the product system. */
.hero-stage{grid-template-columns:330px minmax(0,1fr);gap:44px;padding:12px 0 48px}
.hero-character{position:relative;isolation:isolate;width:330px;animation:none;perspective:900px;transform:translate3d(var(--character-x,0px),var(--character-y,0px),0) rotate(var(--character-turn,0deg));transition:transform .65s cubic-bezier(.22,1,.36,1)}
.character-portal{position:absolute;z-index:-2;inset:13% 7% 12%;overflow:hidden;border-radius:48% 48% 12px 12px;border:1px solid #d5c8ae55;background:radial-gradient(ellipse at 50% 45%,#d5c8ae2a,transparent 75%),linear-gradient(150deg,#333633,#1a1e20);box-shadow:inset 0 0 40px #d5c8ae0a,0 24px 64px #00000024;animation:portal-open 1.1s cubic-bezier(.22,1,.36,1) both}
.character-portal:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#d5c8ae55 .8px,transparent .8px);background-size:19px 19px;opacity:.4;mask-image:linear-gradient(transparent,#000)}
.character-portal:after{content:"";position:absolute;inset:8px;border:1px solid #d5c8ae18;border-radius:inherit}
.portal-orbit{position:absolute;inset:21% -30%;border:1px solid #d5c8ae35;border-radius:50%;transform:rotate(-30deg);animation:portal-drift 14s ease-in-out infinite alternate}
.portal-star{position:absolute;width:7px;height:7px;background:var(--belief,#efd375);border-radius:50%;box-shadow:0 0 18px #efd37580;animation:star-breathe 4s ease-in-out infinite}
.star-one{left:16%;top:28%}.star-two{right:13%;top:57%;width:4px;height:4px;animation-delay:1.5s}
.character-floor{position:absolute;z-index:-1;left:8%;right:8%;bottom:5%;height:8%;border:1px solid #d5c8ae38;border-radius:50%;background:radial-gradient(ellipse,#00000035,transparent 65%);transform:rotate(-7deg);animation:portal-open 1.4s ease both}
.character-emerge{position:relative;animation:character-enter 1.25s cubic-bezier(.22,1,.36,1) both}
.character-emerge img{position:relative;width:100%;height:auto;transform-origin:50% 88%;animation:character-breathe 6s 1.25s ease-in-out infinite;filter:drop-shadow(0 15px 12px #00000040)}
.hero-main .hero-identity{animation:intro-enter .8s .15s both}
.hero-main h1{animation:intro-enter .9s .28s both}
.hero-main .hero-bottom{animation:intro-enter .9s .4s both}
.hero-main .hero-belief{animation:intro-enter .8s .5s both}
.profile-strip,[data-theme="graphite"] .profile-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:0;text-align:left;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:linear-gradient(130deg,#d5c8ae08,transparent)}
.profile-strip>div,[data-theme="graphite"] .profile-strip>div{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0;gap:8px;padding:24px 26px;border-left:1px solid var(--line);grid-template-columns:none}
.profile-strip>div:first-child,[data-theme="graphite"] .profile-strip>div:first-child{border-left:0}
.profile-strip>div>strong,[data-theme="graphite"] .profile-strip>div>strong{font-size:20px;line-height:1.3;font-weight:400;max-width:100%;min-width:0}
.profile-strip>div>span{font-size:13px;line-height:1.6;max-width:100%;overflow-wrap:anywhere}
.profile-strip .company-name{white-space:normal;max-width:100%}
.profile-strip strong .company-label{font:inherit;color:inherit}
.profile-strip strong .company-logo{flex:0 0 15px;width:15px;height:15px}
.profile-strip>div>span .company-nokia{display:inline-flex;vertical-align:middle;margin-left:3px}
.profile-strip>div>span .nokia-logo{width:50px;height:12px}
.link-arrow,.article-arrow{display:block;flex:0 0 14px;width:14px;height:14px;margin:0;transition:transform .25s ease}
.button .link-arrow{flex-basis:15px;width:15px;height:15px}
.article-topline .link-arrow{width:17px;height:17px;flex-basis:17px}
.hero-links>a,.contact-link{gap:8px}
.hero-links .link-icon,.contact-link .link-icon{width:18px;height:18px;flex-basis:18px}
.hero-actions .button,[data-theme="graphite"] .hero-actions .button{gap:24px}
.contact-actions .button-light,[data-theme="graphite"] .contact-actions .button-light{gap:10px}
.article-cta{gap:10px}
@media(hover:hover) and (pointer:fine){a:hover>.link-arrow,.article-cta:hover>.link-arrow{transform:translate(2px,-2px)}.hero-actions .button:hover>.link-arrow{transform:translate(2px,2px)}.interests article{transition:transform .35s,border-color .35s}.interests article:hover{transform:translateY(-4px);border-color:var(--accent)}}
.reveal-pending{transition-delay:var(--reveal-delay,0ms)}
.work-item[open] .work-detail{animation:detail-enter .4s ease both}
@keyframes character-enter{from{opacity:0;transform:translateY(54px) scale(.94);clip-path:inset(78% 0 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes character-breathe{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-8px) rotate(.5deg)}}
@keyframes portal-open{from{opacity:0;transform:translateY(25px) scale(.9)}to{opacity:1;transform:none}}
@keyframes portal-drift{to{transform:rotate(-14deg) scale(1.07)}}
@keyframes star-breathe{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:.95;transform:scale(1.15)}}
@keyframes intro-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes detail-enter{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}
@media(max-width:1050px){.hero-stage{grid-template-columns:270px minmax(0,1fr);gap:28px}.hero-character{width:270px}.profile-strip>div,[data-theme="graphite"] .profile-strip>div{padding:22px 20px}.profile-strip>div>strong,[data-theme="graphite"] .profile-strip>div>strong{font-size:18px}}
@media(max-width:760px){.hero-stage{grid-template-columns:minmax(0,.95fr) minmax(0,1fr);column-gap:18px;padding:0 0 32px}.hero-character{width:100%;max-width:210px;justify-self:center}.hero-main .hero-identity{max-width:100%;min-width:0}.hero-main .identity-name{font-size:23px;line-height:1.15}.hero-main .identity-role{font-size:13px;line-height:1.6;margin-top:12px}.hero-main .identity-location{font-size:11px;margin-top:12px}.hero-main .company-name{white-space:normal}.hero-main .hero-belief{margin-top:18px}.hero-main h1,[data-theme="graphite"] .hero-main h1{margin-top:24px;font-size:clamp(44px,10vw,70px)}.profile-strip,[data-theme="graphite"] .profile-strip{grid-template-columns:minmax(0,1fr);gap:0}.profile-strip>div,[data-theme="graphite"] .profile-strip>div{padding:18px 20px;border-left:0;border-top:1px solid var(--line);gap:5px}.profile-strip>div:first-child,[data-theme="graphite"] .profile-strip>div:first-child{border-top:0}.profile-strip>div>strong,[data-theme="graphite"] .profile-strip>div>strong{font-size:18px;line-height:1.4}.profile-strip>div>span{font-size:13px;line-height:1.6}.hero-links{gap:26px}.hero-links>a{font-size:13px;line-height:1.4}}
@media(max-width:380px){.hero-stage{column-gap:12px}.hero-main .identity-name{font-size:20px}.hero-main .identity-role{font-size:12px}.hero-main h1,[data-theme="graphite"] .hero-main h1{font-size:clamp(40px,10.5vw,44px)}.profile-strip>div,[data-theme="graphite"] .profile-strip>div{padding-inline:17px}}
[data-motion="paused"] .hero-character{transform:none;transition:none}
[data-motion="paused"] .character-emerge,[data-motion="paused"] .hero-main .hero-identity,[data-motion="paused"] .hero-main h1,[data-motion="paused"] .hero-main .hero-bottom,[data-motion="paused"] .hero-main .hero-belief,[data-motion="paused"] .character-portal,[data-motion="paused"] .character-floor{animation:none;opacity:1;transform:none;clip-path:none}
@media(prefers-reduced-motion:reduce){.hero-character{transform:none}.character-emerge,.hero-main .hero-identity,.hero-main h1,.hero-main .hero-bottom,.hero-main .hero-belief,.character-portal,.character-floor{animation:none;opacity:1;transform:none;clip-path:none}}
@media print{.hero-character{display:none}.hero-stage{display:block}.profile-strip,[data-theme="graphite"] .profile-strip{background:none;grid-template-columns:repeat(3,minmax(0,1fr))}.profile-strip>div,[data-theme="graphite"] .profile-strip>div{padding:12px;border-top:0}.link-arrow{display:none!important}}