@layer cavalree {
	[data-cavalree="section@testimonials"i] {
		--c-text--align: center;

		position: relative;
	}

	[data-cavalree="section/asset@testimonials"i] {
	}

	[data-cavalree="section/content@testimonials"i] {
	}

	[data-cavalree="section/figure@testimonials"i] {
	}

	[data-cavalree="section/inner@testimonials"i] {
		& > [data-cavalree] {
			--c-composition--isolation: isolate;
		}

		& [data-cavalree="text/label@heading"i] {
			--c-text--case: uppercase;
		}

		& [hidden] {
			display: none;
		}

		& [data-cavalree="group@content"i]:has([data-cavalree="buttons"i]) + [data-cavalree="media"i] {
			--c-box--cursor: pointer;

			--c-composition--containment: paint;
	
			&::before {
				background: #000;
				content: "";
				inset: 0;
				opacity: 0.3;
				position: absolute;
				mix-blend-mode: multiply;
				z-index: 1;
			}
	
			&::after {
				background-color: #fff;
				border-radius: 9999px;
				mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M329.14 256c0 2.07-.53 4.11-1.54 5.91s-2.48 3.31-4.25 4.38l-109.77 67.15a12.2 12.2 0 0 1-6.14 1.79c-2.17.04-4.31-.5-6.2-1.56a12.16 12.16 0 0 1-4.52-4.43 12.13 12.13 0 0 1-1.67-6.1V188.85c0-2.15.58-4.25 1.67-6.1a12.16 12.16 0 0 1 4.52-4.43c1.89-1.06 4.03-1.6 6.2-1.56s4.29.66 6.14 1.79l109.77 67.15a11.98 11.98 0 0 1 5.79 10.29ZM256 512C114.84 512 0 397.16 0 256S114.84 0 256 0s256 114.84 256 256-114.84 256-256 256m0-505.9C118.2 6.1 6.1 118.2 6.1 256S118.21 505.9 256 505.9 505.91 393.79 505.91 256 393.8 6.1 256 6.1'/%3E%3C/svg%3E");
				block-size: 5.25rem;
				inline-size: 5.25rem;
				content: "";
				inset: 50%;
				translate: -50% -50%;
				position: absolute;
				z-index: 1;
			}
		}
	}

	[data-cavalree="section/kicker@testimonials"i] {
	}

	[data-cavalree="section/label@testimonials"i] {
	}
}


.cavalree-slider_controls {
  position: absolute;
  inset-block-end: 2.25rem;
  inset-inline-end: var(--c-box--padding--inline--end);
  inline-size: fit-content;
  display: flex;
  gap: 1rem;
}

.cavalree-slider_prev,
.cavalree-slider_next {
  background-color: currentcolor;
  inline-size: 2.5rem;
  block-size: 2.5rem;
  border: 0;
	color: inherit;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  contain: paint;
	mask-position: center;
	mask-repeat: no-repeat;
	mask-size: 2rem;
}

.cavalree-slider_prev {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M225.72 512 256 482.06 56.68 256.01 256 29.92 225.72 0 0 256.01z'/%3E%3C/svg%3E");
}

.cavalree-slider_next {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M158.28 512 128 482.06l199.32-226.05L128 29.92 158.28 0 384 256.01z'/%3E%3C/svg%3E");
}

@keyframes vt-slide-in {
  from {
    opacity: 0.001;
    transform: translateX(calc(var(--vt-dir, 1) * 25%));
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes vt-slide-out {
  from {
    opacity: 1;
    transform: translateX(0);
  }

  to {
    transform: translateX(calc(var(--vt-dir, 1) * -25%));
    opacity: 0.001;
  }
}

/* These layers are auto-created by the browser around the element that has
   view-transition-name: active-slide; before and after the DOM change. */
::view-transition-old(active-slide) {
  animation: vt-slide-out 300ms ease both;
}
::view-transition-new(active-slide) {
  animation: vt-slide-in 320ms ease both;
}

/* Prefer-reduced-motion support */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(active-slide),
  ::view-transition-new(active-slide) { animation: none; }
}
