/**
 * Alma Management — SEBS™ Motion
 * Clean bronze colour-swipe reveal + complete SVG drawing.
 */

/* ==========================================================================
   1. Clean bronze swipe reveal
   ========================================================================== */

html.sebs-motion-boot {
	background: #f7f4f0;
}

html.sebs-motion-boot body {
	opacity: 0;
}

html.sebs-motion-mounted body {
	opacity: 1;
	transition: opacity 240ms ease-out;
}

#sebs-reveal-swipe {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	pointer-events: none;
	overflow: hidden;
	background: #a78160;
	transform: translate3d(0, 0, 0);
	will-change: transform;
}

#sebs-reveal-swipe::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(
			90deg,
			rgba(255, 255, 255, 0) 0%,
			rgba(255, 255, 255, .12) 42%,
			rgba(255, 255, 255, .24) 50%,
			rgba(255, 255, 255, .08) 58%,
			rgba(255, 255, 255, 0) 100%
		);
	transform: translate3d(-55%, 0, 0);
	opacity: .72;
	will-change: transform, opacity;
}

html.sebs-motion-reveal #sebs-reveal-swipe {
	transform: translate3d(100%, 0, 0);
	transition: transform 1050ms cubic-bezier(.76, 0, .24, 1);
}

html.sebs-motion-reveal #sebs-reveal-swipe::after {
	transform: translate3d(45%, 0, 0);
	opacity: 0;
	transition:
		transform 900ms cubic-bezier(.76, 0, .24, 1),
		opacity 620ms ease-out;
}


/* ==========================================================================
   2. Existing Alma SVG icons
   ========================================================================== */

.alma-icon .sebs-draw-svg {
	display: block;
	width: 36px;
	height: 36px;
	overflow: visible;
}

.alma-icon .sebs-draw-svg [data-sebs-draw] {
	opacity: 0;
}

.alma-icon .sebs-draw-svg.is-complete [data-sebs-draw] {
	opacity: 1;
	stroke-dasharray: none !important;
	stroke-dashoffset: 0 !important;
}


/* ==========================================================================
   3. Accessibility
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	html.sebs-motion-boot body,
	html.sebs-motion-mounted body {
		opacity: 1;
		transition: none;
	}

	#sebs-reveal-swipe {
		display: none;
	}

	.alma-icon .sebs-draw-svg [data-sebs-draw] {
		opacity: 1;
		stroke-dasharray: none !important;
		stroke-dashoffset: 0 !important;
	}
}