/* A live code backdrop, with the portrait kept in the foreground. */
.hero-photo{overflow:visible}
.hero-photo>img{position:relative;z-index:2;filter:drop-shadow(0 8px 24px #10121866);max-width:96%}
.hero-code-scene{position:absolute;inset:12px -12px 47px -24px;z-index:0;pointer-events:none;perspective:1100px}
.code-window{position:absolute;inset:18px 8px 24px 0;border:1px solid #6a3b526b;border-radius:12px;background:linear-gradient(145deg,#171c24e8,#181a20c9);box-shadow:0 28px 70px #070a1050,inset 0 1px #f998bd0a;transform:rotateY(-8deg) rotateZ(-5deg);overflow:hidden}
.code-window::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 0,#21242800 40%,#21242828 100%),linear-gradient(0deg,#212428dd,transparent 35%);pointer-events:none}
.code-titlebar{height:45px;display:flex;align-items:center;gap:13px;border-bottom:1px solid #3a35414d;padding:0 18px;background:#24222d;font:500 11px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;color:#a393a9;letter-spacing:.015em}
.code-window-dots{display:flex;gap:5px}
.code-window-dots i{width:5px;height:5px;border-radius:50%;background:#735060}
.code-window-dots i:first-child{background:#ec447888}
.code-file{flex:1}.code-language{font-size:10px;opacity:.6}
.code-lines{padding:22px 16px 20px 12px;font:400 12px/2.15 ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',monospace;color:#acb9cf}
.code-line{display:flex;min-height:26px;gap:16px}
.code-number{color:#64627580;font-size:10px;text-align:right;width:19px;flex-shrink:0;user-select:none}
.code-text{position:relative;display:block;white-space:pre;max-width:calc(var(--typed,100) * 1ch);overflow:hidden;font:inherit;color:inherit}
.code-line.is-typing .code-text{border-right:1px solid #ff739d}
.code-keyword{color:#ed679a}.code-function{color:#77b5d3}.code-string{color:#b0c88e}.code-comment{color:#646f83}.code-value{color:#c6adf5}
.code-terminal{position:absolute;left:-17px;bottom:26px;z-index:1;padding:13px 18px;border:1px solid #71445666;border-radius:6px;background:#171a22f2;box-shadow:0 12px 35px #0a0c1040;color:#d9a4ba;font:400 11px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.01em;transform:rotate(-3deg);max-width:80%}
.code-terminal span{color:#707e97;display:block;font-size:10px;margin-bottom:3px}
.code-terminal b{color:#ff6e9b;font-weight:400}
.code-cursor{display:inline-block;background:#ff6e9b;width:5px;height:12px;margin-left:6px;vertical-align:-2px}
.motion-ready .code-cursor{animation:code-caret 1.2s step-end infinite}
.motion-ready .code-window{animation:code-window-drift 11s ease-in-out infinite}
.motion-ready .code-terminal{animation:terminal-drift 8s ease-in-out infinite}
.portrait-label{z-index:3;bottom:16px;text-shadow:0 2px 7px #16191e}
.project-visual.visual-image{padding:0;min-height:430px;border:0;border-left:1px solid #36343d;isolation:isolate}
.project-visual.visual-image::after{display:none}
.project-visual.visual-image.image-entavon{background:radial-gradient(ellipse at 65% 50%,#002851,#101825 68%)}
.project-visual.visual-image.image-bocao{background:#170a0a}
.project-visual.visual-image.image-woodskeeping{background:radial-gradient(ellipse at 40% 50%,#27352b,#171c1d 80%)}
.image-viewer-trigger{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;border-radius:0;background:none;cursor:zoom-in;overflow:hidden;text-align:left}
.project-photo{width:100%;height:100%;object-fit:contain;padding:36px 12px;transition:transform 1.1s var(--motion-ease),filter .8s}
.image-bocao .project-photo{object-fit:cover;object-position:72% 50%;padding:0}
.image-woodskeeping .project-photo{padding:0}
.image-viewer-trigger::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#10141c85,transparent 29%,transparent 70%,#10141cee)}
.image-viewer-trigger:hover .project-photo,.image-viewer-trigger:focus-visible .project-photo{transform:scale(1.035)}
.image-kicker{position:absolute;top:26px;left:26px;right:26px;z-index:2;font:500 .7rem var(--display);letter-spacing:.15em;text-transform:uppercase;color:#d5e0ef;pointer-events:none;text-shadow:0 2px 9px #000}
.image-caption{position:absolute;left:26px;right:112px;bottom:23px;z-index:2;font-size:.76rem;line-height:1.65;color:#c3ccd8;pointer-events:none;text-shadow:0 2px 9px #000}
.image-open-label{position:absolute;bottom:26px;right:22px;z-index:3;padding:6px 10px;border:1px solid #d8e0f33b;border-radius:5px;background:#1a202bbd;backdrop-filter:blur(10px);font:500 .75rem var(--body);color:#edf2f8;transition:background .35s,border-color .35s,transform .35s}
.image-viewer-trigger:hover .image-open-label{background:#4d2738;border-color:#ed6e9588;transform:translateY(-2px)}
.image-bocao .image-kicker{font-size:1.75rem;letter-spacing:-.03em;font-weight:700;text-transform:none;top:28px;line-height:1.25;max-width:210px;color:#fff}
.image-bocao .image-kicker small{display:block;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;font-weight:500;margin-top:8px;color:#e9c6bc}
.case-showcase{margin:0 auto 25px;border:1px solid #3b3d45;border-radius:12px;overflow:hidden;box-shadow:var(--shadow);background:#171a20}
.case-showcase .case-image-button{position:relative;display:block;inset:auto;min-height:0;aspect-ratio:16/8;width:100%;background:radial-gradient(ellipse,#122437,#14171c);border-radius:0}
.case-showcase img{width:100%;height:100%;object-fit:contain;transition:transform 1.1s var(--motion-ease)}
.case-showcase.image-bocao .case-image-button{aspect-ratio:16/7}
.case-showcase.image-bocao img{object-fit:cover;object-position:center 56%}
.case-showcase.image-woodskeeping .case-image-button{aspect-ratio:16/9}
.case-showcase figcaption{display:flex;justify-content:space-between;gap:20px;padding:20px 27px;background:#20242b;color:#aebaca;font-size:.83rem;line-height:1.7}
.case-showcase figcaption strong{font-size:.88rem;color:#dde5ef;font-weight:500}
.case-showcase figcaption span{max-width:680px;text-align:right}
.image-dialog{width:min(1300px,94vw);max-width:94vw;max-height:94vh;padding:0;border:1px solid #57505e;border-radius:12px;background:#181c23;color:#d5dfec;box-shadow:0 25px 100px #000b;overflow:auto}
.image-dialog::backdrop{background:#090c12e8;backdrop-filter:blur(9px)}
.image-dialog-toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 22px;background:#1e232bf5;border-bottom:1px solid #343b46}
.image-dialog-toolbar h2{margin:0;font-size:1rem;letter-spacing:0;color:#e6edf7}
.image-dialog-close{padding:7px 16px;background:#2b2e36;color:#d6deeb;border:1px solid #4b414d;border-radius:5px;font-size:.85rem}
.image-dialog-close:hover{border-color:var(--pink-light);color:#ff9bba}
.image-dialog figure{margin:0}.image-dialog img{width:100%;height:auto;max-height:73vh;object-fit:contain;background:#0c1016}
.image-dialog figcaption{padding:17px 24px;color:#b4bece;font-size:.84rem;line-height:1.8}
.motion-ready .image-dialog[open]{animation:lightbox-enter .3s var(--motion-ease) both}
@keyframes code-caret{0%,49%{opacity:.8}50%,100%{opacity:0}}
@keyframes code-window-drift{0%,100%{transform:rotateY(-8deg) rotateZ(-5deg) translateY(0)}50%{transform:rotateY(-5deg) rotateZ(-4deg) translateY(-5px)}}
@keyframes terminal-drift{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(-2deg) translateY(5px)}}
@keyframes lightbox-enter{from{opacity:0;transform:translateY(15px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:1100px){.hero-code-scene{inset:15px -7px 55px -18px}.code-lines{font-size:10px;line-height:2.4;padding-left:8px}.code-line{gap:10px}.code-titlebar{padding:0 12px;font-size:10px}.code-language{display:none}.code-terminal{left:-4px;font-size:10px}.project-visual.visual-image{min-height:450px}.image-caption{left:20px;bottom:63px;right:20px}.image-open-label{left:20px;right:auto;bottom:20px}.case-showcase .image-open-label{left:auto;right:24px}}
@media(max-width:820px){.hero-photo{margin-top:60px}.hero-code-scene{inset:-16px -8px 22px -18px}.code-lines{font-size:9px}.code-line{min-height:23px}.code-window{inset:8px 0 0}.code-titlebar{height:33px;font-size:9px}.code-terminal{display:none}.image-kicker{font-size:.62rem;left:20px;top:22px;letter-spacing:.1em}.image-bocao .image-kicker{font-size:1.6rem}.project-photo{padding:34px 8px}.case-showcase figcaption{flex-direction:column;gap:7px;padding:19px}.case-showcase figcaption span{text-align:left}.case-showcase .image-open-label{bottom:15px;right:15px}}
@media(max-width:590px){.hero-photo{margin-top:18px;overflow:visible;max-height:380px;min-height:375px}.hero-photo>img{height:360px;max-width:90%;margin-top:16px}.hero-code-scene{inset:0 0 24px 0}.code-window{inset:0 4px 4px;transform:rotate(-3deg)}.code-lines{font-size:10px;line-height:2.2;padding-top:12px}.code-line{min-height:22px}.code-titlebar{font-size:10px}.code-terminal{display:block;left:0;bottom:25px;font-size:9px;padding:9px 12px;max-width:65%}.code-terminal span{font-size:8px}.project-visual.visual-image{min-height:330px;border-left:0;border-top:1px solid #37343f}.project-visual.image-bocao{min-height:375px}.image-caption{font-size:.7rem;bottom:59px}.image-kicker{font-size:.67rem}.image-entavon .project-photo{padding:35px 8px}.image-woodskeeping .project-photo{padding:0}.case-showcase .case-image-button,.case-showcase.image-bocao .case-image-button{aspect-ratio:16/10}.case-showcase .image-open-label{font-size:.65rem;padding:4px 7px;bottom:9px;right:9px}.case-showcase figcaption{font-size:.78rem}.image-dialog-toolbar{padding:12px 15px}.image-dialog-toolbar h2{font-size:.87rem}.image-dialog-close{padding:6px 10px;font-size:.78rem}.image-dialog figcaption{font-size:.78rem;padding:15px}.image-dialog{width:96vw;max-width:96vw}}
html.motion-paused .code-text{max-width:none!important}html.motion-paused .code-line.is-typing .code-text{border:0}
@media(prefers-reduced-motion:reduce){.code-text{max-width:none!important}.code-line.is-typing .code-text{border:0}.image-viewer-trigger:hover .project-photo{transform:none}}