.kp-hist {
	--kp-h-year-col: 90px;
	--kp-h-col-gap: 26px;
	--kp-h-row-gap: 0px;
	--kp-h-pad-y: 26px;
	--kp-h-line: #E3D9E6;
	--kp-h-line-w: 1px;
	--kp-h-year-color: #6B1E63;
	--kp-h-title-color: #2A0A2E;
	--kp-h-desc-color: #4A4552;
	--kp-b-gap: 12px;
	--kp-b-bg: #6B1E63;
	--kp-b-color: #FFFFFF;
	--kp-b-bg-hover: #55164F;
	--kp-b-color-hover: #FFFFFF;
	--kp-b2-bg: #C9A6D9;
	--kp-b2-color: #3A1140;
	--kp-b2-bg-hover: #B98FCB;
	--kp-b2-color-hover: #3A1140;
	--kp-b-radius: 999px;
	width: 100%;
}

.kp-hist::before {
	content: "kp-hist 1.1";
	display: none;
}

.kp-hist__item {
	display: grid;
	grid-template-columns: var(--kp-h-year-col) 1fr;
	column-gap: var(--kp-h-col-gap);
	row-gap: var(--kp-h-row-gap);
	align-items: start;
	padding: var(--kp-h-pad-y) 0;
	border-top: var(--kp-h-line-w) solid var(--kp-h-line);
}

.kp-hist__item:first-child {
	border-top: 0;
}

.kp-hist--no-lines .kp-hist__item {
	border-top: 0;
}

.kp-hist__year {
	margin: 0;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.1;
	color: var(--kp-h-year-color);
	align-self: center;
}

.kp-hist__body {
	min-width: 0;
}

.kp-hist__title {
	margin: 0 0 8px;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.3;
	color: var(--kp-h-title-color);
}

.kp-hist__desc {
	margin: 0 0 16px;
	font-size: 12.5px;
	line-height: 1.65;
	color: var(--kp-h-desc-color);
}

.kp-hist__desc p:last-child {
	margin-bottom: 0;
}

.kp-hist__desc:last-child {
	margin-bottom: 0;
}

.kp-hist__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: var(--kp-b-gap);
}

.kp-hist__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-width: 96px;
	padding: 9px 22px;
	border: 0;
	border-radius: var(--kp-b-radius);
	font-size: 11px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.kp-hist__btn--1 {
	background: var(--kp-b-bg);
	color: var(--kp-b-color);
}

.kp-hist__btn--1:hover {
	background: var(--kp-b-bg-hover);
	color: var(--kp-b-color-hover);
}

.kp-hist__btn--2 {
	background: var(--kp-b2-bg);
	color: var(--kp-b2-color);
}

.kp-hist__btn--2:hover {
	background: var(--kp-b2-bg-hover);
	color: var(--kp-b2-color-hover);
}

.kp-hist__btn:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.kp-hist__empty {
	padding: 20px;
	border: 1px dashed #c3c4c7;
	border-radius: 8px;
	color: #646970;
	font-size: 13px;
	text-align: center;
}
@media (max-width: 767px) {
	.kp-hist {
		--kp-h-col-gap: 0px;
		--kp-h-pad-y: 16px;
	}
	.kp-hist__item {
		grid-template-columns: 1fr;
		row-gap: 6px;
	}
	.kp-hist__year {
		align-self: start;
		text-align: left;
		font-size: 18px;
		margin-bottom: 2px;
	}
	.kp-hist__body {
		text-align: left;
	}
	.kp-hist__title {
		font-size: 14px;
		margin-bottom: 6px;
	}
	.kp-hist__desc {
		font-size: 11px;
		line-height: 1.55;
		margin-bottom: 12px;
	}
	.kp-hist__btn {
		min-width: 0;
		padding: 6px 14px;
		font-size: 9px;
	}
	.kp-hist__buttons {
		gap: 8px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.kp-hist__btn {
		transition: none;
	}
}