.ksh-history {
	--ksh-columns: 3;
	--ksh-progress: 0%;
	position: relative;
	isolation: isolate;
	overflow: clip;
	padding: 112px 42px 118px;
	font-family: inherit;
}

.ksh-history__inner {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 1560px;
	margin-inline: auto;
}

.ksh-history__grid {
	position: absolute;
	inset: 0;
	z-index: -2;
	pointer-events: none;
	background:
		linear-gradient(120deg, transparent 0 62%, color-mix(in srgb, var(--ks-brand-accent) 6%, transparent) 62% 100%),
		linear-gradient(var(--ks-brand-line) 1px, transparent 1px),
		linear-gradient(90deg, var(--ks-brand-line) 1px, transparent 1px);
	background-size: auto, 72px 72px, 72px 72px;
	opacity: .48;
	-webkit-mask-image: linear-gradient(to bottom, #000, transparent 88%);
	mask-image: linear-gradient(to bottom, #000, transparent 88%);
}

.ksh-history__header {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(390px, .75fr);
	align-items: end;
	gap: clamp(50px, 8vw, 130px);
	margin-bottom: clamp(74px, 9vw, 132px);
}

.ksh-history__heading { max-width: 960px; }

.ksh-history__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 13px;
	margin-bottom: 25px;
	color: var(--ks-brand-accent);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .19em;
	line-height: 1.4;
	text-transform: uppercase;
}

.ksh-history__eyebrow i {
	display: inline-block;
	width: 36px;
	height: 8px;
	background: repeating-linear-gradient(135deg, var(--ks-brand-accent) 0 5px, transparent 5px 8px);
}

.ksh-history__title {
	margin: 0;
	color: var(--ks-brand-ink);
	font-family: "Arial Narrow", "Roboto Condensed", sans-serif;
	font-size: clamp(48px, 6vw, 96px);
	font-weight: 800;
	letter-spacing: -.055em;
	line-height: .93;
	text-wrap: balance;
}

.ksh-history__title em {
	display: block;
	color: var(--ks-brand-accent);
	font-style: normal;
}

.ksh-history__intro {
	max-width: 760px;
	margin: 30px 0 0;
	color: var(--ks-brand-muted);
	font-size: 17px;
	line-height: 1.75;
}

.ksh-facts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	border-top: 1px solid var(--ks-brand-line);
	border-left: 1px solid var(--ks-brand-line);
	background: var(--ks-brand-surface);
	box-shadow: var(--ks-brand-shadow);
}

.ksh-fact {
	position: relative;
	display: flex;
	min-height: 205px;
	flex-direction: column;
	justify-content: flex-end;
	padding: 27px;
	border-right: 1px solid var(--ks-brand-line);
	border-bottom: 1px solid var(--ks-brand-line);
}

.ksh-fact::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 43%;
	height: 7px;
	background: repeating-linear-gradient(135deg, var(--ks-brand-accent) 0 7px, transparent 7px 11px);
	content: "";
}

.ksh-fact strong {
	display: flex;
	align-items: baseline;
	color: var(--ks-brand-ink);
	font-family: "Arial Narrow", "Roboto Condensed", sans-serif;
	font-size: clamp(46px, 5vw, 72px);
	font-weight: 850;
	letter-spacing: -.06em;
	line-height: .9;
}

.ksh-fact strong b { font: inherit; }
.ksh-fact strong span { color: var(--ks-brand-accent); font-size: .55em; }
.ksh-fact__label { margin-top: 15px; color: var(--ks-brand-ink); font-size: 11px; font-weight: 800; letter-spacing: .07em; line-height: 1.35; text-transform: uppercase; }
.ksh-fact small { margin-top: 7px; color: var(--ks-brand-muted); font-size: 9px; line-height: 1.45; }

/* Shared milestone content */
.ksh-milestone__content {
	display: flex;
	min-width: 0;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}

.ksh-milestone__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 18px;
	margin-bottom: 21px;
}

.ksh-milestone__meta span,
.ksh-milestone__meta small,
.ksh-archive-card__top {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 9px;
	font-weight: 800;
	letter-spacing: .14em;
	line-height: 1.4;
	text-transform: uppercase;
}

.ksh-milestone__meta span { padding: 7px 9px; background: var(--ks-brand-accent); color: var(--ks-brand-accent-contrast); }
.ksh-milestone__meta small { color: var(--ks-brand-muted); }

.ksh-milestone__title {
	margin: 0;
	color: var(--ks-brand-ink);
	font-family: "Arial Narrow", "Roboto Condensed", sans-serif;
	font-size: clamp(38px, 4.5vw, 68px);
	font-weight: 800;
	letter-spacing: -.045em;
	line-height: .96;
	text-wrap: balance;
}

.ksh-milestone__description {
	max-width: 610px;
	margin: 22px 0 0;
	color: var(--ks-brand-muted);
	font-size: 15px;
	line-height: 1.72;
}

.ksh-milestone__link {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 48px;
	margin-top: 30px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--ks-brand-accent);
	color: var(--ks-brand-ink);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .11em;
	line-height: 1.35;
	text-decoration: none;
	text-transform: uppercase;
	transition: color .22s ease, gap .25s var(--ks-brand-ease);
}

.ksh-milestone__link:hover { gap: 28px; color: var(--ks-brand-accent); }
.ksh-milestone__link svg { flex: 0 0 auto; }

.ksh-milestone__visual {
	position: relative;
	isolation: isolate;
	min-width: 0;
	overflow: hidden;
	background:
		linear-gradient(145deg, color-mix(in srgb, var(--ks-brand-accent) 18%, transparent), transparent 58%),
		var(--ks-brand-dark);
}

.ksh-milestone__visual::before {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background-image:
		linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
	background-size: 48px 48px;
	content: "";
	-webkit-mask-image: linear-gradient(135deg, #000, transparent 72%);
	mask-image: linear-gradient(135deg, #000, transparent 72%);
}

.ksh-milestone__visual::after {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(90deg, transparent 52%, rgba(0,0,0,.32));
	content: "";
}

.ksh-milestone__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(.76) contrast(1.06);
	transition: filter .45s ease, transform .8s var(--ks-brand-ease);
}

.ksh-milestone__symbol {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 3;
	display: grid;
	place-items: center;
	width: min(38%, 210px);
	aspect-ratio: 1;
	border: 1px solid color-mix(in srgb, var(--ks-brand-accent) 72%, white);
	border-radius: 50%;
	color: var(--ks-brand-accent);
	transform: translate(-50%, -50%);
}

.ksh-milestone__symbol::before,
.ksh-milestone__symbol::after {
	position: absolute;
	border: 1px dashed rgba(255,255,255,.16);
	border-radius: 50%;
	content: "";
}

.ksh-milestone__symbol::before { inset: -24%; }
.ksh-milestone__symbol::after { inset: 21%; }
.ksh-milestone__symbol svg { width: 38%; height: 38%; }

.ksh-milestone__visual-code {
	position: absolute;
	z-index: 4;
	top: 25px;
	left: 27px;
	color: rgba(255,255,255,.62);
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: .15em;
}

.ksh-milestone__cut {
	position: absolute;
	z-index: 4;
	right: 6%;
	bottom: 0;
	width: min(48%, 270px);
	height: 11px;
	background: repeating-linear-gradient(135deg, var(--ks-brand-accent) 0 13px, transparent 13px 20px);
}

/* Forged timeline */
.ksh-timeline {
	position: relative;
	display: grid;
	gap: clamp(54px, 7vw, 98px);
}

.ksh-timeline__track {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 112px;
	width: 2px;
	background: var(--ks-brand-line);
}

.ksh-timeline__track i {
	display: block;
	width: 100%;
	height: var(--ksh-progress);
	background: var(--ks-brand-accent);
	transition: height .8s var(--ks-brand-ease);
}

.ksh-timeline-item {
	position: relative;
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr);
	min-height: 490px;
}

.ksh-timeline-item__marker {
	position: relative;
	z-index: 3;
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	padding: 31px 29px 0 0;
}

.ksh-timeline-item__marker span {
	writing-mode: vertical-rl;
	color: var(--ks-brand-accent);
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 12px;
	font-weight: 850;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.ksh-timeline-item__marker i {
	position: absolute;
	top: 33px;
	right: -8px;
	width: 17px;
	height: 17px;
	border: 4px solid var(--ks-brand-bg);
	border-radius: 50%;
	background: var(--ks-brand-accent);
	box-shadow: 0 0 0 1px var(--ks-brand-accent);
}

.ksh-timeline-item__body {
	display: grid;
	grid-template-columns: minmax(320px, .78fr) minmax(0, 1.22fr);
	overflow: hidden;
	border: 1px solid var(--ks-brand-line);
	border-radius: var(--ks-brand-radius);
	background: var(--ks-brand-surface);
	box-shadow: 0 22px 62px rgba(31,24,17,.09);
}

.ksh-timeline-item__body > .ksh-milestone__content { padding: clamp(40px, 5vw, 76px); }
.ksh-timeline-item:nth-child(odd) .ksh-timeline-item__body .ksh-milestone__visual { order: -1; }
.ksh-timeline-item__body > .ksh-milestone__content:only-child { grid-column: 1 / -1; }

/* Editorial story */
.ksh-editorial { display: grid; gap: clamp(38px, 6vw, 88px); }

.ksh-editorial-item {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.16fr) minmax(360px, .84fr);
	min-height: 540px;
	overflow: hidden;
	border-radius: var(--ks-brand-radius);
	background: var(--ks-brand-dark);
	box-shadow: var(--ks-brand-shadow);
}

.ksh-editorial-item:nth-child(even) .ksh-milestone__visual { order: 2; }
.ksh-editorial-item:nth-child(even) .ksh-editorial-item__content { order: 1; }

.ksh-editorial-item__content {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(45px, 7vw, 100px);
	background: var(--ks-brand-surface);
}

.ksh-editorial-item__marker {
	position: absolute;
	right: -.02em;
	top: -.18em;
	color: color-mix(in srgb, var(--ks-brand-accent) 8%, transparent);
	font-family: "Arial Narrow", sans-serif;
	font-size: clamp(120px, 16vw, 250px);
	font-weight: 900;
	letter-spacing: -.08em;
	line-height: 1;
	white-space: nowrap;
}

.ksh-editorial-item__content > * { position: relative; z-index: 2; }
.ksh-editorial-item__content > .ksh-milestone__content:only-child { width: 100%; }

/* Industrial archive */
.ksh-archive {
	display: grid;
	grid-template-columns: repeat(var(--ksh-columns), minmax(0, 1fr));
	gap: 1px;
	border: 1px solid var(--ks-brand-line);
	background: var(--ks-brand-line);
	box-shadow: var(--ks-brand-shadow);
}

.ksh-archive-card {
	display: flex;
	min-width: 0;
	flex-direction: column;
	background: var(--ks-brand-surface);
}

.ksh-archive-card__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 56px;
	padding: 12px 22px;
	border-bottom: 1px solid var(--ks-brand-line);
	color: var(--ks-brand-muted);
}

.ksh-archive-card__top span { color: var(--ks-brand-accent); }
.ksh-archive-card__top b { font: inherit; }
.ksh-archive-card .ksh-milestone__visual { aspect-ratio: 16 / 10; }
.ratio-landscape .ksh-archive-card .ksh-milestone__visual { aspect-ratio: 4 / 3; }
.ratio-square .ksh-archive-card .ksh-milestone__visual { aspect-ratio: 1; }
.ratio-portrait .ksh-archive-card .ksh-milestone__visual { aspect-ratio: 4 / 5; }
.ksh-archive-card__content { display: flex; flex: 1; padding: clamp(29px, 3vw, 44px); }
.ksh-archive-card__content > .ksh-milestone__content { width: 100%; }
.ksh-archive-card .ksh-milestone__title { font-size: clamp(31px, 3.2vw, 48px); }
.ksh-archive-card .ksh-milestone__description { flex: 1; }

.ksh-history__empty {
	display: grid;
	place-items: center;
	min-height: 300px;
	padding: 42px;
	border: 1px dashed var(--ks-brand-accent);
	background: var(--ks-brand-surface);
	text-align: center;
}

.ksh-history__empty strong { font-size: 20px; }
.ksh-history__empty span { color: var(--ks-brand-muted); }

/* Motion */
.ksh-history.is-reveal-ready.has-text-reveal .ksh-history__eyebrow,
.ksh-history.is-reveal-ready.has-text-reveal .ksh-history__title,
.ksh-history.is-reveal-ready.has-text-reveal .ksh-history__intro,
.ksh-history.is-reveal-ready.has-text-reveal .ksh-facts {
	opacity: 0;
	transform: translateY(28px);
}

.ksh-history.is-reveal-ready.is-visible.has-text-reveal .ksh-history__eyebrow,
.ksh-history.is-reveal-ready.is-visible.has-text-reveal .ksh-history__title,
.ksh-history.is-reveal-ready.is-visible.has-text-reveal .ksh-history__intro,
.ksh-history.is-reveal-ready.is-visible.has-text-reveal .ksh-facts {
	opacity: 1;
	transform: none;
	transition: opacity .72s var(--ks-brand-ease), transform .72s var(--ks-brand-ease);
}

.ksh-history.is-reveal-ready.is-visible.has-text-reveal .ksh-history__title { transition-delay: .07s; }
.ksh-history.is-reveal-ready.is-visible.has-text-reveal .ksh-history__intro { transition-delay: .13s; }
.ksh-history.is-reveal-ready.is-visible.has-text-reveal .ksh-facts { transition-delay: .17s; }

.ksh-history.is-reveal-ready.has-milestone-reveal .ksh-milestone {
	opacity: 0;
	transform: translateY(36px);
}

.ksh-history.is-reveal-ready.has-milestone-reveal .ksh-milestone.is-inview {
	opacity: 1;
	transform: none;
	transition: opacity .72s var(--ks-brand-ease), transform .72s var(--ks-brand-ease);
}

@media (hover: hover) and (pointer: fine) {
	.ksh-history.has-image-motion .ksh-milestone:hover .ksh-milestone__image {
		filter: saturate(.98) contrast(1.07);
		transform: scale(1.045);
	}

	.ksh-archive-card { transition: transform .34s var(--ks-brand-ease), box-shadow .34s ease; }
	.ksh-archive-card:hover { z-index: 2; box-shadow: 0 28px 70px rgba(31,24,17,.17); transform: translateY(-8px); }
}

@media (max-width: 1180px) {
	.ksh-history__header { grid-template-columns: minmax(0, 1fr) minmax(350px, .72fr); gap: 55px; }
	.ksh-timeline-item__body { grid-template-columns: minmax(300px, .9fr) minmax(0, 1.1fr); }
	.ksh-editorial-item { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1024px) {
	.ksh-history { padding: 84px 28px 90px; }
	.ksh-history__header { grid-template-columns: 1fr; gap: 42px; }
	.ksh-facts { max-width: 700px; }
	.ksh-timeline__track { left: 83px; }
	.ksh-timeline-item { grid-template-columns: 83px minmax(0, 1fr); }
	.ksh-timeline-item__marker { padding-right: 22px; }
	.ksh-timeline-item__body { grid-template-columns: 1fr 1fr; }
	.ksh-timeline-item__body > .ksh-milestone__content { padding: 38px; }
	.ksh-editorial-item { min-height: 480px; }
}

@media (max-width: 767px) {
	.ksh-history { padding: 64px 18px 70px; }
	.ksh-history__grid { background-size: auto, 44px 44px, 44px 44px; }
	.ksh-history__header { margin-bottom: 64px; }
	.ksh-history__eyebrow { margin-bottom: 18px; font-size: 10px; }
	.ksh-history__title { font-size: clamp(42px, 13vw, 62px); line-height: .96; }
	.ksh-history__intro { margin-top: 24px; font-size: 15px; }
	.ksh-facts { grid-template-columns: 1fr 1fr; }
	.ksh-fact { min-height: 170px; padding: 22px 18px; }
	.ksh-fact strong { font-size: clamp(40px, 12vw, 58px); }
	.ksh-fact__label { font-size: 9px; }
	.ksh-timeline { gap: 38px; }
	.ksh-timeline__track { left: 18px; }
	.ksh-timeline-item { grid-template-columns: 38px minmax(0, 1fr); min-height: 0; }
	.ksh-timeline-item__marker { padding: 0; }
	.ksh-timeline-item__marker span { display: none; }
	.ksh-timeline-item__marker i { top: 28px; right: 11px; width: 15px; height: 15px; }
	.ksh-timeline-item__body { display: flex; flex-direction: column; }
	.ksh-timeline-item__body .ksh-milestone__visual { order: 0 !important; min-height: 300px; aspect-ratio: 4 / 3; }
	.ksh-timeline-item__body > .ksh-milestone__content { order: 1; padding: 31px 24px 36px; }
	.ksh-milestone__title { font-size: clamp(36px, 11vw, 52px); }
	.ksh-editorial { gap: 25px; }
	.ksh-editorial-item { display: flex; min-height: 0; flex-direction: column; }
	.ksh-editorial-item .ksh-milestone__visual { order: 0 !important; min-height: 310px; aspect-ratio: 4 / 3; }
	.ksh-editorial-item__content { order: 1 !important; padding: 35px 25px 40px; }
	.ksh-editorial-item__marker { top: -.08em; font-size: 112px; }
	.ksh-archive-card .ksh-milestone__visual { aspect-ratio: 16 / 11; }
	.ksh-archive-card__content { padding: 28px 24px 34px; }
	.ksh-milestone__symbol { width: min(45%, 170px); }
}

@media (max-width: 420px) {
	.ksh-facts { grid-template-columns: 1fr; }
	.ksh-fact { min-height: 145px; }
}

@media (max-width: 360px) {
	.ksh-history { padding-inline: 15px; }
	.ksh-timeline-item__body > .ksh-milestone__content,
	.ksh-editorial-item__content { padding-inline: 21px; }
	.ksh-milestone__link { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.ksh-history.is-reveal-ready.has-milestone-reveal .ksh-milestone,
	.ksh-history.is-reveal-ready * { opacity: 1 !important; transform: none !important; }
	.ksh-timeline__track i { transition: none; }
}