/* Bamera Ba: gesto editorial entre Quienes somos y Lo que hacemos */
:root { --ba-orange: #ff4e27; }
html, body { overflow-x: clip; }
#manifiesto { position: relative; overflow: visible; isolation: isolate; z-index: 2; }
#servicios { position: relative; z-index: 1; }
.ba-scroll-mark {
  --ba-progress: 0;
  position: absolute;
  z-index: 8;
  right: clamp(-8rem, -7vw, -3.5rem);
  bottom: clamp(-10rem, -8vw, -6rem);
  width: clamp(20rem, 30vw, 30rem);
  margin: 0;
  pointer-events: none;
  opacity: calc(.08 + (var(--ba-progress) * .92));
  transform-origin: 62% 58%;
  transform:
    translate3d(
      calc((1 - var(--ba-progress)) * 18vw),
      calc(-13rem + ((1 - var(--ba-progress)) * 8rem)),
      0
    )
    rotate(calc(-90deg + ((1 - var(--ba-progress)) * 8deg)))
    scale(calc(.84 + (var(--ba-progress) * .16)));
  filter:
    blur(calc((1 - var(--ba-progress)) * 4px))
    drop-shadow(0 1.5rem 2.5rem rgb(21 37 34 / calc(var(--ba-progress) * .09)));
  will-change: transform, opacity, filter;
}
.ba-scroll-mark img {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
}
@media (max-width: 760px) {
  .ba-scroll-mark {
    right: -36vw;
    bottom: -4rem;
    width: clamp(15rem, 70vw, 20rem);
    opacity: calc(.16 + (var(--ba-progress) * .84));
    transform:
      translate3d(
        calc((1 - var(--ba-progress)) * 30vw),
        calc(-6rem + ((1 - var(--ba-progress)) * 4rem)),
        0
      )
      rotate(calc(-90deg + ((1 - var(--ba-progress)) * 6deg)))
      scale(calc(.88 + (var(--ba-progress) * .12)));
    filter: blur(calc((1 - var(--ba-progress)) * 2px));
  }
}
@media (prefers-reduced-motion: reduce) {
  .ba-scroll-mark {
    --ba-progress: 1 !important;
    will-change: auto;
    filter: none;
  }
}