/**
 * Promptvergleich glossary details.
 * The command line occupies the deliberately quiet hero area without adding a
 * foreign colour or decorative shape.
 */
.pvc-glossary {
	--pvg-ink: #111210;
	--pvg-paper: #f3f2ef;
	--pvg-signal: #d84c2f;
}

.pvc-glossary .pvc-glossary__kicker {
	position: relative;
	display: grid !important;
	min-height: clamp(170px, 18vw, 270px);
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: start;
	gap: 24px;
	padding: 18px clamp(24px, 3.2vw, 64px) !important;
	border-top: 1px solid var(--pvg-ink) !important;
	border-bottom: 1px solid var(--pvg-ink) !important;
}

.pvc-glossary .pvc-glossary__kicker > span {
	position: relative;
	z-index: 2;
}

.pvc-glossary .pvc-glossary__kicker > span:last-child {
	grid-column: 3;
	text-align: right;
}

.pvc-glossary .pvc-glossary__command {
	position: absolute;
	top: 50%;
	left: clamp(24px, 3.2vw, 64px);
	z-index: 1;
	display: inline-flex;
	max-width: calc(100% - 48px);
	align-items: baseline;
	color: var(--pvg-ink);
	font-family: "Inter Tight", Inter, Arial, sans-serif;
	font-size: clamp(56px, 7.4vw, 126px);
	font-weight: 900;
	letter-spacing: -.055em;
	line-height: .86;
	white-space: nowrap;
	transform: translateY(-42%);
}

.pvc-glossary .pvc-glossary__command-prompt {
	margin-right: .16em;
	color: var(--pvg-signal);
}

.pvc-glossary .pvc-glossary__command-word {
	display: inline-block;
	overflow: hidden;
	width: 0;
	animation: pvc-glossary-type 2.15s steps(7, end) .35s forwards;
}

.pvc-glossary .pvc-glossary__command-cursor {
	margin-left: .03em;
	color: var(--pvg-signal);
	animation: pvc-glossary-cursor .82s steps(1, end) infinite;
}

.pvc-glossary .pvc-glossary__headline-accent {
	display: flex !important;
	flex-wrap: wrap;
	column-gap: clamp(12px, 1.35vw, 28px);
	row-gap: 0;
	word-spacing: normal !important;
}

.pvc-glossary .pvc-glossary__headline-accent > span {
	display: inline-block;
	white-space: nowrap;
}

.pvc-glossary .pvc-glossary__hero-copy > p,
.pvc-glossary .pvc-glossary__definition,
.pvc-glossary .pvc-glossary__example p {
	word-spacing: .045em;
}

@keyframes pvc-glossary-type {
	from { width: 0; }
	to { width: 7ch; }
}

@keyframes pvc-glossary-cursor {
	0%, 48% { opacity: 1; }
	49%, 100% { opacity: 0; }
}

@media (max-width: 760px) {
	.pvc-glossary .pvc-glossary__kicker {
		min-height: 150px;
		gap: 10px;
		padding: 14px 20px !important;
	}

	.pvc-glossary .pvc-glossary__command {
		left: 20px;
		max-width: calc(100% - 40px);
		font-size: clamp(40px, 13.5vw, 68px);
	}

	.pvc-glossary .pvc-glossary__headline-accent {
		column-gap: clamp(8px, 2.8vw, 14px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.pvc-glossary .pvc-glossary__command-word {
		width: 7ch;
		animation: none;
	}

	.pvc-glossary .pvc-glossary__command-cursor {
		animation: none;
	}
}

/* 2.9.7 — the command band is the first visible hero element. */
.pvc-glossary,
.pvc-glossary .pvc-glossary__hero {
	margin-top: 0 !important;
	padding-top: 0 !important;
}

.pvc-glossary .pvc-glossary__kicker {
	margin-top: 0 !important;
}

.pvc-glossary .pvc-glossary__command {
	right: clamp(24px, 3.2vw, 64px) !important;
	max-width: none !important;
	overflow: visible !important;
	font-size: clamp(54px, 6.8vw, 116px) !important;
}

.pvc-glossary .pvc-glossary__command-word {
	overflow: visible !important;
	width: auto !important;
	max-width: none !important;
	animation: none !important;
	min-width: .01em;
}

.pvc-glossary .pvc-glossary__command-cursor {
	display: inline-block !important;
}

.pvc-glossary .pvc-glossary__command.is-complete .pvc-glossary__command-cursor {
	animation-iteration-count: 4;
}

@media (max-width: 760px) {
	.pvc-glossary .pvc-glossary__command {
		right: 20px !important;
		font-size: clamp(40px, 12.5vw, 66px) !important;
	}
}