/* Frontend Reference V1: Homepage Quality + Evidence geometry owner. */
.ef-v1-quality-evidence {
	padding-block: var(--ef-primitive-space-24);
	background: var(--ef-primitive-color-surface-canvas);
}

.ef-v1-quality-evidence__layout {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(24rem, 0.95fr);
	align-items: stretch;
	background: var(--ef-primitive-color-white);
	border: var(--ef-primitive-border-thin) solid var(--ef-primitive-color-slate200);
	box-shadow: var(--ef-primitive-shadow-standard);
}

.ef-v1-quality-workflow {
	min-inline-size: 0;
	padding: var(--ef-primitive-space-8);
	border-inline-end: 3px solid var(--ef-primitive-color-blue600);
}

.ef-v1-quality-workflow__media {
	position: relative;
	min-block-size: 20rem;
	margin: 0;
	overflow: hidden;
	background: var(--ef-primitive-color-slate100);
}

.ef-v1-quality-workflow__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, var(--ef-primitive-color-alpha-dark76), transparent 46%);
}

.ef-v1-quality-workflow__media img {
	inline-size: 100%;
	block-size: 100%;
	min-block-size: 20rem;
	object-fit: cover;
}

.ef-v1-quality-workflow__media figcaption {
	position: absolute;
	z-index: 1;
	inset-inline: var(--ef-primitive-space-6);
	inset-block-end: var(--ef-primitive-space-5);
	color: var(--ef-primitive-color-white);
}

.ef-v1-evidence-register__header > span {
	max-inline-size: 12rem;
	color: var(--ef-primitive-color-slate600);
	font-family: var(--ef-primitive-font-family-mono);
	font-size: var(--ef-primitive-font-size-technical-label);
	text-align: end;
	text-transform: uppercase;
}

.ef-v1-quality-workflow__media figcaption span {
	display: block;
	margin-block-end: var(--ef-primitive-space-2);
	color: var(--ef-primitive-color-slate300);
	font-family: var(--ef-primitive-font-family-mono);
	font-size: var(--ef-primitive-font-size-technical-label);
	text-transform: uppercase;
}

.ef-v1-quality-workflow__steps strong {
	font-size: var(--ef-primitive-font-size-body);
}

.ef-v1-quality-workflow__media figcaption strong {
	font-size: var(--ef-primitive-font-size-h3);
}

.ef-v1-quality-workflow__steps {
	margin: var(--ef-primitive-space-6) 0 0;
	padding: 0;
	display: grid;
	border-block-start: var(--ef-primitive-border-thin) solid var(--ef-primitive-color-slate200);
	list-style: none;
}

.ef-v1-quality-workflow__steps li {
	min-inline-size: 0;
	padding: var(--ef-primitive-space-5);
	display: grid;
	grid-template-columns: 2rem minmax(0, 1fr);
	gap: var(--ef-primitive-space-3);
	align-items: baseline;
	border-block-end: var(--ef-primitive-border-thin) solid var(--ef-primitive-color-slate200);
}

.ef-v1-quality-workflow__steps li > span {
	color: var(--ef-primitive-color-blue600);
	font-family: var(--ef-primitive-font-family-mono);
	font-size: var(--ef-primitive-font-size-technical-label);
}

.ef-v1-evidence-register {
	min-inline-size: 0;
	padding: var(--ef-primitive-space-8);
	color: var(--ef-primitive-color-ink950);
	background: linear-gradient(90deg, var(--ef-primitive-color-blue50), transparent 24%), var(--ef-primitive-color-surface-soft);
}

.ef-v1-evidence-register__header {
	min-block-size: 5.25rem;
	display: flex;
	align-items: start;
	justify-content: space-between;
	gap: var(--ef-primitive-space-6);
}

.ef-v1-evidence-register__header h3 {
	margin: var(--ef-primitive-space-2) 0 0;
	font-size: var(--ef-primitive-font-size-h3);
	letter-spacing: -0.04em;
}

.ef-v1-evidence-record {
	min-block-size: 7.25rem;
	padding-block: var(--ef-primitive-space-5);
	display: grid;
	grid-template-columns: 6.5rem minmax(0, 1fr);
	grid-template-rows: auto auto;
	gap: var(--ef-primitive-space-4) var(--ef-primitive-space-5);
	border-block-start: var(--ef-primitive-border-thin) solid var(--ef-primitive-color-slate200);
}

.ef-v1-evidence-record__status {
	align-self: start;
	padding: var(--ef-primitive-space-2);
	color: var(--ef-primitive-color-blue600);
	border: var(--ef-primitive-border-thin) solid var(--ef-primitive-color-blue100);
	font-family: var(--ef-primitive-font-family-mono);
	font-size: var(--ef-primitive-font-size-technical-label);
	text-align: center;
	text-transform: uppercase;
}

.ef-v1-evidence-record p {
	margin: 0;
	font-weight: var(--ef-primitive-font-weight-bold);
}

.ef-v1-evidence-record small {
	margin-block-start: var(--ef-primitive-space-1);
	display: block;
	color: var(--ef-primitive-color-slate600);
	font-family: var(--ef-primitive-font-family-mono);
	font-size: var(--ef-primitive-font-size-technical-label);
	line-height: var(--ef-primitive-font-line-body-compact);
}

.ef-v1-evidence-record dl {
	margin: 0;
	grid-column: 2;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--ef-primitive-space-4);
}

.ef-v1-evidence-record dt {
	color: var(--ef-primitive-color-slate600);
	font-size: var(--ef-primitive-font-size-technical-label);
	text-transform: uppercase;
}

.ef-v1-evidence-record dd {
	margin: var(--ef-primitive-space-1) 0 0;
	font-size: var(--ef-primitive-font-size-small);
	line-height: var(--ef-primitive-font-line-body-compact);
}

.ef-v1-evidence-register__note {
	margin: var(--ef-primitive-space-5) 0 0;
	padding-block-start: var(--ef-primitive-space-5);
	color: var(--ef-primitive-color-slate600);
	border-block-start: var(--ef-primitive-border-thin) solid var(--ef-primitive-color-slate200);
	font-size: var(--ef-primitive-font-size-small);
	line-height: var(--ef-primitive-font-line-body);
}

@media (max-width: 900px) {

	.ef-v1-quality-evidence {
		padding-block: var(--ef-primitive-space-16);
	}

	.ef-v1-quality-evidence__layout {
		grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.9fr);
	}

	.ef-v1-quality-workflow,
	.ef-v1-evidence-register {
		padding: var(--ef-primitive-space-6);
	}

	.ef-v1-quality-workflow__media,
	.ef-v1-quality-workflow__media img {
		min-block-size: 16rem;
	}

	.ef-v1-evidence-record {
		grid-template-columns: 5.5rem minmax(0, 1fr);
		column-gap: var(--ef-primitive-space-4);
	}
}

@media (max-width: 640px) {

	.ef-v1-quality-evidence__layout {
		display: block;
	}

	.ef-v1-quality-workflow {
		padding: var(--ef-primitive-space-4);
		border-inline-end: 0;
		border-block-end: var(--ef-primitive-border-thin) solid var(--ef-primitive-color-slate200);
	}

	.ef-v1-quality-workflow__media,
	.ef-v1-quality-workflow__media img {
		min-block-size: 13rem;
	}

	.ef-v1-evidence-register {
		padding: var(--ef-primitive-space-6) var(--ef-primitive-space-4);
	}

	.ef-v1-evidence-register__header {
		display: block;
	}

	.ef-v1-evidence-register__header > span {
		margin-block-start: var(--ef-primitive-space-2);
		display: block;
		text-align: start;
	}

	.ef-v1-evidence-record {
		grid-template-columns: 5.5rem minmax(0, 1fr);
	}

	.ef-v1-evidence-record dl {
		grid-column: 1 / -1;
	}
}
