/**
 * SVG Lines Growth Animation
 * Lines grow from 0 to full size using scale transforms
 */

/* Container for SVG */
.svg-lines-animated {
	width: 100%;
	height: 100%;
	opacity: 0.3;
}

/* Horizontal lines - grow from left */
.svg-line-horizontal {
	transform-origin: left center;
	transform: scaleX(0);
	animation: growLineX 1.2s ease-out forwards;
}

@keyframes growLineX {
	to {
		transform: scaleX(1);
	}
}

/* Vertical lines - grow from top */
.svg-line-vertical {
	transform-origin: center top;
	transform: scaleY(0);
	animation: growLineY 1.2s ease-out forwards;
}

@keyframes growLineY {
	to {
		transform: scaleY(1);
	}
}

/* Diagonal lines - grow from center */
.svg-line-diagonal {
	transform-origin: center center;
	transform: scale(0);
	animation: growLineBoth 1.2s ease-out forwards;
}

@keyframes growLineBoth {
	to {
		transform: scale(1);
	}
}

/* Staggered animation delays */
.svg-line-horizontal:nth-child(3n + 1),
.svg-line-vertical:nth-child(3n + 1),
.svg-line-diagonal:nth-child(3n + 1) {
	animation-delay: 0s;
}

.svg-line-horizontal:nth-child(3n + 2),
.svg-line-vertical:nth-child(3n + 2),
.svg-line-diagonal:nth-child(3n + 2) {
	animation-delay: 0.1s;
}

.svg-line-horizontal:nth-child(3n + 3),
.svg-line-vertical:nth-child(3n + 3),
.svg-line-diagonal:nth-child(3n + 3) {
	animation-delay: 0.2s;
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
	.svg-line-horizontal,
	.svg-line-vertical,
	.svg-line-diagonal {
		animation: none;
		transform: scale(1);
	}
}