/* =========================================================
   MICP v391 — Como Trabalhamos / movimento institucional
   Escopo exclusivo da página. Efeitos discretos, uma única vez.
   ========================================================= */

@media (prefers-reduced-motion: no-preference){
  html.micp-motion .page-how-we-work .how-tools-clean__intro,
  html.micp-motion .page-how-we-work .how-process__header,
  html.micp-motion .page-how-we-work .how-intro__symbol,
  html.micp-motion .page-how-we-work .how-intro__statement,
  html.micp-motion .page-how-we-work .how-difference__intro,
  html.micp-motion .page-how-we-work .how-tools-clean__item,
  html.micp-motion .page-how-we-work .how-process-step,
  html.micp-motion .page-how-we-work .how-principle-card,
  html.micp-motion .page-how-we-work .how-difference__item{
    opacity:0;
    transform:translateY(16px);
    transition:
      opacity 560ms cubic-bezier(.22,.61,.36,1),
      transform 560ms cubic-bezier(.22,.61,.36,1),
      border-color 220ms ease,
      box-shadow 220ms ease,
      background-color 220ms ease;
    will-change:opacity,transform;
  }

  html.micp-motion .page-how-we-work .is-revealed.how-tools-clean__intro,
  html.micp-motion .page-how-we-work .is-revealed.how-process__header,
  html.micp-motion .page-how-we-work .is-revealed.how-intro__symbol,
  html.micp-motion .page-how-we-work .is-revealed.how-intro__statement,
  html.micp-motion .page-how-we-work .is-revealed.how-difference__intro,
  html.micp-motion .page-how-we-work .is-revealed.how-tools-clean__item,
  html.micp-motion .page-how-we-work .is-revealed.how-process-step,
  html.micp-motion .page-how-we-work .is-revealed.how-principle-card,
  html.micp-motion .page-how-we-work .is-revealed.how-difference__item{
    opacity:1;
    transform:translateY(0);
    will-change:auto;
  }

  /* Linha do processo: construída da esquerda para a direita, sem pulsação. */
  html.micp-motion .page-how-we-work .how-process__steps::before{
    transform:scaleX(0);
    transform-origin:left center;
    transition:transform 820ms cubic-bezier(.22,.61,.36,1) 120ms;
  }
  html.micp-motion .page-how-we-work .how-process__steps.is-line-revealed::before{
    transform:scaleX(1);
  }

  /* Microinteração mínima: apenas dispositivos que realmente têm hover. */
  @media (hover:hover) and (pointer:fine){
    .page-how-we-work .how-tools-clean__item,
    .page-how-we-work .how-principle-card,
    .page-how-we-work .how-difference__item{
      transition:
        opacity 560ms cubic-bezier(.22,.61,.36,1),
        transform 220ms ease,
        border-color 220ms ease,
        box-shadow 220ms ease,
        background-color 220ms ease;
    }
    .page-how-we-work .how-tools-clean__item:hover,
    .page-how-we-work .how-principle-card:hover,
    .page-how-we-work .how-difference__item:hover{
      transform:translateY(-3px);
    }
  }
}

@media (prefers-reduced-motion: reduce){
  .page-how-we-work .how-tools-clean__intro,
  .page-how-we-work .how-process__header,
  .page-how-we-work .how-intro__symbol,
  .page-how-we-work .how-intro__statement,
  .page-how-we-work .how-difference__intro,
  .page-how-we-work .how-tools-clean__item,
  .page-how-we-work .how-process-step,
  .page-how-we-work .how-principle-card,
  .page-how-we-work .how-difference__item,
  .page-how-we-work .how-process__steps::before{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
    animation:none!important;
  }
}
