.company-hero__records {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	max-width: 860px;
	margin-top: clamp(16px, 2.6vw, 24px);
}

.company-hero__record {
	--record-delay: 0s;
	--record-accent: #2f78a8;
	--record-border: rgba(47, 120, 168, 0.4);
	--record-bg: #e7f3fa;
	--record-bg-end: #f7fbfd;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	overflow: hidden;
	min-width: 0;
	min-height: 78px;
	padding: 12px 14px 11px;
	border: 1px solid var(--record-border);
	border-radius: 10px;
	background: linear-gradient(145deg, var(--record-bg), var(--record-bg-end));
	box-shadow: 0 8px 18px rgba(16, 35, 51, 0.045);
}

.company-hero__record--capital {
	--record-accent: #b5671d;
	--record-border: rgba(181, 103, 29, 0.42);
	--record-bg: #feecd5;
	--record-bg-end: #fff9f1;
}

.company-hero__record--asset {
	--record-accent: #2f806b;
	--record-border: rgba(47, 128, 107, 0.42);
	--record-bg: #e2f3ed;
	--record-bg-end: #f5fbf9;
}

.company-hero__record:nth-child(2) {
	--record-delay: 0.07s;
}

.company-hero__record:nth-child(3) {
	--record-delay: 0.14s;
}

.company-hero__record:nth-child(4) {
	--record-delay: 0.21s;
}

.company-hero__record:nth-child(5) {
	--record-delay: 0.28s;
}

.company-hero__record:nth-child(6) {
	--record-delay: 0.35s;
}

.company-hero__record:nth-child(7) {
	--record-delay: 0.42s;
}

.company-hero__record:nth-child(8) {
	--record-delay: 0.49s;
}

.company-hero__record span,
.company-hero__record strong {
	position: relative;
	z-index: 1;
	display: block;
}

.company-hero__record span {
	color: var(--record-accent);
	font-size: 0.74rem;
	font-weight: 900;
	letter-spacing: 0.04em;
}

.company-hero__record strong {
	margin-top: 4px;
	color: var(--color-ink);
	font-size: clamp(1.05rem, 1.55vw, 1.32rem);
	font-weight: 900;
	line-height: 1.2;
	white-space: nowrap;
}

.company-hero .company-hero__record.js-scroll-reveal {
	transform: translateY(10px) scale(0.985);
	transition:
		opacity 0.42s ease-out var(--record-delay),
		transform 0.42s ease-out var(--record-delay),
		border-color 0.22s ease,
		box-shadow 0.22s ease;
}

.company-hero .company-hero__record.js-scroll-reveal.is-revealed {
	transform: translateY(0) scale(1);
}

@media (hover: hover) and (pointer: fine) {
	.company-hero .company-hero__record.js-scroll-reveal.is-revealed:hover {
		border-color: color-mix(in srgb, var(--record-accent) 58%, transparent);
		box-shadow: 0 12px 24px color-mix(in srgb, var(--record-accent) 14%, transparent);
		transform: translateY(-2px);
	}
}

@media (min-width: 1080px) {
	.company-hero__records {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (prefers-reduced-motion: reduce) {
	.company-hero .company-hero__record.js-scroll-reveal,
	.company-hero .company-hero__record.js-scroll-reveal.is-revealed:hover {
		transform: none;
		transition: none;
	}
}
