/* Progressive enhancement: reveal styles activate only after JS binds a target. */
.cbr-ready [data-cbr-bound="1"].reveal-cinematic,
.cbr-ready [data-cbr-bound="1"].reveal-drift,
.cbr-ready [data-cbr-bound="1"].reveal-left,
.cbr-ready [data-cbr-bound="1"].reveal-zoom,
.cbr-ready [data-cbr-bound="1"].reveal-on-scroll,
.cbr-ready [data-cbr-bound="1"].mask-line {
  --reveal: 0;
}

.cbr-ready [data-cbr-bound="1"].reveal-cinematic,
.cbr-ready [data-cbr-bound="1"].reveal-drift,
.cbr-ready [data-cbr-bound="1"].reveal-left,
.cbr-ready [data-cbr-bound="1"].reveal-zoom,
.cbr-ready [data-cbr-bound="1"].reveal-on-scroll {
  will-change: transform, filter, opacity;
}

.cbr-ready [data-cbr-bound="1"].reveal-cinematic {
  opacity: var(--reveal);
  transform: translateY(calc((1 - var(--reveal)) * 60px)) scale(calc(0.96 + var(--reveal) * 0.04));
  filter: blur(calc((1 - var(--reveal)) * 26px)) brightness(calc(0.55 + var(--reveal) * 0.45)) saturate(calc(0.60 + var(--reveal) * 0.40));
}

.cbr-ready [data-cbr-bound="1"].reveal-drift {
  opacity: var(--reveal);
  transform: translateY(calc((1 - var(--reveal)) * 50px)) rotate(calc((1 - var(--reveal)) * -1deg));
  filter: blur(calc((1 - var(--reveal)) * 20px)) saturate(calc(0.65 + var(--reveal) * 0.35));
}

.cbr-ready [data-cbr-bound="1"].reveal-left {
  opacity: var(--reveal);
  transform: translateX(calc((1 - var(--reveal)) * -90px));
  filter: blur(calc((1 - var(--reveal)) * 18px));
}

.cbr-ready [data-cbr-bound="1"].reveal-zoom {
  opacity: var(--reveal);
  transform: scale(calc(0.85 + var(--reveal) * 0.15));
  filter: blur(calc((1 - var(--reveal)) * 24px)) saturate(calc(0.70 + var(--reveal) * 0.30));
}

.cbr-ready [data-cbr-bound="1"].reveal-on-scroll {
  opacity: var(--reveal);
  transform: translateY(calc((1 - var(--reveal)) * 70px)) scale(calc(0.94 + var(--reveal) * 0.06));
  filter: blur(calc((1 - var(--reveal)) * 22px)) brightness(calc(0.70 + var(--reveal) * 0.30));
}

.cbr-ready [data-cbr-bound="1"].mask-line {
  display: block;
  overflow: hidden;
  will-change: transform;
}

.cbr-ready [data-cbr-bound="1"].mask-line .mask-line-inner {
  display: block;
  opacity: calc(0.15 + var(--reveal) * 0.85);
  transform: translateY(calc((1 - var(--reveal)) * 110%));
}

@media (prefers-reduced-motion: reduce) {
  .cbr-ready [data-cbr-bound="1"].reveal-cinematic,
  .cbr-ready [data-cbr-bound="1"].reveal-drift,
  .cbr-ready [data-cbr-bound="1"].reveal-left,
  .cbr-ready [data-cbr-bound="1"].reveal-zoom,
  .cbr-ready [data-cbr-bound="1"].reveal-on-scroll,
  .cbr-ready [data-cbr-bound="1"].mask-line,
  .cbr-ready [data-cbr-bound="1"].mask-line .mask-line-inner {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    will-change: auto !important;
  }
}

.cbr-ready [data-cbr-bound="1"].reveal-cinematic:focus-within,
.cbr-ready [data-cbr-bound="1"].reveal-drift:focus-within,
.cbr-ready [data-cbr-bound="1"].reveal-left:focus-within,
.cbr-ready [data-cbr-bound="1"].reveal-zoom:focus-within,
.cbr-ready [data-cbr-bound="1"].reveal-on-scroll:focus-within,
.cbr-ready [data-cbr-bound="1"].mask-line:focus-within .mask-line-inner {
  opacity: 1;
  transform: none;
  filter: none;
}