/* 30-statement. Figma Statement band 31:383. Cloud band, one centred sentence, blue path band below. */
.kd-home .kd-home-statement { padding-block: var(--kdh-s-64); text-align: center; }
.kd-home .kd-home-statement__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--kdh-s-24);
}
.kd-home .kd-home-statement__text { max-width: 1040px; }
.kd-home .kd-home-statement__band { width: 100%; max-width: 720px; line-height: 0; color: var(--kdh-blue); }
.kd-home .kd-home-statement__path { display: block; width: 100%; height: auto; }
.kd-home .kd-home-statement__path--d { display: none; }
@media (min-width: 768px) {
	.kd-home .kd-home-statement__path--d { display: block; }
	.kd-home .kd-home-statement__path--m { display: none; }
}
/* Path reveal (Alain, 2026-10-19): 30-statement.js arms the band, then draws it once on view.
   pathLength="1" makes the dash maths unit-free. Unarmed (no JS / reduced motion) = fully drawn. */
.kd-home .kd-home-statement__band.is-armed path {
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
}
/* transition only on the way in, so arming hides the band instantly instead of un-drawing it */
.kd-home .kd-home-statement__band.is-armed.is-drawn path {
	stroke-dashoffset: 0;
	transition: stroke-dashoffset 1.1s cubic-bezier(.22, 1, .36, 1); /* fast start, soft landing */
}
@media (min-width: 1024px) {
	.kd-home .kd-home-statement { padding-block: 120px; }
}
