.portfolio{overflow-anchor:none;--portfolio-radius:18px;padding-top:clamp(44px,6vw,88px)}.portfolio-intro{justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:64px;display:flex}.portfolio-intro h1{font-size:clamp(50px,7.5vw,112px);line-height:.99}.portfolio-intro h1 span{color:#656565}.portfolio-intro p{padding-bottom:5px;font-size:clamp(20px,2vw,27px);line-height:1.45}.portfolio-filters{top:var(--nav-h);z-index:20;scroll-margin-top:var(--nav-h);background:#f5f5f5;border-bottom:1px solid #bcbcbc;align-items:center;gap:clamp(24px,5vw,80px);margin-bottom:32px;padding-block:18px 22px;display:flex;position:sticky}.portfolio-filters a{color:#686868;letter-spacing:-.055em;white-space:nowrap;padding-block:5px;font-size:clamp(32px,4.1vw,60px);font-weight:500;line-height:1.2;position:relative}.portfolio-filters a:after{content:"";transform-origin:0;background:currentColor;height:3px;transition:transform .25s;position:absolute;bottom:-5px;left:0;right:0;transform:scaleX(0)}.portfolio-filters a[aria-current],.portfolio-filters a:hover{color:#0a0a0a}.portfolio-filters a[aria-current]:after{transform:scaleX(1)}.portfolio-grid{grid-template-columns:repeat(6,minmax(0,1fr));align-items:start;gap:40px 24px;display:grid}.portfolio-card{grid-column:span 2;min-width:0;scroll-margin-top:200px}.portfolio-card--featured{grid-column:span 3}.portfolio-card[hidden]{display:none}.portfolio[data-active=web] .portfolio-card,.portfolio[data-active=ia] .portfolio-card{grid-column:span 3}.portfolio-surface{border-radius:var(--portfolio-radius);aspect-ratio:4/3;isolation:isolate;background:#eee;display:block;overflow:hidden}.artwork-surface{cursor:zoom-in;align-items:center;display:flex}.artwork-surface img{object-fit:contain;width:100%;height:100%;transition:transform .65s cubic-bezier(.2,.7,.2,1)}.portfolio-card--art:nth-child(3n) .artwork-surface{transform:rotate(-.7deg)}.portfolio-card--art:nth-child(3n+1) .artwork-surface{transform:rotate(.7deg)}.portfolio-card--featured .artwork-surface{transform:none!important}.identity-surface{position:relative}.identity-cover{object-fit:cover;width:100%;height:100%;transition:transform .65s}.identity-surface:after{content:"";background:#12121273;position:absolute;inset:0}.identity-logo{z-index:1;width:var(--logo-width);object-fit:contain;max-width:62%;max-height:58%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.portfolio-caption{letter-spacing:-.035em;margin-top:17px;font-size:clamp(22px,2vw,29px);font-weight:500;line-height:1.15}.portfolio-caption-row{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.portfolio-detail{text-underline-offset:5px;white-space:nowrap;padding-block:10px;font-size:18px;text-decoration:underline}.portfolio-services{color:#555;margin-top:8px;font-size:18px;line-height:1.45}.website-surface{background:radial-gradient(ellipse at 50% 15%, #ffffffb3, transparent 70%), var(--site-color);perspective:1000px;place-items:center;padding:4% 12% 3%;display:grid}.portfolio-computer{width:100%;transform-style:preserve-3d;padding-bottom:12%;transition:transform .65s cubic-bezier(.2,.7,.2,1);position:relative;transform:rotateY(-8deg)rotateX(3deg)}.portfolio-computer:before{content:"";filter:blur(15px);background:#26332850;border-radius:50%;height:8%;position:absolute;bottom:0;left:6%;right:6%;transform:rotateX(20deg)}.computer-screen{background:#191b1e;border:2px solid #afb2b4;border-bottom:0;border-radius:10px 10px 0 0;padding:3% 2% 2%;position:relative;box-shadow:7px 4px #898c8e,14px 16px 22px #30393620}.computer-screen:before{content:"";background:#454953;border-radius:50%;width:4px;height:4px;position:absolute;top:2%;left:50%}.computer-screen img{aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:2px;width:100%;height:auto}.computer-chin{aspect-ratio:12;background:linear-gradient(115deg,#e1e2e3,#bdc0c3 65%,#e2e3e4);border-radius:0 0 9px 9px;position:relative;box-shadow:6px 3px #8c9091}.computer-foot{clip-path:polygon(29% 0,71% 0,81% 85%,100% 94%,100% 100%,0 100%,0 94%,19% 85%);background:linear-gradient(90deg,#b5b8bb,#e1e3e5 52%,#babdc0);width:26%;height:15%;position:absolute;bottom:0;left:37%}.render-surface{background:#000}.render-surface img{object-fit:cover;width:100%;height:100%}.pack-surface{background:#365786;align-items:center;display:grid}.pack-surface img{width:100%;height:auto;transition:transform .5s}.ai-surface{background:#d7e4de;flex-direction:column;justify-content:space-between;padding:clamp(24px,3vw,40px);display:flex;position:relative}.ai-context,.ai-bottom{z-index:1;font-size:18px;line-height:1.3}.ai-surface h2{letter-spacing:-.06em;z-index:1;font-size:clamp(30px,3.5vw,50px);font-weight:500;line-height:1.04}.ai-documents{opacity:.65;width:25%;height:31%;transition:transform .65s;position:absolute;top:18%;right:11%;transform:rotate(8deg)}.ai-documents span{background:#f9fcfa;border:1px solid #85a297;border-radius:5px;position:absolute;inset:0;box-shadow:0 9px 10px #40645112}.ai-documents span:first-child{background:#b9d0c5;transform:rotate(-24deg)translate(-20%,-3%)}.ai-documents span:nth-child(2){background:#e2ede6;transform:rotate(-12deg)translate(-10%,-2%)}.ai-documents span:last-child{flex-direction:column;justify-content:center;gap:9px;padding:18%;display:flex}.ai-documents i{background:#698779;width:100%;height:3px}.ai-documents i:last-child{width:65%}.training-surface{perspective:900px;background:#e6dece;place-items:center;padding:10%;display:grid}.training-book{color:#f4f2da;transform-origin:50% 80%;background:#2c3b35;border-radius:2px 9px 9px 2px;flex-direction:column;justify-content:space-between;width:75%;height:100%;padding:9% 8%;transition:transform .65s;display:flex;transform:rotate(-9deg)rotateY(-12deg);box-shadow:1px 1px #f4f1e5,3px 2px #ddd9c9,5px 3px #f9f6ee,7px 4px #c6c2b7,9px 5px #f9f6ee,19px 22px 23px #302b282c;container-type:inline-size}.training-book>span:first-child{font-size:22px;font-style:italic;font-weight:600}.training-book h2{letter-spacing:-.055em;font-size:clamp(26px,20cqw,48px);font-weight:500;line-height:1}.training-book>span:last-child{font-size:18px;line-height:1.2}.portfolio-top{text-underline-offset:7px;width:fit-content;margin:64px auto 0;padding:14px;font-size:20px;text-decoration:underline;display:block}.portfolio-contact{border-top:1px solid #bbb;justify-content:space-between;align-items:flex-end;gap:30px;margin-top:70px;padding-block:65px 100px;display:flex}.portfolio-contact h2{font-size:clamp(64px,9vw,136px)}.portfolio-contact>a{letter-spacing:-.04em;text-underline-offset:10px;padding-block:12px;font-size:clamp(30px,4vw,60px);text-decoration:underline 2px}.portfolio-sr{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.portfolio a:focus-visible,.portfolio button:focus-visible{outline-offset:6px;outline:3px solid #176ad7}.portfolio-viewing{overflow:hidden}.artwork-viewer{color:#121212;background:#f5f5f5;border:0;border-radius:18px;width:min(1280px,100% - 48px);height:900px;max-height:calc(100dvh - 48px);margin:auto;padding:0;box-shadow:0 30px 100px #0005}.artwork-viewer[open]{flex-direction:column;display:flex}.artwork-viewer::backdrop{backdrop-filter:blur(8px);background:#111b}.artwork-toolbar{justify-content:space-between;align-items:center;gap:20px;padding:16px 24px;display:flex}.artwork-toolbar h2{letter-spacing:-.03em;font-size:clamp(20px,2.4vw,30px);font-weight:500;line-height:1.2}.artwork-viewer button{color:inherit;text-underline-offset:5px;border-radius:7px;min-height:48px;padding:8px 12px;font-size:20px;text-decoration:underline}.artwork-stage{background:#eee;flex:1;min-height:0}.artwork-stage img{object-fit:contain;width:100%;height:100%}.artwork-navigation{justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;font-size:18px;display:flex}@media (hover:hover) and (prefers-reduced-motion:no-preference){.artwork-surface:hover img{transform:scale(1.025)}.identity-link:hover .identity-cover{transform:scale(1.04)}.website-surface:hover .portfolio-computer{transform:rotateY(3deg)rotateX(0)translateY(-4px)}.training-link:hover .training-book{transform:rotate(-3deg)rotateY(0)translateY(-7px)}.ai-link:hover .ai-documents{transform:rotate(0)translateY(-10px)}.portfolio-caption a:hover,.portfolio-contact>a:hover{text-underline-offset:6px;text-decoration:underline}.pack-surface:hover img{transform:scale(1.02)}}@media (prefers-reduced-motion:no-preference){.portfolio-in{animation:.6s ease-out both portfolio-arrive}@keyframes portfolio-arrive{0%{opacity:0;translate:0 22px}to{opacity:1;translate:0}}}@media (width>=1000px){.portfolio-card--art:not(.portfolio-card--featured):nth-child(4n){padding-top:24px}}@media (width<=999px){.portfolio-intro{flex-direction:column;align-items:flex-start;gap:25px;margin-bottom:40px}.portfolio-grid{gap:32px 20px}.portfolio-card{grid-column:span 3}.portfolio-filters{justify-content:space-between;gap:30px}}@media (width<=639px){.portfolio{padding-top:38px}.portfolio-intro{gap:20px;margin-bottom:22px}.portfolio-intro h1{font-size:clamp(43px,10.8vw,66px)}.portfolio-intro p{font-size:20px}.portfolio-filters{grid-template-columns:minmax(0,1fr) minmax(0,1.28fr);gap:10px 20px;margin-bottom:25px;padding-block:14px 20px;display:grid}.portfolio-filters a{width:fit-content;font-size:clamp(26px,8vw,32px)}.portfolio-filters a:after{bottom:0}.portfolio-grid{grid-template-columns:minmax(0,1fr);gap:32px}.portfolio-card,.portfolio-card--featured,.portfolio[data-active=web] .portfolio-card,.portfolio[data-active=ia] .portfolio-card{grid-column:1}.portfolio-surface{border-radius:16px}.portfolio-caption{margin-top:15px;font-size:25px}.portfolio-caption-row{flex-wrap:wrap;gap:0 16px}.portfolio-detail{padding-block:8px 0}.ai-surface h2{font-size:clamp(32px,10vw,45px)}.ai-surface{padding:25px}.portfolio-contact{flex-direction:column;align-items:flex-start;margin-top:40px;padding-block:40px 55px}.portfolio-top{margin-top:35px}.artwork-viewer{border-radius:14px;width:calc(100% - 16px);max-height:calc(100dvh - 24px)}.artwork-toolbar{align-items:flex-start;gap:10px;padding:12px}.artwork-toolbar h2{padding-top:11px}.artwork-viewer button{font-size:18px}.artwork-navigation{gap:4px;padding:10px 4px}}@media (prefers-reduced-motion:reduce){.portfolio *,.portfolio :after{transition:none!important;animation:none!important}.portfolio{scroll-behavior:auto}}
