@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');:root{--bg:#0d1117;--surface:#151a21;--surface2:#11161d;--text:#f4f6f8;--muted:#9da8b2;--aqua:#6fd1cc;--line:#29323c;--sans:Manrope,Arial,sans-serif;--mono:'DM Mono',monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 var(--sans);overflow-x:hidden}a{color:inherit;text-decoration:none}.wrap{width:min(1240px,calc(100% - 64px));margin:auto}.skip{position:fixed;z-index:99;left:1rem;top:-5rem;background:var(--aqua);color:var(--bg);padding:.6rem .9rem}.skip:focus{top:1rem}header{position:fixed;z-index:20;inset:0 0 auto;border-bottom:1px solid transparent;transition:.25s}header.is-scrolled{background:#0d1117ed;border-color:var(--line);backdrop-filter:blur(10px)}.nav{height:76px;display:flex;align-items:center;justify-content:space-between}.logo img{width:104px;height:auto;display:block}.nav nav{display:flex;align-items:center;gap:1.4rem;font-size:.75rem;font-weight:700}.nav nav span{height:16px;border-left:1px solid var(--line)}.nav nav a{color:var(--muted);transition:color .2s}.nav nav a:hover{color:var(--aqua)}.menu{display:none}.hero{padding:162px 0 100px;min-height:760px;display:grid;align-items:center}.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:8vw;align-items:center}.eyebrow{margin:0 0 1.35rem;color:var(--aqua);font:500 .68rem var(--mono);letter-spacing:.04em;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(3.3rem,6.1vw,6.9rem);line-height:.95;letter-spacing:-.075em;margin:0}h1 em{color:var(--aqua);font-style:normal}.lead{max-width:530px;color:var(--muted);font-size:1.05rem;margin:2rem 0}.actions{display:flex;gap:1.6rem;align-items:center}.btn{display:inline-block;background:var(--aqua);color:#071411;padding:.85rem 1.1rem;font-size:.78rem;font-weight:800;transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-3px);box-shadow:0 10px 22px #6fd1cc26}.text-link,.project-links a{font-size:.78rem;font-weight:700;border-bottom:1px solid var(--aqua);padding-bottom:.25rem}.code{background:var(--surface);border:1px solid var(--line);box-shadow:0 0 45px #6fd1cc12;animation:codein .8s ease both}.codebar{height:42px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:6px;padding:0 14px}.codebar b{height:7px;width:7px;border-radius:50%;background:#4f5c66}.codebar b:first-child{background:var(--aqua)}.codebar span{font:.62rem var(--mono);color:var(--muted);margin-left:.5rem}pre{padding:1.8rem;overflow:auto;margin:0;color:#dce4e8;font:clamp(.68rem,1vw,.82rem)/1.9 var(--mono)}code i{color:var(--aqua);font-style:normal}code strong{color:#b7c7ec;font-weight:400}code mark{background:none;color:#bcc7bc}.section{padding:130px 0}.projects{border-top:1px solid var(--line)}.title-row{display:flex;justify-content:space-between;align-items:end;margin-bottom:5rem}.title-row h2,.about h2,.contact h2{font-size:clamp(3rem,5.5vw,6rem);line-height:.9;letter-spacing:-.08em;margin:0}.title-row>p{font:.65rem var(--mono);color:var(--muted);text-transform:uppercase}.project-list{display:grid;gap:130px}.project{display:grid;grid-template-columns:35% 1fr;gap:6%;align-items:center}.project.reverse .project-info{grid-column:2}.project.reverse .shot,.project.reverse .fb-shots{grid-column:1;grid-row:1}.project-info h3{font-size:clamp(2.2rem,4vw,4.5rem);line-height:.9;letter-spacing:-.08em;margin:.6rem 0 1.4rem}.project-info>p:not(.eyebrow){color:var(--muted);font-size:.9rem}.project-info ul{display:flex;gap:.4rem;list-style:none;padding:0;margin:1.5rem 0}.project-info li{padding:.18rem .43rem;border:1px solid var(--line);font:.6rem var(--mono);color:var(--muted)}.project-links{display:flex;gap:1.3rem}.browser{display:block;border:1px solid var(--line);background:var(--surface2);overflow:hidden;transition:border-color .25s}.browser:hover{border-color:var(--aqua)}.browser>span{height:34px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:5px;padding:0 10px;color:var(--muted);font:.57rem var(--mono)}.browser b{width:6px;height:6px;background:#53606b;border-radius:50%}.browser b:first-child{background:var(--aqua)}.shot img{display:block;width:100%;aspect-ratio:1.44;object-fit:cover;object-position:top;transition:transform .45s}.shot:hover img{transform:scale(1.018)}.fb-shots{display:grid;grid-template-columns:1fr 125px;gap:18px;align-items:end}.phone{border:1px solid var(--line);padding:6px;border-radius:16px;background:#0a0d11;overflow:hidden;transition:border-color .2s}.phone:hover{border-color:var(--aqua)}.phone img{display:block;width:100%;aspect-ratio:430/932;object-fit:cover;object-position:top;border-radius:10px}.about{background:var(--surface2);border-block:1px solid var(--line)}.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:4rem}.about-copy{color:var(--muted);font-size:clamp(1.05rem,1.6vw,1.25rem)}.github{display:block;margin:2.5rem 0;color:var(--text);font-size:.9rem}.github b{display:block;color:var(--aqua);margin-top:.4rem}.tech{font:.7rem var(--mono);color:var(--muted)}.tech i{color:var(--aqua);font-style:normal}.services ol{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}.services li{display:grid;grid-template-columns:70px 1fr .8fr;align-items:baseline;gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--line);transition:padding .2s}.services li:hover{padding-left:.7rem}.services li b{font:.65rem var(--mono);color:var(--aqua)}.services li strong{font-size:clamp(1.2rem,2.4vw,2.2rem);letter-spacing:-.05em}.services li span{color:var(--muted);font-size:.8rem}.contact{background:var(--surface);border-top:1px solid var(--line)}.contact>div>p:not(.eyebrow){max-width:520px;color:var(--muted);font-size:1.05rem;margin:1.7rem 0}.phone-link{display:block;color:var(--muted);font:.7rem var(--mono);margin:1.3rem 0 3rem}.social{display:flex;gap:2rem;font-size:.76rem;font-weight:700}.social a:hover{color:var(--aqua)}footer{border-top:1px solid var(--line);padding:1.6rem 0;font-size:.68rem;color:var(--muted)}footer .wrap{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap}footer .logo img{width:86px}footer span:last-child{margin-left:auto}@keyframes codein{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.reveal{opacity:0;transform:translateY(18px);transition:.6s}.reveal.is-visible{opacity:1;transform:none}@media(max-width:760px){.wrap{width:min(100% - 32px,1240px)}.nav{height:62px}.menu{display:grid;gap:5px;border:0;background:none;padding:7px}.menu i{display:block;width:22px;height:1px;background:var(--text)}.nav nav{position:fixed;top:62px;inset-inline:0;bottom:0;background:var(--bg);padding:2rem;display:flex;align-items:flex-start;flex-direction:column;gap:1.5rem;transform:translateX(100%);transition:transform .3s}.nav nav.is-open{transform:none}.nav nav>a{font-size:1.4rem}.nav nav span{height:auto;width:100%;border-left:0;border-top:1px solid var(--line)}.hero{padding:110px 0 65px;min-height:0}.hero-grid{display:flex;flex-direction:column;gap:3.5rem;align-items:stretch}.lead{font-size:1rem}.code pre{padding:1.2rem;font-size:.63rem}.section{padding:82px 0}.title-row{margin-bottom:3.5rem}.project-list{gap:80px}.project,.project.reverse{display:flex;flex-direction:column;gap:2rem}.project-info{order:0}.project.reverse .shot,.project.reverse .fb-shots{order:1}.project-info h3{font-size:2.7rem}.shot{width:100%}.fb-shots{width:100%;grid-template-columns:1fr 95px;gap:10px}.about-grid{display:block}.about-grid>div{margin-top:3rem}.services li{grid-template-columns:40px 1fr}.services li span{grid-column:2}.social{flex-wrap:wrap;gap:1rem 1.5rem}footer .wrap{display:grid;grid-template-columns:1fr 1fr;gap:1rem}footer span:last-child{margin:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}

/* Projetos V3 — grade editorial */
.title-row{align-items:end}.title-row>p{max-width:280px;text-transform:none;font:400 .86rem/1.5 var(--sans);color:var(--muted);margin:0 0 .2rem auto}.project-count{font:.65rem var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--aqua);margin-left:3rem;margin-bottom:.2rem}.project-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:76px 32px}.project,.project.reverse{display:flex;flex-direction:column;gap:1.6rem;align-items:stretch}.project .project-info,.project.reverse .project-info{display:block;order:2}.project .shot,.project.reverse .shot,.project.reverse .fb-shots{order:1;grid-column:auto;grid-row:auto}.project-info .eyebrow:before{content:counter(project) ' · ';counter-increment:project}.project-list{counter-reset:project}.project-info h3{font-size:clamp(2rem,3vw,3.2rem);margin:.45rem 0 1rem}.project-info>p:not(.eyebrow){min-height:4.5em;max-width:490px}.project-links{gap:1.5rem}.fb-shots{width:100%;grid-template-columns:minmax(0,1fr) 105px}.project .shot img{aspect-ratio:1.45}@media(max-width:760px){.title-row{display:grid;grid-template-columns:1fr auto;gap:1.2rem}.title-row>div{grid-column:1/-1}.title-row>p{margin:0;max-width:210px;font-size:.78rem}.project-count{margin:0;align-self:end}.project-list{display:grid;grid-template-columns:1fr;gap:65px}.project-info>p:not(.eyebrow){min-height:0}}
/* Home — galeria de projetos */
.projects{border-top:1px solid var(--line)}.portfolio-head{display:flex;align-items:end;justify-content:space-between;gap:3rem;margin-bottom:4.5rem}.portfolio-head h2{font-size:clamp(3rem,5.5vw,6rem);line-height:.9;letter-spacing:-.08em;margin:0}.portfolio-head>div>p:last-child{max-width:360px;margin:1.4rem 0 0;color:var(--muted);font-size:.92rem}.portfolio-tools{display:grid;gap:1.1rem;justify-items:end}.portfolio-tools>b{color:var(--aqua);font:.65rem var(--mono);text-transform:uppercase;letter-spacing:.06em}.filters{display:flex;gap:.5rem}.filters button{border:1px solid var(--line);background:transparent;color:var(--muted);padding:.48rem .72rem;font:500 .67rem var(--mono);cursor:pointer;transition:.2s}.filters button:hover,.filters button:focus-visible{border-color:var(--aqua);color:var(--text);outline:none}.filters button.is-active{background:var(--aqua);border-color:var(--aqua);color:#071411}.portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:84px 40px}.portfolio-item{min-width:0;transition:opacity .22s,transform .22s}.portfolio-image{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:16/9;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--surface2);isolation:isolate;cursor:pointer;transition:border-color .25s}.portfolio-image img{width:100%;height:100%;object-fit:contain;transition:transform .35s ease}.portfolio-image:hover,.portfolio-image:focus-visible{border-color:var(--aqua);outline:none}.portfolio-image:hover img,.portfolio-image:focus-visible img{transform:scale(1.015)}.portfolio-category{margin:1.35rem 0 .55rem;color:var(--aqua);font:.62rem var(--mono);letter-spacing:.045em;text-transform:uppercase}.portfolio-item h3{margin:0 0 .8rem;font-size:clamp(1.7rem,2.4vw,2.25rem);line-height:1;letter-spacing:-.065em}.portfolio-description{max-width:540px;min-height:4.8em;margin:0;color:var(--muted);font-size:.86rem;line-height:1.65}.portfolio-tech{margin:1.15rem 0;color:#aab7bd;font:.65rem var(--mono)}.portfolio-actions{display:flex;gap:1.3rem;font-size:.75rem;font-weight:700}.portfolio-actions a{border-bottom:1px solid transparent;padding-bottom:.15rem;transition:.2s}.portfolio-actions a:hover,.portfolio-actions a:focus-visible{border-color:var(--aqua);color:var(--aqua);outline:none}@media(max-width:900px){.portfolio-grid{gap:64px 26px}.portfolio-head{margin-bottom:3.5rem}.portfolio-description{min-height:6.3em}}@media(max-width:760px){.portfolio-head{display:grid;grid-template-columns:1fr auto;gap:1.5rem;margin-bottom:3rem}.portfolio-head>div:first-child{grid-column:1/-1}.portfolio-tools{justify-items:end;align-self:end}.portfolio-tools>b{margin-bottom:.2rem}.filters{overflow-x:auto;max-width:calc(100vw - 32px)}.portfolio-grid{grid-template-columns:1fr;gap:62px}.portfolio-description{min-height:0}.portfolio-actions{gap:1rem}}
/* Ajustes pontuais: wordmark e enquadramento Jastur */
.wordmark{font-size:1.22rem;font-weight:800;letter-spacing:-.075em}.wordmark span{color:var(--aqua)}.jastur-item .portfolio-image img{object-fit:cover;object-position:center 40%;transform:scale(1.025)}.jastur-item .portfolio-image:hover img,.jastur-item .portfolio-image:focus-visible img{transform:scale(1.04)}.portfolio-actions a:only-child{color:var(--aqua);border-color:var(--aqua)}
/* Identidade oficial — integração da marca fornecida */
.brand-signature{display:inline-flex;align-items:center;gap:8px;transition:transform .18s ease,opacity .18s ease}.brand-signature:hover{transform:translateY(-1px);opacity:.94}.brand-signature .brand-symbol{display:block;width:48px;height:32px;object-fit:contain;flex:none}.brand-signature>span{font-size:1.22rem;font-weight:800;letter-spacing:-.075em;color:var(--text)}.brand-signature>span span,.footer-wordmark span{color:var(--aqua)}.footer-wordmark{font-size:1.1rem;font-weight:800;letter-spacing:-.075em}

/* Motion direction — precision, depth and progressive enhancement */
:root{--motion-fast:180ms;--motion-base:560ms;--motion-slow:780ms;--motion-stagger:80ms;--ease-out:cubic-bezier(.22,1,.36,1);--ease-spring:cubic-bezier(.16,1,.3,1);--reveal-distance:16px;--aqua-rgb:111,209,204}
body:before{content:'';position:fixed;z-index:-2;inset:0;pointer-events:none;background-image:linear-gradient(rgb(var(--aqua-rgb),.025) 1px,transparent 1px),linear-gradient(90deg,rgb(var(--aqua-rgb),.025) 1px,transparent 1px);background-size:76px 76px;mask-image:radial-gradient(ellipse 80% 62% at 50% 0%,#000 0%,transparent 100%);opacity:.65}
.scroll-progress{position:fixed;z-index:40;top:0;left:0;width:100%;height:2px;pointer-events:none;transform:scaleX(var(--scroll-progress,0));transform-origin:left;background:var(--aqua);opacity:.78;will-change:transform}
header{transition:background var(--motion-fast) ease,border-color var(--motion-fast) ease,backdrop-filter var(--motion-fast) ease}header.is-scrolled{background:#0d1117f4;border-color:#6fd1cc2e;backdrop-filter:blur(16px)}
.nav nav a{position:relative;transition:color var(--motion-fast) ease}.nav nav a:after{content:'';position:absolute;right:0;bottom:-.45rem;left:0;height:1px;background:var(--aqua);transform:scaleX(0);transform-origin:right;transition:transform var(--motion-fast) var(--ease-out)}.nav nav a:hover:after,.nav nav a:focus-visible:after,.nav nav a.is-active:after{transform:scaleX(1);transform-origin:left}.nav nav a.is-active{color:var(--aqua)}
.hero{position:relative;isolation:isolate}
.btn{position:relative;overflow:hidden;transition:transform var(--motion-fast) var(--ease-spring),box-shadow var(--motion-fast) ease,background var(--motion-fast) ease}.btn:before{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 32%,#ffffff3d 50%,transparent 68%);transform:translateX(-130%);transition:transform 500ms var(--ease-out)}.btn:hover:before{transform:translateX(130%)}.btn:hover{transform:translateY(-2px);box-shadow:0 9px 22px #6fd1cc22}.btn:active{transform:translateY(0) scale(.985)}.btn.magnetic{transform:translate3d(var(--magnetic-x,0),var(--magnetic-y,0),0)}.btn.magnetic:hover{transform:translate3d(var(--magnetic-x,0),var(--magnetic-y,0),0)}
.nav nav a:focus-visible,.btn:focus-visible,.text-link:focus-visible,.social a:focus-visible,.github:focus-visible,.phone-link:focus-visible,.portfolio-image:focus-visible,.filters button:focus-visible{outline:2px solid var(--aqua);outline-offset:4px}
.code{position:relative;transform-style:preserve-3d;will-change:transform;transition:transform var(--motion-base) var(--ease-spring),border-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease}.motion-ready .code.hero-motion{transform:perspective(900px) rotateX(var(--code-rotate-x,0deg)) rotateY(var(--code-rotate-y,0deg)) translate3d(0,var(--code-shift,0),0)}.code:hover{border-color:#6fd1cc8a;box-shadow:0 18px 42px #00000028}.codebar b{transition:transform var(--motion-fast) var(--ease-out),opacity var(--motion-fast) ease}.code:hover .codebar b{transform:translateY(-1px)}.code:after{content:'';position:absolute;right:1.75rem;bottom:1.95rem;width:1px;height:.9rem;background:var(--aqua);opacity:0}.motion-ready .code:after{animation:code-caret 1.2s step-end 4 1.15s}.motion-ready .code pre{position:relative;white-space:pre-wrap;overflow:hidden;animation:code-lines var(--motion-base) var(--ease-out) .56s both}.motion-ready .code pre:after{content:'';position:absolute;inset:1.25rem;background:linear-gradient(100deg,transparent 28%,#6fd1cc12 48%,transparent 68%);transform:translateX(-115%);animation:code-scan 1.1s var(--ease-out) .72s both;pointer-events:none}
.js:not(.motion-reduced) .hero-motion{opacity:0;transform:translateY(var(--reveal-distance));transition:opacity var(--motion-base) var(--ease-out),transform var(--motion-base) var(--ease-out);transition-delay:var(--hero-delay,0ms)}.js:not(.motion-reduced) h1.hero-motion{transform:translateY(18px);clip-path:inset(0 0 100% 0);transition:opacity var(--motion-slow) var(--ease-out),transform var(--motion-slow) var(--ease-out),clip-path var(--motion-slow) var(--ease-out);transition-delay:var(--hero-delay,0ms)}.js:not(.motion-reduced) .code.hero-motion{transform:translateY(14px) scale(.986)}.js:not(.motion-reduced).motion-ready .hero-motion{opacity:1;transform:none}.js:not(.motion-reduced).motion-ready h1.hero-motion{clip-path:inset(0)}
.js:not(.motion-reduced) .reveal{opacity:0;transform:translateY(var(--reveal-distance));transition:opacity var(--motion-base) var(--ease-out),transform var(--motion-base) var(--ease-out);transition-delay:var(--reveal-delay,0ms)}.js:not(.motion-reduced) .reveal.reveal-left{transform:translateX(-12px)}.js:not(.motion-reduced) .reveal.reveal-scale{transform:scale(.985)}.js:not(.motion-reduced) .reveal.is-visible{opacity:1;transform:none}
.section{position:relative}.section:after{width:min(132px,20vw);transform:translateX(-50%) scaleX(0);transform-origin:center;background:linear-gradient(90deg,transparent,#6fd1cc75,transparent);transition:transform var(--motion-slow) var(--ease-out)}.section.is-section-visible:after{transform:translateX(-50%) scaleX(1)}
.section-title-part{transition:opacity var(--motion-base) var(--ease-out),transform var(--motion-base) var(--ease-out)}.js:not(.motion-reduced) .section-title-part{opacity:0;transform:translateY(13px)}.js:not(.motion-reduced) .section-title-part.is-visible{opacity:1;transform:none}.section-title-part+.section-title-part{transition-delay:var(--motion-stagger)}
.js:not(.motion-reduced) .portfolio-image{--media-parallax:0px;--media-scale:1.045;position:relative;clip-path:inset(0 0 100% 0);will-change:clip-path;transition:clip-path var(--motion-slow) var(--ease-out),border-color var(--motion-fast) ease}.portfolio-image.is-media-visible{clip-path:inset(0)}.js:not(.motion-reduced) .portfolio-image img{transform:translate3d(0,var(--media-parallax),0) scale(var(--media-scale));transition:transform 820ms var(--ease-out)}.portfolio-image.is-media-visible img{--media-scale:1}.portfolio-image:hover img,.portfolio-image:focus-visible img{--media-scale:1.015}.portfolio-image:hover,.portfolio-image:focus-visible{border-color:#6fd1ccaa}
.filters{position:relative;isolation:isolate}.filters:before{content:'';position:absolute;z-index:-1;top:0;left:0;width:var(--filter-width,0px);height:100%;border:1px solid var(--aqua);background:#6fd1cc10;border-radius:2px;transform:translateX(var(--filter-x,0px));transition:transform var(--motion-base) var(--ease-spring),width var(--motion-base) var(--ease-spring)}.filters button{position:relative;z-index:1;background:transparent!important;transition:color var(--motion-fast) ease,transform var(--motion-fast) var(--ease-out)}.filters button:after{display:none}.filters button.is-active{color:var(--aqua);border-color:transparent}.portfolio-item[hidden]{display:none!important}.js:not(.motion-reduced) .portfolio-item.is-filter-transitioning{transition:opacity 240ms ease,transform 240ms ease}.js:not(.motion-reduced) .portfolio-item.is-filter-exiting{opacity:0;transform:scale(.985);pointer-events:none;transition:opacity 200ms ease,transform 200ms ease}.js:not(.motion-reduced) .portfolio-item.is-filter-entering{opacity:0;transform:translateY(6px);pointer-events:none}
.tech{position:relative;display:flex;align-items:center;gap:.32rem}.tech:after{content:'';position:absolute;z-index:-1;left:.2rem;right:.2rem;top:50%;height:1px;background:linear-gradient(90deg,transparent,#6fd1cc70 12%,#6fd1cc70 88%,transparent);transform:scaleX(0);transform-origin:left;transition:transform var(--motion-slow) var(--ease-out)}.tech.is-tech-ready:after{transform:scaleX(1)}.tech-item{position:relative;background:var(--surface2);transition:transform var(--motion-fast) var(--ease-spring),border-color var(--motion-fast) ease,background var(--motion-fast) ease,color var(--motion-fast) ease,opacity var(--motion-fast) ease}.js:not(.motion-reduced) .tech-item{opacity:0;transform:translateY(8px);transition-delay:var(--tech-delay,0ms)}.tech.is-tech-ready .tech-item{opacity:1;transform:none}.tech-item:hover{color:var(--text);border-color:#6fd1cc90;background:#6fd1cc0d;transform:translateY(-2px)!important}.tech:has(.tech-item:hover) .tech-item:not(:hover){opacity:.52}.tech-item,.tech i{position:relative;z-index:1}.tech i{transition:opacity var(--motion-fast) ease}.tech:has(.tech-item:hover) i{opacity:.48}

@keyframes code-lines{from{opacity:.2;transform:translateY(5px)}to{opacity:1;transform:none}}@keyframes code-caret{50%{opacity:.75}}@keyframes code-scan{to{transform:translateX(115%)}}
@media(max-width:760px){:root{--motion-base:460ms;--motion-slow:600ms;--reveal-distance:11px}.scroll-progress{height:1px}.nav nav a:after{display:none}.portfolio-image{clip-path:none}.portfolio-image img{--media-parallax:0px!important}.filters:before{display:none}.filters button.is-active{border-color:var(--aqua)}.tech:after{display:none}.tech:has(.tech-item:hover) .tech-item:not(:hover),.tech:has(.tech-item:hover) i{opacity:1}.tech-item:hover{transform:none!important}}
@media(prefers-reduced-motion:reduce){body:before,.code:after,.code pre:after{display:none}.scroll-progress{display:none}.js .hero-motion,.js h1.hero-motion,.js .reveal,.js .section-title-part,.js .tech-item{opacity:1!important;transform:none!important;clip-path:none!important}.portfolio-image{clip-path:none!important}.portfolio-image img{transform:none!important}}
/* Motion reliability and local interaction refinement */
:root{--mouse-x:50vw;--mouse-y:30vh}
.global-spotlight{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:0;background:radial-gradient(680px circle at var(--mouse-x) var(--mouse-y),rgb(var(--aqua-rgb),.052),transparent 72%);transition:opacity var(--motion-base,.6s) var(--ease-out,ease)}
.has-global-spotlight.global-spotlight-active .global-spotlight{opacity:1}.has-global-spotlight.global-spotlight-active.spotlight-muted .global-spotlight{opacity:.38}
main,footer{position:relative;z-index:1}

/* Images are content, never an observer-controlled visual state. */
.js:not(.motion-reduced) .portfolio-image{clip-path:none}
.js:not(.motion-reduced) .portfolio-image.media-reveal{clip-path:none;visibility:visible;opacity:1}
.js:not(.motion-reduced) .portfolio-image.media-reveal.is-media-visible{clip-path:none}

.services li{position:relative;isolation:isolate;overflow:hidden;padding-left:0;transition:background var(--motion-base,.6s) var(--ease-out,ease),border-color var(--motion-base,.6s) var(--ease-out,ease)}
.services li::before{content:"";position:absolute;inset:0;z-index:0;opacity:0;background:linear-gradient(90deg,rgb(var(--aqua-rgb),.05),transparent 68%);transition:opacity var(--motion-base,.6s) var(--ease-out,ease)}
.services li::after{content:"";position:absolute;right:0;bottom:-1px;left:0;height:1px;background:rgb(var(--aqua-rgb),.72);opacity:.42;transform:scaleX(0);transform-origin:left;transition:transform var(--motion-slow,.72s) var(--ease-out,ease),opacity var(--motion-base,.6s) var(--ease-out,ease)}
.js:not(.motion-reduced) .services li.is-visible::after{transform:scaleX(1)}
.services li b,.services li strong,.services li span{transition:transform var(--motion-base,.6s) var(--ease-out,ease),color var(--motion-base,.6s) var(--ease-out,ease),opacity var(--motion-base,.6s) var(--ease-out,ease),letter-spacing var(--motion-base,.6s) var(--ease-out,ease)}
.services li>*{position:relative;z-index:1}.services li span{opacity:.76;transform:translateX(-4px)}
@media (hover:hover) and (pointer:fine){
  .services li:hover{padding-left:0;border-bottom-color:rgb(var(--aqua-rgb),.32)}
  .services li:hover::before{opacity:1}
  .services li:hover::after{opacity:.9;transform:scaleX(1)}
  .services li:hover b{color:var(--aqua);transform:translateX(4px)}
  .services li:hover strong{transform:translateX(8px);letter-spacing:.01em}
  .services li:hover span{opacity:1;transform:translateX(0)}
}
@media (max-width:760px){.global-spotlight{display:none}.services li span{opacity:1;transform:none}.services li::after{opacity:.28}}
@media (prefers-reduced-motion:reduce){.global-spotlight{display:none}.services li::after{transform:scaleX(1)}}

/* Sobre — ilustração pixel art fornecida */
.about-grid{grid-template-columns:minmax(320px,.92fr) minmax(0,1.08fr);gap:clamp(2.5rem,5vw,5rem);align-items:center;position:relative}.about-grid:before{content:'';grid-column:1;grid-row:1/3;justify-self:center;width:clamp(320px,35vw,500px);max-width:100%;aspect-ratio:1312/1199;background:radial-gradient(circle,rgba(111,209,204,.06),transparent 65%),url('../assets/images/2c488cb5-7d0f-4602-a9ba-1bead275641b.png') center/contain no-repeat;will-change:transform,clip-path;transition:transform var(--motion-base) var(--ease-spring)}.about-grid>div:first-child{grid-column:2;grid-row:1}.about-grid>div:nth-child(2){grid-column:2;grid-row:2}.about-grid>div:nth-child(2) .about-copy:last-of-type{margin-bottom:0}.about .github{margin-bottom:2.5rem}.about .tech{margin:0}.js:not(.motion-reduced) .about-grid.about-art-reveal:before{opacity:0;clip-path:inset(0 0 8% 0);transform:translate3d(0,12px,0) scale(.97);transition:opacity 700ms var(--ease-out),transform 700ms var(--ease-out),clip-path 700ms var(--ease-out)}.js:not(.motion-reduced) .about-grid.about-art-reveal.is-art-visible:before{opacity:1;clip-path:inset(0);transform:translate3d(var(--about-shift-x,0px),var(--about-shift-y,0px),0) scale(1)}
@media (max-width:900px){.about-grid{grid-template-columns:1fr;gap:2.6rem}.about-grid:before{grid-column:1;grid-row:1;width:min(85vw,440px)}.about-grid>div:first-child,.about-grid>div:nth-child(2){grid-column:1;grid-row:auto}.about-grid>div:nth-child(2){margin-top:0}}
@media (max-width:760px){.about-grid{display:grid;gap:2.2rem}.about-grid:before{width:min(85vw,380px)}}
@media (prefers-reduced-motion:reduce){.about-grid:before{transform:none!important;clip-path:none!important;background-image:url('../assets/images/2c488cb5-7d0f-4602-a9ba-1bead275641b.png')}}

.about-grid{column-gap:clamp(2.5rem,5vw,5rem);row-gap:1.5rem}
@media (max-width:900px){.about-grid{gap:2.2rem}.about-grid>div:first-child,.about-grid>div:nth-child(2){margin-top:0}}

/* Sobre: a grade controla a composição; o wrapper interno controla somente o reveal. */
.about-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(2.5rem,5vw,5rem);align-items:center}.about-grid:before{content:none}.about-grid>div.about-art{grid-column:1;grid-row:1/3;justify-self:center;width:min(100%,540px);margin-top:0}.about-art-motion{width:100%}.about-art img{display:block;width:100%;height:auto;max-width:none}.about-grid>div.about-heading{grid-column:2;grid-row:1;margin-top:0}.about-grid>div.about-content{grid-column:2;grid-row:2;margin-top:0}.about-content .about-copy:last-of-type{margin-bottom:0}.about .github{margin-bottom:2.5rem}.about .tech{margin:0}
@media (max-width:900px){.about-grid{grid-template-columns:1fr;gap:clamp(2.2rem,5vw,3.25rem)}.about-grid>div.about-art,.about-grid>div.about-heading,.about-grid>div.about-content{grid-column:1;grid-row:auto}.about-grid>div.about-art{width:min(88vw,440px)}.about-grid>div.about-heading,.about-grid>div.about-content{margin-top:0}}
@media (max-width:760px){.about-grid{display:grid;gap:2.2rem}.about-grid>div.about-art{width:min(88vw,420px)}}
@media (prefers-reduced-motion:reduce){.about-art-motion{opacity:1!important;transform:none!important}}
/* Editorial motion system — composition first, progressive enhancement always. */
:root{--motion-reveal:760ms;--motion-stagger:80ms;--motion-ease:cubic-bezier(.22,1,.36,1)}
.code{animation:none;transform-style:flat}
.motion-marquee{position:relative;z-index:1;overflow:hidden;border-block:1px solid var(--line);background:var(--surface);padding:.8rem 0;white-space:nowrap}
.motion-marquee__track{display:flex;width:max-content;will-change:transform;animation:editorial-marquee 36s linear infinite}
.motion-marquee span{display:inline-flex;align-items:center;color:var(--aqua);font:500 clamp(.75rem,1.15vw,.98rem) var(--mono);letter-spacing:.055em}.motion-marquee span:after{content:'—';margin:0 1.5rem;color:var(--muted)}
@keyframes editorial-marquee{to{transform:translateX(-50%)}}
/* JavaScript alone opts elements into hidden start states. Without it, all content is visible. */
.motion-active [data-reveal]{opacity:0;transform:translate3d(0,32px,0);transition:opacity var(--motion-reveal) var(--motion-ease),transform var(--motion-reveal) var(--motion-ease);transition-delay:var(--reveal-delay,0ms);will-change:transform,opacity}
.motion-active [data-reveal='left']{transform:translate3d(-34px,0,0)}.motion-active [data-reveal='right']{transform:translate3d(34px,0,0)}.motion-active [data-reveal='code']{transform:translate3d(22px,26px,0) scale(.975)}.motion-active [data-reveal='art']{transform:translate3d(-22px,20px,0) scale(.98)}.motion-active [data-reveal='project']{transform:translate3d(0,42px,0) scale(.985)}.motion-active [data-reveal='service']{transform:translate3d(0,20px,0)}.motion-active [data-reveal='contact-title']{transform:translate3d(0,44px,0);clip-path:inset(0 0 100% 0)}
.motion-active [data-reveal='hero-line']{display:inline-block;opacity:0;transform:translate3d(0,108%,0);clip-path:inset(0 0 100% 0);transition:opacity 820ms var(--motion-ease),transform 820ms var(--motion-ease),clip-path 820ms var(--motion-ease);transition-delay:var(--reveal-delay,0ms)}
.motion-active [data-reveal].is-revealed{opacity:1;transform:translate3d(0,var(--composition-y,0px),0)}.motion-active [data-reveal='code'].is-revealed{transform:translate3d(0,calc(var(--hero-scroll-y,0px) + var(--composition-y,0px)),0) scale(1)}.motion-active [data-reveal='art'].is-revealed{transform:translate3d(0,var(--art-scroll-y,0px),0) scale(1)}.motion-active [data-reveal='contact-title'].is-revealed{clip-path:inset(0);transform:translate3d(0,0,0)}.motion-active [data-reveal='hero-line'].is-revealed{opacity:1;transform:translate3d(0,0,0);clip-path:inset(0)}
/* Project imagery uses a mask, while the image itself is never observer-hidden. */
.motion-active [data-media-reveal]{clip-path:inset(0 0 100% 0);transition:clip-path 880ms var(--motion-ease);will-change:clip-path}.motion-active [data-media-reveal].is-revealed{clip-path:inset(0)}.portfolio-image img{transform:translate3d(0,var(--media-parallax,0px),0);transition:transform 300ms ease,border-color 180ms ease}.portfolio-image:hover img,.portfolio-image:focus-visible img{transform:translate3d(0,var(--media-parallax,0px),0) scale(1.015)}.jastur-item .portfolio-image img{transform:translate3d(0,var(--media-parallax,0px),0) scale(1.025)}.jastur-item .portfolio-image:hover img,.jastur-item .portfolio-image:focus-visible img{transform:translate3d(0,var(--media-parallax,0px),0) scale(1.04)}
/* Services are paced by their dividers, not independent fades. */
.services li{padding-left:0;overflow:hidden}.services li::after{transform:scaleX(0);transform-origin:left;transition:transform 760ms var(--motion-ease);opacity:.55}.motion-active .services li.is-revealed::after{transform:scaleX(1)}.services li b,.services li strong,.services li span{transition:transform 220ms ease-out,color 220ms ease-out,opacity 220ms ease-out}
@media (hover:hover) and (pointer:fine){.services li:hover b{transform:translateX(3px)}.services li:hover strong{transform:translateX(6px)}.services li:hover span{opacity:1;transform:translateX(2px)}}
.filters:before{transition:transform 260ms var(--motion-ease),width 260ms var(--motion-ease)}.portfolio-item.is-filter-entering{opacity:0;transform:translate3d(0,12px,0)!important}.portfolio-item.is-filter-leaving{opacity:0;transform:scale(.985)!important;transition:opacity 200ms ease,transform 200ms ease}
@media(max-width:760px){.motion-marquee{padding:.65rem 0}.motion-marquee__track{animation-duration:30s}.motion-marquee span:after{margin:0 1rem}.motion-active [data-reveal]{transform:translate3d(0,20px,0)}.motion-active [data-reveal='left'],.motion-active [data-reveal='right'],.motion-active [data-reveal='art'],.motion-active [data-reveal='code']{transform:translate3d(0,20px,0)}.motion-active [data-reveal='hero-line']{transform:translate3d(0,65%,0)}.motion-active [data-reveal].is-revealed{transform:none}.motion-active [data-reveal='contact-title'].is-revealed{transform:none}.motion-active [data-media-reveal]{clip-path:inset(0 0 10% 0)}.motion-active [data-media-reveal].is-revealed{clip-path:inset(0)}.portfolio-image img{transform:none!important}}
@media(prefers-reduced-motion:reduce){.motion-marquee__track{animation:none;transform:none}.motion-marquee__track span:nth-child(n+4){display:none}.motion-active [data-reveal],.motion-active [data-reveal='hero-line'],.motion-active [data-media-reveal]{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}.services li::after{transform:scaleX(1)}}