/* Interactive hero and project presentation. */
.sk-portfolio{--lime:#c4f38b;--soft-lime:#e5f3d4}
.sk-portfolio [hidden]{display:none!important}
.sk-portfolio .hero-word{position:relative;width:max-content}
.sk-portfolio .hero-word:after{content:'';position:absolute;left:0;right:-5%;bottom:-.09em;height:7px;border-top:2px solid #91aaff;border-radius:50%;transform:rotate(-3deg);opacity:.65}
.sk-portfolio .hero-art{aspect-ratio:1/1.13}
.sk-portfolio .hero-canvas{inset:18px -5px 68px;border-radius:12px;touch-action:pan-y;cursor:grab;z-index:2}
.sk-portfolio .hero-canvas.is-dragging{cursor:grabbing}
.sk-portfolio .hero-canvas:focus-visible{outline-offset:-8px}
.sk-portfolio .object-label{position:absolute;inset:5px 8px auto;display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.045em;color:#aab6d0;z-index:3;pointer-events:none}
.sk-portfolio .object-label>span:last-child{margin-left:auto;font-size:25px;color:var(--lime)}
.sk-portfolio .object-dot{width:6px;height:6px;background:var(--lime);border-radius:50%}
.sk-portfolio .object-orbit{position:absolute;inset:12% 6% 23%;border:1px solid #758bb51f;border-radius:50%;transform:rotate(-24deg);pointer-events:none}
.sk-portfolio .object-orbit:before,.sk-portfolio .object-orbit:after{content:'';position:absolute;border:1px solid #758bb518;border-radius:50%;inset:12% -9%;transform:rotate(35deg)}
.sk-portfolio .object-orbit:after{inset:-12% 13%;transform:rotate(-10deg)}
.sk-portfolio .object-note{position:absolute;bottom:98px;right:0;font:italic 20px/1.2 Georgia,serif;transform:rotate(-8deg);color:#b9c6e6;pointer-events:none;z-index:3}
.sk-portfolio .scene-footer{bottom:30px;left:0;right:0;gap:10px;z-index:4}
.sk-portfolio .object-switch{display:flex;padding:4px;background:#171d28;border:1px solid #354057;border-radius:7px;gap:3px}
.sk-portfolio .object-switch button{background:none;border:0;color:#a8b5d0;border-radius:4px;padding:10px 12px;font-size:14px;white-space:nowrap;transition:background .2s,color .2s}
.sk-portfolio .object-switch button[aria-pressed=true]{background:var(--lime);color:#243314}
.sk-portfolio .object-switch button>span{margin-left:9px}
.sk-portfolio .motion-toggle{min-height:40px;font-size:12px;white-space:nowrap}
.sk-portfolio .object-hint{position:absolute;bottom:5px;left:0;right:0;text-align:center;font-size:12px;letter-spacing:.1em;color:#8290a9}
.sk-portfolio[data-object-mode=exploded] .scene-fallback rect:first-child{transform:translate(-35px,-15px) rotate(-12deg)}
.sk-portfolio[data-object-mode=exploded] .scene-fallback rect:nth-child(2){transform:translate(30px,30px) rotate(45deg)}
.sk-portfolio .scene-fallback rect{transition:transform .7s ease}
.sk-portfolio .craft-strip{border-block:1px solid #354333;background:var(--lime);color:#223017;overflow:hidden;padding:20px 0;margin-top:12px;transform:rotate(-1.25deg) scale(1.02)}
.sk-portfolio .craft-track{display:flex;width:max-content;animation:craft-roll 40s linear infinite;will-change:transform}
.sk-portfolio .craft-track>span{display:flex;align-items:center;gap:40px;padding-right:40px;font:500 clamp(24px,3vw,43px)/1.15 var(--display);letter-spacing:-.04em;white-space:nowrap}
.sk-portfolio .craft-track i{font-size:36px;font-style:normal}
@keyframes craft-roll{to{transform:translateX(-50%)}}
.sk-portfolio .work{padding-top:80px;padding-bottom:65px}
.sk-portfolio .work-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:-4px 0 30px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.sk-portfolio .work-filters{display:flex;flex-wrap:wrap;gap:8px}
.sk-portfolio .work-filters button{background:none;border:1px solid #343b49;border-radius:30px;padding:11px 16px;font-size:14px;color:#b8c3d7;transition:background .2s,color .2s,border-color .2s}
.sk-portfolio .work-filters button[aria-pressed=true]{background:#e8eef9;color:#151b27;border-color:#e8eef9}
.sk-portfolio .work-filters button:hover{border-color:#91aaff}
.sk-portfolio .work-filters sup{font-size:12px;margin-left:7px;opacity:.65}
.sk-portfolio .work-count{font-size:12px;color:#99a6bd;white-space:nowrap}
.sk-portfolio .brand-card[data-number]:before{content:attr(data-number);position:absolute;left:22px;top:13px;font:500 74px/1 var(--display);letter-spacing:-.09em;opacity:.07;pointer-events:none}
.sk-portfolio .brand-orbit{position:absolute;width:73%;aspect-ratio:1;border:1px solid currentColor;border-radius:50%;right:-27%;bottom:-46%;opacity:.07;pointer-events:none;transition:transform .8s ease}
.sk-portfolio .brand-orbit:before,.sk-portfolio .brand-orbit:after{content:'';position:absolute;inset:14%;border:1px solid currentColor;border-radius:50%}
.sk-portfolio .brand-orbit:after{inset:29%}
.sk-portfolio .brand-card:hover .brand-orbit{transform:scale(1.2) translate(-5%,-4%)}
.sk-portfolio .brand-card .brand-logo,.sk-portfolio .brand-lockup{position:relative;z-index:1}
.sk-portfolio .brand-caption{position:absolute;left:22px;bottom:24px;font-size:12px;font-weight:500;letter-spacing:.08em;color:var(--brand-ink,#263552);opacity:.68;max-width:55%;pointer-events:none}
.sk-portfolio .project-image .image-link-label{z-index:3}
.sk-portfolio .work-project:only-child{grid-column:1/-1;max-width:760px;width:100%}
.sk-portfolio .contact-arrow{transition:transform .4s}.sk-portfolio .contact:hover .contact-arrow{transform:rotate(8deg) translate(4px,-4px)}
.sk-portfolio .expertise{border-radius:20px 20px 0 0}
.sk-portfolio[data-motion=paused] .craft-track{animation-play-state:paused}
.sk-portfolio[data-motion=paused] :is(.scene-fallback rect,.brand-orbit){transition:none}
.sk-portfolio[data-motion=paused] .brand-card:hover .brand-orbit{transform:none}
@media(max-width:1100px){
 .sk-portfolio .hero-art{aspect-ratio:.86}.sk-portfolio .object-note{font-size:17px;right:0;bottom:105px}
 .sk-portfolio .object-label{font-size:12px}.sk-portfolio .object-switch button{padding:9px;font-size:12px}.sk-portfolio .motion-toggle{padding:6px;gap:4px;font-size:12px}
}
@media(max-width:800px){
 .sk-portfolio .hero-art{aspect-ratio:.69}.sk-portfolio .object-note{font-size:16px;bottom:133px}.sk-portfolio .hero-canvas{inset:30px -10px 88px}
 .sk-portfolio .scene-footer{flex-wrap:wrap;justify-content:center;bottom:28px;gap:8px}.sk-portfolio .object-switch{padding:3px}.sk-portfolio .object-switch button{font-size:12px;padding:9px}.sk-portfolio .object-switch button>span{margin-left:4px}.sk-portfolio .motion-toggle{min-height:29px}.sk-portfolio .object-hint{font-size:12px}
 .sk-portfolio .work{padding-top:60px}.sk-portfolio .work-toolbar{align-items:flex-start}.sk-portfolio .work-filters button{padding:10px 13px;font-size:14px}.sk-portfolio .work-count{display:none}
 .sk-portfolio .brand-caption{left:17px;bottom:18px;font-size:12px;max-width:63%}.sk-portfolio .brand-card[data-number]:before{left:17px;font-size:60px}
}
@media(max-width:600px){
 .sk-portfolio .hero-art{aspect-ratio:1.05;margin-top:40px}.sk-portfolio .hero-canvas{inset:22px -5px 66px}.sk-portfolio .object-label{font-size:12px;left:0;right:0}.sk-portfolio .object-note{bottom:94px;font-size:16px}.sk-portfolio .scene-footer{flex-wrap:nowrap;justify-content:space-between;bottom:26px}.sk-portfolio .object-switch button{font-size:12px;padding:9px 10px}.sk-portfolio .motion-toggle{min-height:36px;padding:6px 8px}.sk-portfolio .object-hint{font-size:12px}.sk-portfolio .art-cross{display:none}
 .sk-portfolio .craft-strip{padding:17px 0;margin-top:5px}.sk-portfolio .craft-track>span{font-size:28px;gap:25px;padding-right:25px}.sk-portfolio .craft-track i{font-size:27px}
 .sk-portfolio .work{padding-top:44px;padding-bottom:33px}.sk-portfolio .work-toolbar{margin-bottom:27px;padding-bottom:20px}.sk-portfolio .work-filters{gap:8px}.sk-portfolio .work-filters button{padding:10px 13px}.sk-portfolio .brand-caption{font-size:12px;letter-spacing:.04em;max-width:56%;bottom:21px}.sk-portfolio .brand-card[data-number]:before{font-size:64px}
 .sk-portfolio .expertise{border-radius:12px 12px 0 0}
}
@media(max-width:1100px){.sk-portfolio .motion-toggle [data-motion-label]{display:none}.sk-portfolio .motion-toggle{width:38px;justify-content:center}.sk-portfolio .object-hint{letter-spacing:.015em}.sk-portfolio .brand-caption{max-width:80%}.sk-portfolio .project-image:hover .brand-caption,.sk-portfolio .project-image:focus-visible .brand-caption{opacity:0}}
@media(prefers-reduced-motion:reduce){.sk-portfolio .craft-track{animation:none}.sk-portfolio .brand-card:hover .brand-orbit{transform:none}}
@media print{.sk-portfolio .craft-strip,.sk-portfolio .work-toolbar{display:none}.sk-portfolio .work-project[hidden]{display:block!important}}