/* Section entrances: each block gets its own reveal on top of the shared motion-reveal timing. Transform, opacity and clip only. */
:root{--fx-ease:cubic-bezier(.16,1,.3,1)}

/* Section rule: a thin line draws across the top of each section as it enters, with a red light running ahead. */
.fx-section{position:relative}
.fx-rule{position:absolute;z-index:3;left:0;right:0;top:0;height:1px;pointer-events:none;overflow:hidden}
.fx-rule::before{content:"";position:absolute;inset:0;background:rgba(244,244,242,.14);transform:scaleX(0);transform-origin:left;transition:transform 1.6s var(--fx-ease)}
.fx-rule::after{content:"";position:absolute;top:0;left:0;width:22%;height:1px;background:linear-gradient(90deg,transparent,var(--dt-red,#d32f38),transparent);opacity:0;transform:translateX(-100%)}
.fx-in>.fx-rule::before{transform:scaleX(1)}
.fx-in>.fx-rule::after{animation:fx-run 1.8s var(--fx-ease) .1s both}
@keyframes fx-run{0%{opacity:0;transform:translateX(-100%)}15%{opacity:1}100%{opacity:0;transform:translateX(560%)}}

/* Markers: red dot pops, label wipes in from the left. */
html.motion-ready body.editorial-site .motion-reveal:is(.section-marker,.manifesto-marker,.capabilities-marker,.process-marker,.conversion-marker,.eyebrow)>span{transform:scale(0);transition:transform .7s var(--fx-ease) calc(var(--reveal-delay,0ms) + 120ms)}
html.motion-ready body.editorial-site .motion-reveal:is(.section-marker,.manifesto-marker,.capabilities-marker,.process-marker,.conversion-marker)>b{display:inline-block;clip-path:inset(0 100% 0 0);transition:clip-path 1s var(--fx-ease) calc(var(--reveal-delay,0ms) + 200ms)}
html.motion-ready body.editorial-site .motion-reveal.is-visible:is(.section-marker,.manifesto-marker,.capabilities-marker,.process-marker,.conversion-marker,.eyebrow)>span{transform:scale(1)}
html.motion-ready body.editorial-site .motion-reveal.is-visible:is(.section-marker,.manifesto-marker,.capabilities-marker,.process-marker,.conversion-marker)>b{clip-path:inset(0 0 0 0)}

/* Title lines: the masked rise gains a slight tilt that settles. */
html.motion-ready body.editorial-site .motion-reveal:is(.portfolio-title-line,.capability-title-line,.process-title-line,.faq-title-line,.conversion-title-line,.archive-title-line,.fit-title-line,.manifesto-thought)>span{transform:translate3d(0,112%,0) rotate(4deg);transform-origin:0 100%;transition:transform 1.25s var(--fx-ease) var(--reveal-delay,0ms)}

/* Especialidades: rows slide in from the left while a light sweeps their top border. */
html.motion-ready body.editorial-site .expertise-v2-list .service-item{position:relative}
html.motion-ready body.editorial-site .expertise-v2-list .service-item.motion-reveal{transform:translate3d(-64px,0,0)!important;--reveal-duration:1000ms}
html.motion-ready body.editorial-site .expertise-v2-list .service-item.motion-reveal.is-visible{transform:none!important}
html.motion-ready body.editorial-site :is(.expertise-v2-list .service-item,.process-v2-steps .process-step,.faq-list details).motion-reveal::after{content:"";position:absolute;left:0;top:-1px;width:30%;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,var(--dt-red,#d32f38),transparent);opacity:0}
html.motion-ready body.editorial-site :is(.expertise-v2-list .service-item,.process-v2-steps .process-step,.faq-list details).motion-reveal.is-visible::after{animation:fx-sweep 1.5s var(--fx-ease) calc(var(--reveal-delay,0ms) + 150ms) both}
@keyframes fx-sweep{0%{opacity:0;transform:translateX(-40%)}20%{opacity:1}100%{opacity:0;transform:translateX(330%)}}
html.motion-ready body.editorial-site .expertise-v2-list .service-item.motion-reveal>span{display:inline-block;opacity:0;transform:translate3d(0,100%,0);transition:opacity .6s ease calc(var(--reveal-delay,0ms) + 250ms),transform .9s var(--fx-ease) calc(var(--reveal-delay,0ms) + 250ms)}
html.motion-ready body.editorial-site .expertise-v2-list .service-item.motion-reveal.is-visible>span{opacity:1;transform:none}

/* Processo: steps tip forward out of depth, one after another. */
html.motion-ready body.editorial-site .process-v2-steps .process-step{position:relative}
html.motion-ready body.editorial-site .process-v2-steps .process-step.motion-reveal{transform:perspective(900px) translate3d(0,70px,0) rotateX(-16deg)!important;transform-origin:50% 0;--reveal-duration:1200ms}
html.motion-ready body.editorial-site .process-v2-steps .process-step.motion-reveal.is-visible{transform:none!important}
html.motion-ready body.editorial-site .process-v2-steps .process-step.motion-reveal>span{display:inline-block;transform:scale(.4);opacity:0;transition:transform 1s var(--fx-ease) calc(var(--reveal-delay,0ms) + 200ms),opacity .5s ease calc(var(--reveal-delay,0ms) + 200ms)}
html.motion-ready body.editorial-site .process-v2-steps .process-step.motion-reveal.is-visible>span{transform:none;opacity:1}

/* Perguntas: rows unveil from the left edge. */
html.motion-ready body.editorial-site .faq-list details{position:relative}
html.motion-ready body.editorial-site .faq-list details.motion-reveal{transform:translate3d(-40px,0,0)!important;clip-path:inset(0 100% 0 0);transition-property:opacity,transform,clip-path!important;--reveal-duration:1100ms}
html.motion-ready body.editorial-site .faq-list details.motion-reveal.is-visible{transform:none!important;clip-path:inset(-2px -2px -2px -2px)}

/* Sobre: the portrait opens like a shutter from below while the image settles from a deeper zoom. */
html.motion-ready body.editorial-site .about-portrait.motion-reveal{opacity:1!important;transform:none!important;clip-path:inset(100% 0 0 0);transition:clip-path 1.5s var(--fx-ease)!important}
html.motion-ready body.editorial-site .about-portrait.motion-reveal.is-visible{clip-path:inset(0 0 0 0)}
html.motion-ready body.editorial-site .about-portrait.motion-reveal img{transform:scale(1.32) translate3d(0,var(--photo-shift,0px),0);transition:filter .8s ease,transform 1.9s var(--fx-ease)}
html.motion-ready body.editorial-site .about-portrait.motion-reveal.is-visible img{transform:scale(1.06) translate3d(0,var(--photo-shift,0px),0)}
@media(hover:hover){html.motion-ready body.editorial-site .about-portrait.motion-reveal.is-visible:hover img{transform:scale(1.02) translate3d(0,var(--photo-shift,0px),0)}}
html.motion-ready body.editorial-site .about-copy>p.motion-reveal{transform:translate3d(0,40px,0)!important}
html.motion-ready body.editorial-site .about-copy>p.motion-reveal.is-visible{transform:none!important}

/* Trabalhos: main piece opens top-down with a zoom settle; supporting pieces open from the right. */
.portfolio-motion-ready .editorial-site .directed-case figure.case-reveal{opacity:1;transform:none;clip-path:inset(0 0 100% 0);transition:clip-path 1.4s var(--fx-ease) var(--case-delay,0ms)}
.portfolio-motion-ready .editorial-site .directed-case figure.project-secondary.case-reveal{clip-path:inset(0 0 0 100%)}
.portfolio-motion-ready .editorial-site .directed-case figure.case-reveal img{transform:scale(1.18);transition:transform 1.8s var(--fx-ease) var(--case-delay,0ms)}
.portfolio-motion-ready .editorial-site .directed-case figure.case-reveal.is-visible{clip-path:inset(0 0 0 0)}
.portfolio-motion-ready .editorial-site .directed-case figure.case-reveal.is-visible img{transform:none}
@media(hover:hover){.portfolio-motion-ready .editorial-site .directed-case:hover .project-protagonist.is-visible img{transform:scale(1.025)}.portfolio-motion-ready .editorial-site .project-secondary.is-visible:hover img{transform:scale(1.04)}}
.portfolio-motion-ready .editorial-site .preserved-case-strip figure.case-reveal{transform:translate3d(0,60px,0) scale(.94)}
.portfolio-motion-ready .editorial-site .preserved-case-strip figure.case-reveal.is-visible{transform:none}
.portfolio-motion-ready .editorial-site :is(.portfolio-interlude,.portfolio-pivot).case-reveal{transform:translate3d(0,48px,0);filter:none;transition:opacity .9s ease,transform 1.3s var(--fx-ease)}
.portfolio-motion-ready .editorial-site :is(.portfolio-interlude,.portfolio-pivot).case-reveal.is-visible{transform:none}

/* Novos projetos: cards rise as framed windows that open to full size. */
html.motion-ready body.editorial-site .landing-grid-card.motion-reveal{transform:translate3d(0,80px,0)!important;--reveal-duration:1200ms}
html.motion-ready body.editorial-site .landing-grid-card.motion-reveal.is-visible{transform:none!important}
html.motion-ready body.editorial-site .landing-grid-card.motion-reveal figure{clip-path:inset(10% 10% 10% 10%);transition:clip-path 1.4s var(--fx-ease) var(--reveal-delay,0ms),border-color .35s ease}
html.motion-ready body.editorial-site .landing-grid-card.motion-reveal.is-visible figure{clip-path:inset(0 0 0 0)}
html.motion-ready body.editorial-site .visual-project-loop.motion-reveal{transform:translate3d(120px,0,0)!important;--reveal-duration:1400ms}
html.motion-ready body.editorial-site .visual-project-loop.motion-reveal.is-visible{transform:none!important}

/* Contato: action and meta lift with a scale settle. */
html.motion-ready body.editorial-site .conversion-action.motion-reveal{transform:translate3d(0,48px,0) scale(.96)!important}
html.motion-ready body.editorial-site .conversion-action.motion-reveal.is-visible{transform:none!important}

/* Bottom showcase sits in the background: muted monochrome covers that take colour on hover. */
.editorial-site .project-index-loop .project-index-card figure{position:relative}
.editorial-site .project-index-loop .project-index-card figure::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to top,rgba(9,9,11,.75),rgba(9,9,11,.15) 55%);transition:opacity .6s ease}
.editorial-site .project-index-loop .project-index-card img{filter:grayscale(1) brightness(.7) contrast(.95)!important;opacity:.55;transition:filter .7s ease,opacity .7s ease,transform .9s var(--dt-ease)}
@media(hover:hover){
  .editorial-site .project-index-loop .project-index-card>a:hover img{filter:none!important;opacity:1}
  .editorial-site .project-index-loop .project-index-card>a:hover figure::after{opacity:0}
}
.editorial-site .project-index-loop .project-index-card>a:focus-visible img{filter:none!important;opacity:1}

@media(prefers-reduced-motion:reduce){
  .fx-rule::before{transform:none;transition:none}.fx-rule::after{display:none}
  html.motion-ready body.editorial-site .motion-reveal>*,html.motion-ready body.editorial-site .motion-reveal,html.motion-ready body.editorial-site .motion-reveal figure,html.motion-ready body.editorial-site .motion-reveal img{clip-path:none!important;transform:none!important;opacity:1!important;animation:none!important}
  html.motion-ready body.editorial-site .motion-reveal::after{display:none}
  .portfolio-motion-ready .editorial-site .case-reveal,.portfolio-motion-ready .editorial-site .case-reveal img{clip-path:none!important;transform:none!important}
}

/* Legibility floor for decorative labels on small screens. */
.editorial-site .identity-marquee-group span,.editorial-site .project-carousel-heading>div>span{font-size:10px!important}
.editorial-site .expertise-v2-list .service-item>span{font-size:11px}
