/* V3 — original identity, scroll-led composition. The document remains native and linear. */
:root{--motion-ease:cubic-bezier(.22,1,.36,1)}
html{scroll-padding-top:94px}
.tex-giz::before{opacity:.35}
.prancha::after{opacity:1}
.prancha{box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),inset 0 -60px 120px rgba(0,0,0,.18)}
.prancha.quadro-negro{--prancha:#234A3B;background-color:var(--prancha)}
.portfolio-motion .nav{z-index:1000}
.portfolio-motion .hero{overflow:clip}
.portfolio-motion .hero-visual{transform:translate3d(0,calc(var(--hero-p,0) * 32px),0) scale(calc(1 - var(--hero-p,0) * .035));transform-origin:60% 40%}
.portfolio-motion .hero .g-gira{animation:gira var(--dur-orbita) linear infinite}
.portfolio-motion .hero .hero-visual .prancha{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.portfolio-motion .rv{opacity:1;transform:none;transition:none}
/* Services arrive in sequence, then stay available to touch and keyboard. */
.portfolio-motion .services-section{padding:36px 0 90px}
.portfolio-motion .services-heading{margin-bottom:28px}
.portfolio-motion .services-heading h2{font-size:20px}
.motion-ready .service{transform:translate3d(0,calc((1 - var(--entry,1)) * 35px),0);opacity:calc(.4 + var(--entry,1) * .6);transition:border-color .25s,background .25s}
.service .service-art .s-dot{transform:translateX(calc((1 - var(--entry,1)) * -6px))}
.service:is(:hover,:focus-within,[open]) .service-art .s-dot{transform:translateX(4px)}
/* Native sticky cards recreate the layered progression without intercepting scrolling. */
.portfolio-motion #trabalho{padding-top:74px;padding-bottom:100px}
.portfolio-motion #trabalho>.wrap{max-width:1280px}
.portfolio-motion #trabalho .cabeca{margin-bottom:44px}
.portfolio-motion .case-stack{display:block;isolation:isolate;padding-bottom:3vh}
.portfolio-motion .case-stack .case{display:grid;grid-template-columns:54% 46%;position:sticky;top:calc(98px + var(--card-index) * 12px);min-height:440px;height:min(62vh,530px);margin-bottom:16vh;border:1px solid var(--linha-forte);background:var(--papel-1);border-radius:16px;box-shadow:0 12px 40px rgba(17,41,28,.07);transform-origin:center top;transform:scale(var(--stack-scale,1));overflow:hidden;transition:box-shadow .25s}
.portfolio-motion .case-stack .case:last-child{margin-bottom:0}
.portfolio-motion .case-stack .case::after{content:"";position:absolute;inset:0;pointer-events:none;background:#0f241b;opacity:var(--stack-shade,0);border-radius:inherit}
.portfolio-motion .case-stack .case:focus-visible{z-index:10;outline-offset:4px}
.portfolio-motion .case-stack .case .capa-case{height:100%;aspect-ratio:auto;border-radius:0}
.portfolio-motion .case-stack .case .corpo{padding:42px 36px;justify-content:center;gap:18px}
.portfolio-motion .case-stack .case h3{font-size:clamp(22px,2.2vw,30px);font-weight:500;line-height:1.2}
.portfolio-motion .case-stack .case p{font-size:15px;line-height:1.65}
.portfolio-motion .case-stack .ler{margin-top:16px;padding-top:0}
/* Career tracks: one uninterrupted, full-width drawing across the scroll chapter. */
.portfolio-motion .about-section{padding:0;border:0}
.timeline-scroll{position:relative;height:240vh;height:240svh;min-height:1400px;background:var(--papel-2);border-block:1px solid var(--linha)}
.timeline-sticky{position:sticky;top:68px;min-height:560px;height:calc(100vh - 68px);height:calc(100svh - 68px);max-height:850px;padding:28px clamp(24px,5vw,84px) 30px;display:flex;flex-direction:column;justify-content:space-between;overflow:clip}
.timeline-top{display:flex;justify-content:space-between;gap:24px;font:400 11px var(--mono);color:var(--tinta-3);letter-spacing:.025em}
.timeline-top a{font:400 12px var(--font);color:var(--tinta-2);padding-bottom:4px;border-bottom:1px solid var(--linha-forte)}
.timeline-title{display:flex;align-items:center;justify-content:space-between;gap:40px;margin-top:12px}
.timeline-title .eyebrow{margin:0 0 12px}
.timeline-title h2{font:500 clamp(30px,3.2vw,48px)/1.1 var(--font);letter-spacing:-.04em}
.timeline-year{font:400 clamp(64px,8.5vw,128px)/1 var(--font);letter-spacing:-.075em;color:var(--verde);font-variant-numeric:tabular-nums}
.career-chart{width:100%;margin:12px 0;flex:1;min-height:280px;max-height:430px;position:relative;transform:scale(calc(.97 + var(--timeline-p,1) * .03));transform-origin:center 75%}
.career-chart svg{display:block;width:100%;height:100%;overflow:visible}
.career-chart .track-base{stroke:var(--linha-forte);stroke-width:1;opacity:.6}
.career-chart .track-path{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.career-chart .track-product{color:var(--verde)}
.career-chart .track-ux{color:#168456}
:root[data-theme=dark] .career-chart .track-ux{color:#42B986}
.career-chart .track-product .track-path{stroke-width:6}
.career-chart .track-ux .track-path{stroke-width:4}
.career-chart .track-secondary{color:var(--tinta-3)}
.career-chart .track-label{font:500 16px var(--font);fill:currentColor;stroke:none}
.career-chart .track-secondary .track-label{font-size:13px;font-weight:400}
.career-chart .track-guide{stroke:currentColor;stroke-width:1;stroke-dasharray:2 5;opacity:.23}
.career-chart .track-dot{fill:var(--papel-2);stroke:currentColor;stroke-width:2}
.career-chart .track-tip{fill:currentColor;stroke:none}
.career-chart .career-axis{stroke:var(--linha-forte);stroke-width:1;fill:none}
.career-chart .year-label{font:400 11px var(--mono);fill:var(--tinta-3)}
.career-chart .milestone{font:400 11px var(--font);fill:var(--tinta-2)}
.career-chart .time-cursor{stroke:var(--verde);stroke-width:1;stroke-dasharray:2 5;opacity:.28}
.career-chart .track-glow{stroke:currentColor;stroke-width:18;stroke-linecap:round;opacity:.045}
.timeline-bottom{display:grid;grid-template-columns:1fr 180px auto;gap:32px;align-items:center;margin-top:4px;border-top:1px solid var(--linha);padding-top:20px}
.timeline-caption{font:400 14px/1.5 var(--font);color:var(--tinta-2);max-width:640px;min-height:42px}
.timeline-range{font:400 11px var(--mono);color:var(--tinta-3)}
.timeline-meter{height:2px;background:var(--linha-forte);overflow:hidden}
.timeline-meter i{display:block;height:100%;background:var(--verde);transform-origin:left;transform:scaleX(var(--timeline-p,1))}
.about-context{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:72px;align-items:start;padding-top:100px!important;padding-bottom:110px!important}
.about-story{padding-top:18px}
.about-story .h-sec{margin:16px 0 30px;font-size:clamp(30px,3vw,40px)}
.about-story>p:not(.eyebrow){font-size:15px;line-height:1.75;color:var(--tinta-2);margin:0 0 22px}
.life-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-self:center}
.life-photo{aspect-ratio:4/5;margin:0;overflow:hidden;border-radius:8px;background:var(--papel-2);transform:translate3d(0,calc((1 - var(--entry,1)) * 42px),0)}
.life-photo:nth-child(even){transform:translate3d(0,calc((1 - var(--entry,1)) * 64px + 24px),0)}
.life-photo img{display:block;height:100%;width:100%;object-fit:cover;filter:saturate(.85);transform:scale(calc(1.07 - var(--entry,1) * .07))}
/* Methods keep the original green-grid diagrams and scrub their strokes. */
.portfolio-motion #metodo{background:#142A21;padding-block:96px;overflow:clip}
.portfolio-motion #metodo .metodos{gap:28px}
.portfolio-motion #metodo .metodo{transform:translate3d(0,calc((1 - var(--entry,1)) * var(--method-travel,50px)),0)}
.portfolio-motion #metodo .metodo:nth-child(2){--method-travel:95px}
.portfolio-motion #metodo .metodo .prancha{height:320px;background-color:#234A3B;--prancha:#234A3B;--prancha-fundo:#183428}
.portfolio-motion #metodo .corpo{padding:28px;min-height:230px}
/* Lab: interfaces have their own scale, depth and scroll progression. */
.portfolio-motion .lab-section{padding:90px 0 40px}
.lab-story{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:50px;align-items:center;margin:70px 0 110px;min-height:560px}
.lab-story-copy{position:relative;z-index:2}
.lab-story-copy .chip{margin-bottom:22px}
.lab-story-copy h3{font:500 clamp(25px,2.5vw,34px)/1.15 var(--font);letter-spacing:-.035em;margin:0 0 20px}
.lab-story-copy p{font-size:14px;line-height:1.75;color:var(--tinta-2);margin-bottom:26px}
.lab-case-link{padding:0;margin-top:0;font-size:13px}
.lab-stage{position:relative;min-width:0;aspect-ratio:1.22;border-radius:14px;overflow:hidden;isolation:isolate;transform:translate3d(0,calc((1 - var(--entry,1)) * 38px),0);border:1px solid rgba(24,44,32,.07)}
.brain-showcase{background:#090c10}
.brain-screen{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:15px;opacity:0;transform:translate3d(0,20px,0) scale(.94);transition:opacity .45s ease,transform .7s var(--motion-ease)}
.brain-showcase[data-view=grafo] .screen-grafo,.brain-showcase[data-view=voz] .screen-voz,.brain-showcase[data-view=ecossistema] .screen-ecossistema{opacity:1;transform:translate3d(0,calc((1 - var(--entry,1)) * 25px),0) scale(calc(.93 + var(--entry,1) * .07))}
.brain-views{display:flex;flex-wrap:wrap;gap:6px;margin-top:30px}
.brain-views button{border:1px solid var(--linha);background:transparent;border-radius:5px;padding:8px 10px;color:var(--tinta-2);font:400 11px var(--font);cursor:pointer;transition:background .2s,color .2s}
.brain-views button[aria-pressed=true]{color:var(--papel-1);background:var(--verde);border-color:var(--verde)}
.stage-note{position:absolute;bottom:17px;left:22px;font:400 10px var(--mono);letter-spacing:.02em;color:rgba(237,242,238,.56)}
.map-showcase{background:#e9ecf2;display:flex;align-items:center;justify-content:center}
.map-screen{width:113%;flex:none;transform:translate3d(0,calc((1 - var(--entry,1)) * 40px),0) scale(calc(.92 + var(--entry,1) * .08));box-shadow:0 18px 45px rgba(24,36,54,.08)}
.map-screen img{display:block;width:100%;height:auto}
.map-showcase .stage-note{color:#56626e}
.jbc-showcase{background:#940020}
.jbc-brand{position:absolute;top:0;left:0;width:100%;height:65%;object-fit:cover;transform:translateY(calc(var(--scene-p,0) * -24px))}
.jbc-screen{position:absolute;width:88%;left:6%;top:43%;border-radius:7px;overflow:hidden;box-shadow:0 12px 45px rgba(60,0,12,.22);transform:translate3d(0,calc((1 - var(--entry,1)) * 65px),0) rotate(calc((1 - var(--entry,1)) * -3deg))}
.jbc-screen img{display:block;width:100%;height:auto}
/* The last board opens into the contact invitation. */
.portfolio-motion #contato .contato-prancha{transform:scale(calc(.94 + var(--entry,1) * .06));transform-origin:center bottom}
.portfolio-motion #contato{overflow:clip;padding-bottom:75px}
.portfolio-motion .contato{padding:80px 48px}
.brain-case-gallery{display:grid;gap:32px;margin-bottom:34px}
.brain-case-gallery figure{margin:0}
.brain-case-gallery img{display:block;width:100%;height:auto;border-radius:10px}
.brain-case-gallery figcaption{font-size:12px;color:var(--tinta-3);padding-top:10px}
@media(min-width:1500px){.timeline-sticky{padding-inline:7vw}.career-chart{max-height:460px}}
@media(max-width:1050px){
 .portfolio-motion .case-stack .case{grid-template-columns:50% 50%;min-height:420px}.portfolio-motion .case-stack .case .corpo{padding:28px}.portfolio-motion .case-stack .case h3{font-size:24px}.portfolio-motion .case-stack .case p{font-size:14px}
 .about-context{gap:40px}.lab-story{gap:28px;grid-template-columns:3fr 6fr;min-height:480px}.timeline-bottom{grid-template-columns:1fr 120px auto;gap:20px}
}
@media(max-width:760px){
 .portfolio-motion .hero-visual{transform:none}
 .portfolio-motion .services-section{padding-bottom:55px}
 .portfolio-motion #trabalho{padding:50px 0 64px}
 .portfolio-motion .case-stack{padding:0;display:grid;grid-template-columns:1fr;gap:26px}
 .portfolio-motion .case-stack .case{position:relative;top:auto;margin:0;display:flex;height:auto;min-height:0;transform:none;box-shadow:none}
 .portfolio-motion .case-stack .case::after{display:none}.portfolio-motion .case-stack .case .capa-case{height:245px;aspect-ratio:auto}.portfolio-motion .case-stack .case .corpo{padding:25px}.portfolio-motion .case-stack .case h3{font-size:24px}
 .timeline-scroll{height:210svh;min-height:1200px}.timeline-sticky{top:64px;min-height:510px;height:calc(100svh - 64px);padding:24px 22px}
 .timeline-top{font-size:9px;gap:12px}.timeline-top a{font-size:11px}.timeline-title{gap:20px;margin-top:20px}.timeline-title h2{font-size:28px}.timeline-title .eyebrow{font-size:11px;max-width:180px}.timeline-year{font-size:64px}
 .career-chart{min-height:250px;max-height:360px;margin:10px 0}.career-chart .track-label{font-size:13px}.career-chart .track-secondary .track-label{font-size:11px}.career-chart .year-label{font-size:9px}.career-chart .milestone{font-size:9px}
 .timeline-bottom{grid-template-columns:1fr auto;gap:12px;padding-top:14px}.timeline-caption{font-size:12px;min-height:54px}.timeline-meter{grid-row:2;grid-column:1/-1}.timeline-range{font-size:9px}
 .about-context{grid-template-columns:1fr;gap:28px;padding-top:60px!important;padding-bottom:84px!important}.about-story{padding:0}.about-story .h-sec{font-size:32px}.about-story>p:not(.eyebrow){font-size:14px;line-height:1.75}
 .life-grid{gap:10px}.life-photo{aspect-ratio:4/5}.life-photo:nth-child(even){transform:translate3d(0,calc((1 - var(--entry,1)) * 35px + 18px),0)}
 .portfolio-motion #metodo{padding:64px 0}.portfolio-motion #metodo .metodos{grid-template-columns:1fr;gap:32px}.portfolio-motion #metodo .metodo .prancha{height:275px}.portfolio-motion #metodo .corpo{min-height:0;padding:24px}
 .portfolio-motion .lab-section{padding-top:60px}.lab-story{grid-template-columns:1fr;gap:24px;margin:46px 0 64px;min-height:0}.lab-story-copy .chip{margin-bottom:14px}.lab-story-copy h3{font-size:28px;margin-bottom:14px}.lab-story-copy p{font-size:14px;margin-bottom:18px}.brain-views{margin-top:22px}.lab-stage{aspect-ratio:1.1}.brain-screen{padding:8px}.stage-note{font-size:8px;left:14px;bottom:12px}
 .portfolio-motion .contato{padding:50px 24px}.portfolio-motion #contato{padding-bottom:40px}
}
@media(max-height:650px){.timeline-sticky{min-height:470px;padding-block:18px}.timeline-title{margin:5px 0}.timeline-title h2{font-size:30px}.timeline-year{font-size:68px}.career-chart{min-height:220px}.timeline-caption{font-size:12px;min-height:20px}}
/* Content is complete without motion, JS, or a precise scrolling device. */
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}.timeline-scroll{height:auto;min-height:0}.timeline-sticky{position:relative;top:auto;height:auto;min-height:600px;max-height:none}.career-chart{min-height:340px}
 .portfolio-motion .case-stack .case{position:relative;top:auto;margin-bottom:30px;transform:none!important}
 .portfolio-motion .hero-visual,.service,.life-photo,.life-photo img,.metodo,.lab-stage,.brain-screen,.map-screen,.jbc-screen,.jbc-brand,.contato-prancha{transform:none!important;transition:none!important;animation:none!important;opacity:1}
 .brain-screen{opacity:0!important}.brain-showcase[data-view=grafo] .screen-grafo,.brain-showcase[data-view=voz] .screen-voz,.brain-showcase[data-view=ecossistema] .screen-ecossistema{opacity:1!important}
 .career-chart{transform:none}.portfolio-motion .case-stack .case::after{display:none}.portfolio-motion .tr{stroke-dashoffset:0!important}
}
/* One heading family across the home, cases and interactive frameworks. */
:root{--font-heading:'Archivo',sans-serif}
body :is(h1,h2,h3,h4,h5,h6){font-family:var(--font-heading)!important;font-weight:600!important}
.timeline-year{font-family:var(--font-heading);font-weight:600}
html:not(.motion-ready) .timeline-scroll{height:auto;min-height:0}
html:not(.motion-ready) .timeline-sticky{position:relative;top:auto}
/* Six complementary services: a compact, balanced grid. */
.portfolio-motion .services{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.portfolio-motion .service summary{padding:22px}
.portfolio-motion .service h3{min-height:0;font-size:17px}
.portfolio-motion .service summary>p{min-height:0;font-size:13px}
.portfolio-motion .service-art{margin-bottom:20px}
.service:is(:hover,:focus-within,[open]) .art-5 .s-ring{transform:scale(1.18)}
@media(max-width:600px){.portfolio-motion .services{grid-template-columns:1fr 1fr;gap:10px}.portfolio-motion .service summary{padding:16px 14px}.portfolio-motion .service h3{font-size:15px;min-height:39px}.portfolio-motion .service summary>p{font-size:12px;min-height:54px}}
/* Refinements: equal service tiles, green photo contact sheet, editorial proof points. */
.portfolio-motion .services{align-items:start}
.portfolio-motion .service summary{height:236px;display:flex;flex-direction:column;align-items:flex-start}
.portfolio-motion .service summary>p{min-height:0}
.portfolio-motion .service-more{margin-top:auto;width:100%;padding-top:16px}
.portfolio-motion .service-art{flex:none}
.portfolio-motion .service[open]{background:var(--papel-1)}
.about-context{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px}
.life-grid{align-self:start;position:sticky;top:100px}
.life-photo,.life-photo:nth-child(even){aspect-ratio:4/5;transform:translate3d(0,calc((1 - var(--entry,1)) * 36px),0)}
.life-photo img{filter:grayscale(1) contrast(1.06) brightness(1.02);transition:filter .55s,transform 1.2s var(--motion-ease)}
.life-photo:hover img{filter:none;transform:scale(1.035)}
.life-photo:nth-child(1) img{object-position:50% 45%}
.life-photo:nth-child(5) img{object-position:43% 50%}
.about-story .h-sec{margin-bottom:28px}
.about-proof{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:0 0 34px;padding:24px 0 20px;border-block:1px solid var(--linha-forte)}
.proof-item{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.proof-value{font:600 clamp(52px,5.4vw,76px)/.95 var(--font-heading);letter-spacing:-.055em;color:var(--verde);transform:translateY(calc((1 - var(--entry,1)) * 18px))}
.proof-value>span{font-size:.5em;vertical-align:top;line-height:1.3;margin-left:3px}
.proof-item p{font-size:12px;line-height:1.55;color:var(--tinta-2);max-width:240px}
.proof-item svg{width:100%;height:20px;margin-top:auto;stroke:var(--linha-forte);fill:none;stroke-width:1}
.proof-item .proof-line{stroke:var(--verde);stroke-width:2;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--entry,1))}
.proof-item circle{fill:var(--verde);stroke:none}
.case-folha{overscroll-behavior:contain;scrollbar-gutter:stable}
.case-folha .fechar{position:fixed;top:18px;right:20px;z-index:10}
.case-folha h3{font-size:14px;letter-spacing:0;text-transform:none}
.case-folha .conteudo p{font-size:15px;line-height:1.7}
@media(max-width:1050px){.about-context{gap:36px}.about-proof{gap:20px}.portfolio-motion .service summary{height:250px}}
@media(max-width:760px){.about-context{grid-template-columns:1fr}.life-grid{position:relative;top:auto}.life-photo,.life-photo:nth-child(even){transform:translate3d(0,calc((1 - var(--entry,1)) * 28px),0)}.about-proof{margin-bottom:28px}.proof-value{font-size:64px}}
@media(max-width:600px){.portfolio-motion .service summary{height:246px}.portfolio-motion .service h3{min-height:39px}.portfolio-motion .service-more{margin-top:auto}.proof-item p{font-size:12px}.about-context{gap:40px}.portfolio-motion .service-art{margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){.portfolio-motion .hero .g-gira{animation:none}.proof-value,.life-photo,.life-photo:nth-child(even){transform:none}.proof-line{stroke-dashoffset:0!important}}
/* The same signature drawing also runs on the standalone project pages. */
@keyframes simbolo-traco{to{stroke-dashoffset:0}}
@keyframes simbolo-tinta{to{fill-opacity:1;stroke-opacity:0}}
@media(prefers-reduced-motion:no-preference){
 .nav .logo-simbolo path{fill:currentColor;fill-opacity:0;stroke:currentColor;stroke-opacity:1;stroke-width:9;stroke-dasharray:1;stroke-dashoffset:1;animation:simbolo-traco 1.1s var(--ease-traco) forwards,simbolo-tinta .5s var(--ease-out) forwards}
 .nav .logo-simbolo path:nth-child(1){animation-delay:.1s,1.05s}.nav .logo-simbolo path:nth-child(2){animation-delay:.25s,1.15s}.nav .logo-simbolo path:nth-child(3){animation-delay:.4s,1.25s}.nav .logo-simbolo path:nth-child(4){animation-delay:.55s,1.35s}
}