/* ============================================================
   eLearningTrends — extended components
   Loaded after main.css. Contains new features added in v1.1+.
   ============================================================ */

/* ============================================================
   Brand logo — light/dark swap
   ============================================================ */
.elt-brand__img--dark { display: none; }
[data-theme="dark"] .elt-brand__img--light { display: none; }
[data-theme="dark"] .elt-brand__img--dark  { display: block; }
@media (prefers-color-scheme: dark) {
	html:not([data-theme="light"]) .elt-brand__img--light { display: none; }
	html:not([data-theme="light"]) .elt-brand__img--dark  { display: block; }
}

/* ============================================================
   Defensive SVG sizing — guarantees the new icons never
   inherit the global svg{display:block} and blow up.
   ============================================================ */
.elt-baro-card__btn > svg { width: 16px !important; height: 16px !important; flex-shrink: 0; }
.elt-incta__cta > svg     { width: 14px !important; height: 14px !important; flex-shrink: 0; }
.elt-cat-card__icon > svg { width: 22px !important; height: 22px !important; flex-shrink: 0; }

/* Highlight nav link (Barometer) */
.elt-nav__highlight {
	position: relative;
	color: #8b5cf6 !important;
	font-weight: 600 !important;
}
.elt-nav__highlight::before {
	content: "";
	position: absolute;
	left: -2px; top: 50%;
	transform: translateY(-50%);
	width: 6px; height: 6px;
	border-radius: 50%;
	background: #8b5cf6;
	box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.18);
	animation: elt-pulse-dot 2.4s ease-in-out infinite;
}
@keyframes elt-pulse-dot {
	0%, 100% { box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.18); }
	50%      { box-shadow: 0 0 0 7px rgba(139, 92, 246, 0); }
}

/* ============================================================
   Front-page Barometer hero card — flagship moment
   ============================================================ */
/* The barometer card is always visually dark (large violet orb).
   Force light text in all colour modes so nothing goes unreadable. */
.elt-baro-card {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: var(--s-8);
	align-items: end;
	padding: clamp(2rem, 4.5vw, 4rem) clamp(2rem, 5vw, 4.5rem);
	border-radius: var(--r-lg);
	overflow: hidden;
	text-decoration: none;
	/* Always dark background regardless of light/dark mode. */
	color: rgba(255, 255, 255, 0.95);
	background: linear-gradient(135deg, #0f0f1c 0%, #1a1230 50%, #0a1f2a 100%);
	border: 1px solid rgba(139, 92, 246, 0.3);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.08) inset,
		0 24px 60px -24px rgba(99, 102, 241, 0.4);
	transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1),
	            box-shadow 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
	min-height: 360px;
}
.elt-baro-card:hover {
	transform: translateY(-3px);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.8) inset,
		0 32px 80px -20px rgba(99, 102, 241, 0.4);
}

/* Aurora orbs — slow drift */
.elt-baro-card__bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	z-index: 0;
}
.elt-baro-card__orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(60px);
	opacity: 0.55;
	will-change: transform;
}
.elt-baro-card__orb--1 {
	width: 480px; height: 480px;
	top: -180px; right: -120px;
	background: radial-gradient(circle, #a78bfa 0%, transparent 70%);
	animation: elt-orb-drift-1 22s ease-in-out infinite;
}
.elt-baro-card__orb--2 {
	width: 380px; height: 380px;
	bottom: -160px; left: -80px;
	background: radial-gradient(circle, #67e8f9 0%, transparent 70%);
	opacity: 0.4;
	animation: elt-orb-drift-2 28s ease-in-out infinite;
}
.elt-baro-card__orb--3 {
	width: 220px; height: 220px;
	top: 35%; left: 45%;
	background: radial-gradient(circle, #f9a8d4 0%, transparent 70%);
	opacity: 0.25;
	animation: elt-orb-drift-3 18s ease-in-out infinite;
}
@keyframes elt-orb-drift-1 {
	0%, 100% { transform: translate(0, 0) scale(1); }
	50%      { transform: translate(-30px, 24px) scale(1.08); }
}
@keyframes elt-orb-drift-2 {
	0%, 100% { transform: translate(0, 0) scale(1); }
	50%      { transform: translate(40px, -28px) scale(1.05); }
}
@keyframes elt-orb-drift-3 {
	0%, 100% { transform: translate(0, 0) scale(1); }
	33%      { transform: translate(60px, 20px) scale(1.1); }
	66%      { transform: translate(-30px, -40px) scale(0.92); }
}

/* Subtle dot grid overlay */
.elt-baro-card__grid {
	position: absolute;
	inset: 0;
	background-image: radial-gradient(circle, rgba(139, 92, 246, 0.12) 1px, transparent 1px);
	background-size: 28px 28px;
	mask-image: linear-gradient(to right, transparent, #000 30%, #000 70%, transparent);
	-webkit-mask-image: linear-gradient(to right, transparent, #000 30%, #000 70%, transparent);
	opacity: 0.6;
}

/* Decorative italic quote glyph */
.elt-baro-card__quote {
	position: absolute;
	top: -28px;
	left: clamp(1.5rem, 3vw, 2.5rem);
	font-family: var(--font-display);
	font-style: italic;
	font-size: 14rem;
	line-height: 1;
	color: rgba(139, 92, 246, 0.18);
	pointer-events: none;
	z-index: 1;
	user-select: none;
}
[data-theme="dark"] .elt-baro-card__quote { color: rgba(167, 139, 250, 0.32); }
@media (prefers-color-scheme: dark) {
	.elt-baro-card__quote { color: rgba(167, 139, 250, 0.32); }
}

/* Content column */
.elt-baro-card__content {
	position: relative;
	z-index: 2;
	max-width: 640px;
}
.elt-baro-card__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--font-ui);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	/* Card is always dark — use the light-purple tone that's legible on dark. */
	color: #c4b5fd;
	margin-bottom: var(--s-5);
	padding: 6px 12px 6px 8px;
	background: rgba(139, 92, 246, 0.18);
	border: 1px solid rgba(139, 92, 246, 0.3);
	border-radius: 999px;
}
.elt-baro-card__dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: #8b5cf6;
	box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.6);
	animation: elt-pulse-strong 1.8s ease-in-out infinite;
}
@keyframes elt-pulse-strong {
	0%, 100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.6); }
	50%      { box-shadow: 0 0 0 8px rgba(139, 92, 246, 0); }
}
.elt-baro-card__title {
	font-family: var(--font-display);
	font-size: clamp(2.4rem, 5.5vw, 4.5rem);
	line-height: 1;
	letter-spacing: -0.025em;
	font-weight: 400;
	margin: 0 0 var(--s-6);
	color: rgba(255, 255, 255, 0.95);
}
.elt-baro-card__title em {
	font-style: italic;
	background: linear-gradient(135deg, #8b5cf6 0%, #06b6d4 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.elt-baro-card__lede {
	font-family: var(--font-serif);
	font-size: clamp(1rem, 1.4vw, 1.15rem);
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.72);
	margin: 0 0 var(--s-6);
	max-width: 56ch;
}
.elt-baro-card__meta {
	display: flex;
	align-items: center;
	gap: var(--s-3);
	font-family: var(--font-ui);
	font-size: 13px;
	color: rgba(255, 255, 255, 0.58);
}
.elt-baro-card__meta strong {
	font-weight: 700;
	color: rgba(255, 255, 255, 0.95);
	font-variant-numeric: tabular-nums;
}
.elt-baro-card__sep {
	width: 3px; height: 3px;
	border-radius: 50%;
	background: currentColor;
	opacity: 0.4;
}

/* CTA column */
.elt-baro-card__cta {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: var(--s-3);
	flex-shrink: 0;
}
.elt-baro-card__btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 22px;
	/* Always white pill on the always-dark card. */
	background: rgba(255, 255, 255, 0.9);
	color: #0f0f1c;
	border-radius: 999px;
	font-family: var(--font-ui);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.01em;
	transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1),
	            background 0.3s ease;
}
.elt-baro-card__btn svg {
	width: 16px; height: 16px;
	transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.elt-baro-card:hover .elt-baro-card__btn {
	background: linear-gradient(135deg, #8b5cf6, #06b6d4);
}
.elt-baro-card:hover .elt-baro-card__btn svg {
	transform: translateX(4px);
}
.elt-baro-card__hint {
	font-family: var(--font-ui);
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.48);
}

@media (max-width: 880px) {
	.elt-baro-card {
		grid-template-columns: 1fr;
		gap: var(--s-6);
		padding: var(--s-8) var(--s-6);
		min-height: 0;
	}
	.elt-baro-card__cta {
		align-items: flex-start;
	}
	.elt-baro-card__quote {
		font-size: 9rem;
		top: -16px;
	}
}

/* ============================================================
   In-article Barometer CTA — auto-injected, must not break flow
   ============================================================ */
.elt-incta {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: var(--s-5);
	align-items: center;
	margin: var(--s-8) 0;
	padding: var(--s-5) var(--s-6);
	background: linear-gradient(135deg, rgba(139, 92, 246, 0.04) 0%, rgba(34, 211, 238, 0.04) 100%);
	border: 1px solid rgba(139, 92, 246, 0.18);
	border-radius: var(--r-md);
	position: relative;
	overflow: hidden;
}
[data-theme="dark"] .elt-incta { background: linear-gradient(135deg, rgba(139, 92, 246, 0.1) 0%, rgba(34, 211, 238, 0.06) 100%);
		border-color: rgba(139, 92, 246, 0.3); }
@media (prefers-color-scheme: dark) {
	.elt-incta { background: linear-gradient(135deg, rgba(139, 92, 246, 0.1) 0%, rgba(34, 211, 238, 0.06) 100%);
		border-color: rgba(139, 92, 246, 0.3); }
}
.elt-incta__rail {
	width: 4px;
	min-height: 56px;
	border-radius: 999px;
	background: linear-gradient(to bottom, #8b5cf6, #22d3ee);
	flex-shrink: 0;
}
.elt-incta__body {
	min-width: 0;
}
.elt-incta__eyebrow {
	display: block;
	font-family: var(--font-ui);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #6d28d9;
	margin-bottom: 4px;
}
[data-theme="dark"] .elt-incta__eyebrow { color: #c4b5fd; }
@media (prefers-color-scheme: dark) {
	.elt-incta__eyebrow { color: #c4b5fd; }
}
.elt-incta__title {
	font-family: var(--font-display);
	font-size: 1.5rem;
	line-height: 1.2;
	margin: 0 0 6px;
	color: var(--ink);
}
.elt-incta__title em {
	font-style: italic;
}
.elt-incta__text {
	font-family: var(--font-ui);
	font-size: 14px;
	line-height: 1.5;
	color: var(--ink-muted);
	margin: 0;
}
.elt-incta__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 18px;
	background: var(--ink);
	color: var(--accent-ink);
	border-radius: 999px;
	font-family: var(--font-ui);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	flex-shrink: 0;
	transition: transform 0.2s ease, background 0.3s ease;
}
.elt-incta__cta svg { width: 14px; height: 14px; transition: transform 0.2s ease; }
.elt-incta__cta:hover {
	background: linear-gradient(135deg, #8b5cf6, #06b6d4);
}
.elt-incta__cta:hover svg {
	transform: translateX(3px);
}
@media (max-width: 640px) {
	.elt-incta {
		grid-template-columns: auto 1fr;
		gap: var(--s-4);
		padding: var(--s-5);
	}
	.elt-incta__cta {
		grid-column: 1 / -1;
		justify-self: stretch;
		justify-content: center;
		margin-top: var(--s-2);
	}
}

/* ============================================================
   Tool archive — cards, filters, badges, comparison
   ============================================================ */
.elt-tool-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: var(--r-md);
	transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1),
	            box-shadow 0.3s ease,
	            border-color 0.3s ease;
}
.elt-tool-card.is-hidden { display: none; }
.elt-tool-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 20px 40px -20px rgba(99, 102, 241, 0.25);
}
.elt-tool-card__cover {
	position: relative;
	display: block;
	aspect-ratio: 16 / 7;
	overflow: hidden;
	background: linear-gradient(135deg, #f5f3ff, #ecfeff);
	border-bottom: 1px solid var(--edge);
}
.elt-tool-card__cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.elt-tool-card:hover .elt-tool-card__cover img {
	transform: scale(1.04);
}
.elt-tool-card__cover-fallback {
	display: block;
	width: 100%;
	height: 100%;
	background:
		radial-gradient(ellipse 60% 80% at 80% 20%, rgba(139, 92, 246, 0.25), transparent 70%),
		radial-gradient(ellipse 50% 60% at 20% 80%, rgba(34, 211, 238, 0.15), transparent 70%);
}
.elt-tool-card__cat {
	position: absolute;
	top: 12px;
	right: 12px;
	padding: 4px 10px;
	background: rgba(255, 255, 255, 0.92);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-radius: 999px;
	font-family: var(--font-ui);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #1f2937;
	z-index: 1;
}
[data-theme="dark"] .elt-tool-card__cat { background: rgba(15, 15, 28, 0.85); color: #e5e7eb; }
@media (prefers-color-scheme: dark) {
	.elt-tool-card__cat { background: rgba(15, 15, 28, 0.85); color: #e5e7eb; }
}

/* -------- Tool header image --------------------------------- */
/* -------- Single-tool header -------------------------------- */
.elt-tool-head {
	/* no overflow hidden — text sits below the banner, not on top of it */
}
.elt-tool-head__banner {
	width: 100%;
	aspect-ratio: 16 / 5;
	overflow: hidden;
	background: var(--glass-2);
	border-bottom: 1px solid var(--edge);
}
.elt-tool-head__banner img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}
.elt-tool-head__body {
	padding-top: var(--s-8);
	padding-bottom: var(--s-6);
}
@media (max-width: 720px) {
	.elt-tool-head__banner { aspect-ratio: 16 / 7; }
	.elt-tool-head__body { padding-top: var(--s-6); }
}

/* -------- Category grid ------------------------------------- */
.elt-cat-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: var(--s-5);
	margin-top: var(--s-8);
}
.elt-cat-card {
	display: flex;
	flex-direction: column;
	gap: var(--s-3);
	padding: var(--s-6);
	background: var(--glass-3);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	text-decoration: none;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
}
.elt-cat-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 32px rgba(99, 102, 241, 0.12);
	border-color: var(--accent);
}
.elt-cat-card__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: var(--r-sm);
	background: rgba(99, 102, 241, 0.08);
	color: var(--accent);
	flex-shrink: 0;
}
.elt-cat-card__name {
	font-family: var(--font-ui);
	font-size: 15px;
	font-weight: 600;
	color: var(--ink);
	line-height: 1.3;
}
.elt-cat-card__desc {
	font-size: 13px;
	color: var(--ink-muted);
	line-height: 1.5;
	flex: 1;
}
.elt-cat-card__count {
	font-family: var(--font-ui);
	font-size: 11px;
	font-weight: 500;
	color: var(--accent);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-top: auto;
}
@media (max-width: 600px) {
	.elt-cat-grid { grid-template-columns: repeat(2, 1fr); gap: var(--s-4); }
	.elt-cat-card { padding: var(--s-5); }
}

/* -------- Barometer landing page ---------------------------- */
.elt-baro-hero {
	position: relative;
	padding: var(--s-12) 0 var(--s-10);
	overflow: hidden;
	background: var(--bg);
}
.elt-baro-hero__glow {
	position: absolute;
	inset: -10% -5%;
	background: radial-gradient(ellipse 60% 50% at 80% 20%, rgba(139,92,246,0.12) 0%, transparent 70%),
	            radial-gradient(ellipse 40% 40% at 15% 80%, rgba(34,211,238,0.08) 0%, transparent 70%);
	pointer-events: none;
	z-index: 0;
}
.elt-baro-hero .elt-container { position: relative; z-index: 1; }
.elt-baro-hero__badge {
	margin-bottom: var(--s-4);
}
.elt-baro-hero__title {
	font-family: var(--font-display);
	font-style: italic;
	font-size: clamp(2.8rem, 6vw, 5rem);
	line-height: 1.05;
	letter-spacing: -0.03em;
	color: var(--ink);
	margin: 0 0 var(--s-5);
}
.elt-baro-hero__subtitle {
	font-size: 1.15rem;
	color: var(--ink-muted);
	max-width: 600px;
	line-height: 1.65;
	margin: 0 0 var(--s-8);
}
.elt-baro-stats {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-6);
}
.elt-baro-stat {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.elt-baro-stat__num {
	font-family: var(--font-display);
	font-size: 2.5rem;
	font-weight: 700;
	font-style: italic;
	line-height: 1;
	color: var(--accent);
}
.elt-baro-stat__label {
	font-family: var(--font-ui);
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: var(--ink-muted);
}

/* Why participate cards */
.elt-baro-why {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: var(--s-6);
}
.elt-baro-why__item {
	display: flex;
	flex-direction: column;
	gap: var(--s-3);
}
.elt-baro-why__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: var(--r-sm);
	background: rgba(139, 92, 246, 0.08);
	color: var(--accent);
	flex-shrink: 0;
}
.elt-baro-why__item h3 {
	font-family: var(--font-ui);
	font-size: 15px;
	font-weight: 600;
	color: var(--ink);
	margin: 0;
}
.elt-baro-why__item p {
	font-size: 14px;
	color: var(--ink-muted);
	line-height: 1.6;
	margin: 0;
}

/* Form wrapper */
.elt-baro-form-wrap {
	background: var(--glass-3);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	padding: var(--s-8);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
}

/* Methodology grid */
.elt-baro-method {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: var(--s-8);
}
.elt-baro-method__col h3 {
	font-family: var(--font-ui);
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--accent);
	margin: 0 0 var(--s-3);
}
.elt-baro-method__col p {
	font-size: 14px;
	color: var(--ink-muted);
	line-height: 1.65;
	margin: 0;
}

/* Cite box */
.elt-baro-cite {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-6);
	align-items: flex-start;
	justify-content: space-between;
	padding: var(--s-8);
	background: var(--glass-3);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
}
.elt-baro-cite h3 {
	font-family: var(--font-ui);
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--ink-muted);
	margin: 0 0 var(--s-3);
}
.elt-baro-cite__text {
	font-family: var(--font-mono, monospace);
	font-size: 13px;
	color: var(--ink);
	line-height: 1.6;
	margin: 0;
	word-break: break-all;
}
.elt-baro-cite__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-3);
	align-items: center;
	flex-shrink: 0;
}

/* Alternate section background */
.elt-section--alt {
	background: rgba(99, 102, 241, 0.03);
}
[data-theme="dark"] .elt-section--alt { background: rgba(99, 102, 241, 0.06); }
@media (prefers-color-scheme: dark) {
	.elt-section--alt { background: rgba(99, 102, 241, 0.06); }
}

/* -------- Breadcrumbs --------------------------------------- */
.elt-breadcrumbs {
	margin: 0 0 var(--s-5);
	font-family: var(--font-ui);
	font-size: 13px;
	color: var(--ink-muted);
}
.elt-breadcrumbs__list {
	display: flex; flex-wrap: wrap;
	list-style: none; padding: 0; margin: 0;
	align-items: center;
	gap: 0;
}
.elt-breadcrumbs__item + .elt-breadcrumbs__item::before {
	content: "";
	display: inline-block;
	width: 12px; height: 12px;
	margin: 0 8px;
	background: currentColor;
	opacity: 0.5;
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m9 18 6-6-6-6'/></svg>") center/contain no-repeat;
	        mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m9 18 6-6-6-6'/></svg>") center/contain no-repeat;
	vertical-align: middle;
}
.elt-breadcrumbs a {
	color: var(--ink-2);
	transition: color 0.18s var(--ease);
}
.elt-breadcrumbs a:hover { color: var(--accent); }
.elt-breadcrumbs__item.is-current {
	color: var(--ink);
	max-width: 40ch;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* -------- Table of contents --------------------------------- */
.elt-toc {
	max-width: var(--container-prose);
	margin: 0 auto var(--s-10);
	padding: var(--s-6) var(--s-8);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	position: relative;
	overflow: hidden;
}
.elt-toc::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 32%);
	pointer-events: none;
}
.elt-toc__label {
	font-family: var(--font-ui);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--ink-3);
	margin-bottom: var(--s-4);
}
.elt-toc__list {
	list-style: none;
	padding: 0; margin: 0;
	font-family: var(--font-ui);
	font-size: 14.5px;
	line-height: 1.45;
}
.elt-toc__item { margin: 0 0 2px; position: relative; }
.elt-toc__item--3 { padding-left: 16px; font-size: 13.5px; color: var(--ink-3); }
.elt-toc__item a {
	display: block;
	padding: 6px 10px;
	border-radius: 8px;
	color: var(--ink-2);
	transition: color 0.15s var(--ease), background 0.15s var(--ease);
	letter-spacing: -0.005em;
}
.elt-toc__item a:hover {
	color: var(--ink);
	background: var(--glass-2);
}
.elt-toc__item.is-active > a {
	color: var(--accent);
	background: var(--glass-3);
}

/* -------- Author bio ---------------------------------------- */
.elt-author-bio {
	max-width: var(--container-prose);
	margin: var(--s-16) auto 0;
	padding: var(--s-8);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	display: flex;
	gap: var(--s-6);
	align-items: flex-start;
	position: relative;
	overflow: hidden;
}
.elt-author-bio::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 24%);
	pointer-events: none;
}
.elt-author-bio > * { position: relative; z-index: 1; }
.elt-author-bio__avatar {
	border-radius: 50%;
	border: 1px solid var(--edge);
	box-shadow: 0 1px 0 var(--rim-soft) inset, 0 8px 22px -8px rgba(0, 0, 0, 0.45);
	flex: 0 0 auto;
}
.elt-author-bio__body { flex: 1; min-width: 0; }
.elt-author-bio__eyebrow {
	display: inline-block;
	font-family: var(--font-ui);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--accent);
	margin-bottom: 6px;
}
.elt-author-bio__name {
	font-family: var(--font-display);
	font-style: normal;
	font-weight: 700;
	font-size: 1.75rem;
	margin: 0 0 4px;
	letter-spacing: -0.02em;
	line-height: 1.1;
}
.elt-author-bio__name a { color: var(--ink); }
.elt-author-bio__name a:hover { color: var(--accent); }
.elt-author-bio__role {
	font-family: var(--font-ui);
	color: var(--ink-3);
	font-size: 14px;
	margin: 0 0 var(--s-3);
	letter-spacing: -0.005em;
}
.elt-author-bio__text {
	font-family: var(--font-ui);
	color: var(--ink-2);
	font-size: 15px;
	line-height: 1.6;
	margin: 0 0 var(--s-4);
}
.elt-author-bio__links {
	display: flex; gap: 14px; flex-wrap: wrap;
	font-family: var(--font-ui);
	font-size: 13.5px;
}
.elt-author-bio__links a {
	color: var(--ink-2);
	border-bottom: 1px solid var(--edge);
	padding-bottom: 2px;
	transition: color 0.15s var(--ease), border-color 0.15s var(--ease);
}
.elt-author-bio__links a:hover { color: var(--accent); border-color: var(--accent); }

@media (max-width: 560px) {
	.elt-author-bio { flex-direction: column; padding: var(--s-6); }
}

/* Author archive hero */
.elt-author-hero {
	display: flex;
	gap: var(--s-8);
	align-items: flex-start;
	padding: var(--s-10) 0;
}
.elt-author-hero__avatar {
	border-radius: 50%;
	border: 1px solid var(--edge);
	box-shadow: 0 1px 0 var(--rim-soft) inset, 0 12px 36px -12px rgba(0, 0, 0, 0.5);
	flex: 0 0 auto;
}
.elt-author-hero__role {
	font-family: var(--font-ui);
	color: var(--ink-3);
	font-size: 1.0625rem;
	margin: 0 0 var(--s-3);
}
@media (max-width: 640px) {
	.elt-author-hero { flex-direction: column; }
}

/* -------- Prev / Next post ---------------------------------- */
.elt-prevnext {
	max-width: var(--container-prose);
	margin: var(--s-12) auto 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--s-4);
}
.elt-prevnext__link {
	display: block;
	padding: var(--s-5) var(--s-6);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	transition: background 0.2s var(--ease), border-color 0.2s var(--ease), transform 0.2s var(--ease-out);
}
.elt-prevnext__link:hover {
	background: var(--glass-3);
	border-color: var(--edge-strong);
	transform: translateY(-1px);
}
.elt-prevnext__link--next { text-align: right; }
.elt-prevnext__label {
	display: block;
	font-family: var(--font-ui);
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink-muted);
	margin-bottom: 6px;
}
.elt-prevnext__title {
	display: block;
	font-family: var(--font-ui);
	font-size: 15px;
	font-weight: 500;
	color: var(--ink);
	letter-spacing: -0.008em;
	line-height: 1.35;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
}
@media (max-width: 560px) {
	.elt-prevnext { grid-template-columns: 1fr; }
	.elt-prevnext__link--next { text-align: left; }
}

/* -------- Reading progress --------------------------------- */
.elt-progress {
	position: fixed;
	top: 0; left: 0; right: 0;
	height: 3px;
	z-index: 80;
	background: var(--glass-1);
	pointer-events: none;
}
.elt-progress__bar {
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, var(--aurora-2), var(--aurora-1) 60%, var(--aurora-4));
	box-shadow: 0 0 12px color-mix(in oklab, var(--aurora-1) 60%, transparent);
	transition: width 0.05s linear;
}

/* -------- Back to top -------------------------------------- */
.elt-top {
	position: fixed;
	right: 20px;
	bottom: 20px;
	width: 46px;
	height: 46px;
	border-radius: var(--r-pill);
	background: var(--glass-heavy);
	border: 1px solid var(--edge);
	color: var(--ink);
	display: grid;
	place-items: center;
	backdrop-filter: var(--blur-3);
	-webkit-backdrop-filter: var(--blur-3);
	box-shadow: var(--shadow-2);
	opacity: 0;
	transform: translateY(10px);
	transition: opacity 0.25s var(--ease), transform 0.25s var(--ease), background 0.2s var(--ease);
	z-index: 70;
}
.elt-top.is-visible {
	opacity: 1;
	transform: translateY(0);
}
.elt-top:hover { background: var(--glass-4); }
.elt-top svg { width: 18px; height: 18px; }

/* -------- Cookie banner — DSGVO-friendly bottom sheet -------- */
.elt-cookie {
	position: fixed;
	left: 50%;
	bottom: 24px;
	transform: translateX(-50%) translateY(20px);
	width: calc(100% - 32px);
	max-width: 720px;
	padding: var(--s-6) var(--s-8);
	background: var(--glass-heavy);
	border: 1px solid var(--edge-strong);
	border-radius: var(--r-lg);
	backdrop-filter: var(--blur-3);
	-webkit-backdrop-filter: var(--blur-3);
	box-shadow: var(--shadow-3);
	z-index: 95;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: var(--s-6) var(--s-5);
	align-items: center;
	opacity: 0;
	animation: elt-cookie-rise 0.55s var(--ease-out) 0.7s forwards;
}
.elt-cookie::before {
	content: "";
	position: absolute; inset: 0;
	border-radius: inherit;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.10), transparent 28%);
	pointer-events: none;
}
.elt-cookie > * { position: relative; z-index: 1; }

@keyframes elt-cookie-rise {
	to { opacity: 1; transform: translateX(-50%) translateY(0); }
}

.elt-cookie__close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 32px;
	height: 32px;
	border-radius: var(--r-pill);
	display: grid;
	place-items: center;
	color: var(--ink-3);
	background: transparent;
	transition: background 0.15s var(--ease), color 0.15s var(--ease);
	z-index: 2;
}
.elt-cookie__close:hover { background: var(--glass-3); color: var(--ink); }
.elt-cookie__close svg { width: 16px; height: 16px; }

.elt-cookie__body {
	display: flex;
	gap: var(--s-4);
	align-items: flex-start;
	padding-right: var(--s-6);
}
.elt-cookie__icon {
	flex: 0 0 40px;
	width: 40px; height: 40px;
	border-radius: 10px;
	background: color-mix(in oklab, var(--accent) 14%, var(--glass-3));
	color: var(--accent);
	display: grid; place-items: center;
}
.elt-cookie__icon svg { width: 22px; height: 22px; }

.elt-cookie__text { flex: 1; min-width: 0; }
.elt-cookie__title {
	display: block;
	font-family: var(--font-ui);
	font-size: 15px;
	font-weight: 600;
	color: var(--ink);
	letter-spacing: -0.008em;
	margin: 0 0 4px;
}
.elt-cookie__text p {
	font-family: var(--font-ui);
	font-size: 13.5px;
	color: var(--ink-2);
	line-height: 1.5;
	margin: 0;
}
.elt-cookie__text a {
	color: var(--accent);
	border-bottom: 1px solid currentColor;
	padding-bottom: 1px;
	margin-left: 4px;
	white-space: nowrap;
}

.elt-cookie__actions {
	display: flex;
	gap: 8px;
	flex-shrink: 0;
}

@media (max-width: 720px) {
	.elt-cookie {
		left: 16px;
		right: 16px;
		transform: translateY(20px);
		width: auto;
		grid-template-columns: 1fr;
		padding: var(--s-5) var(--s-6);
		gap: var(--s-4);
		bottom: 16px;
	}
	@keyframes elt-cookie-rise {
		to { opacity: 1; transform: translateY(0); }
	}
	.elt-cookie__body { padding-right: var(--s-8); }
	.elt-cookie__actions { justify-content: flex-end; flex-wrap: wrap; }
	.elt-cookie__actions .elt-btn { flex: 1; min-width: 140px; }
}

.elt-cookie.is-hiding {
	opacity: 0;
	transform: translateX(-50%) translateY(20px);
	pointer-events: none;
	transition: opacity 0.3s var(--ease), transform 0.3s var(--ease);
}
@media (max-width: 720px) {
	.elt-cookie.is-hiding { transform: translateY(20px); }
}

/* -------- Tool card + directory (consolidated) ------------- */
.elt-card-grid--tools {
	grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 960px) { .elt-card-grid--tools { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .elt-card-grid--tools { grid-template-columns: 1fr; } }

.elt-tool-card .elt-card__body {
	padding: var(--s-5) var(--s-6);
	gap: var(--s-3);
	display: flex;
	flex-direction: column;
	flex: 1;
}
.elt-tool-card__head {
	display: flex; gap: var(--s-4); align-items: flex-start; justify-content: space-between;
}
.elt-tool-card__title {
	font-family: var(--font-ui);
	font-size: 1.125rem;
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1.2;
	margin: 0 0 2px;
}
.elt-tool-card__title a { color: var(--ink); text-decoration: none; }
.elt-tool-card__title a:hover {
	background: linear-gradient(135deg, #8b5cf6, #06b6d4);
	-webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent;
}
.elt-tool-card__host {
	display: block;
	font-family: var(--font-mono, monospace);
	font-size: 12px;
	color: var(--ink-muted);
	letter-spacing: -0.01em;
}
.elt-tool-card__rating {
	display: flex; gap: 1px; flex-shrink: 0; color: var(--ink-muted);
}
.elt-star { color: var(--ink-muted); opacity: 0.3; }
.elt-star.is-filled { color: var(--aurora-3); opacity: 1; }

/* Compliance badges */
.elt-tool-card__badges {
	display: flex; flex-wrap: wrap; gap: 6px;
}
.elt-tool-badge {
	display: inline-flex; align-items: center; gap: 4px;
	padding: 3px 8px;
	border-radius: 999px;
	font-family: var(--font-ui);
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.4;
	border: 1px solid transparent;
}
.elt-tool-badge--good {
	background: rgba(5, 150, 105, 0.1);
	color: #059669;
	border-color: rgba(5, 150, 105, 0.2);
}
.elt-tool-badge--mid {
	background: rgba(217, 119, 6, 0.1);
	color: #d97706;
	border-color: rgba(217, 119, 6, 0.2);
}
.elt-tool-badge--bad {
	background: rgba(220, 38, 38, 0.1);
	color: #dc2626;
	border-color: rgba(220, 38, 38, 0.2);
}
[data-theme="dark"] .elt-tool-badge--good { background: rgba(16, 185, 129, 0.15); color: #34d399; border-color: rgba(16, 185, 129, 0.25); }
[data-theme="dark"] .elt-tool-badge--mid  { background: rgba(245, 158, 11, 0.15); color: #fbbf24; border-color: rgba(245, 158, 11, 0.25); }
[data-theme="dark"] .elt-tool-badge--bad  { background: rgba(239, 68, 68, 0.15); color: #f87171; border-color: rgba(239, 68, 68, 0.25); }
@media (prefers-color-scheme: dark) {
	.elt-tool-badge--good { background: rgba(16, 185, 129, 0.15); color: #34d399; border-color: rgba(16, 185, 129, 0.25); }
	.elt-tool-badge--mid  { background: rgba(245, 158, 11, 0.15); color: #fbbf24; border-color: rgba(245, 158, 11, 0.25); }
	.elt-tool-badge--bad  { background: rgba(239, 68, 68, 0.15); color: #f87171; border-color: rgba(239, 68, 68, 0.25); }
}

.elt-tool-card__facts {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 16px;
	margin: 0;
	padding-top: var(--s-3);
	border-top: 1px solid var(--edge);
}
.elt-tool-card__facts > div { display: flex; flex-direction: column; gap: 2px; }
.elt-tool-card__facts dt {
	font-family: var(--font-ui);
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ink-muted);
	font-weight: 600;
	margin: 0;
}
.elt-tool-card__facts dd {
	font-family: var(--font-ui);
	font-size: 13px;
	color: var(--ink-2);
	margin: 0;
	letter-spacing: -0.005em;
}

/* Card footer with compare + detail link */
.elt-tool-card__footer {
	display: flex; justify-content: space-between; align-items: center;
	margin-top: auto;
	padding-top: var(--s-3);
	border-top: 1px solid var(--edge);
}
.elt-tool-card__compare {
	display: flex; align-items: center; gap: 6px;
	font-family: var(--font-ui);
	font-size: 12px;
	color: var(--ink-muted);
	cursor: pointer;
	user-select: none;
}
.elt-tool-card__compare input[type="checkbox"] {
	width: 16px; height: 16px;
	accent-color: var(--accent);
	cursor: pointer;
}
.elt-tool-card__link {
	display: inline-flex; align-items: center; gap: 4px;
	font-family: var(--font-ui);
	font-size: 12.5px;
	font-weight: 600;
	color: var(--accent);
	text-decoration: none;
}
.elt-tool-card__link:hover { text-decoration: underline; }

/* -------- Tool filters ----------------------------------- */
.elt-tool-filters {
	display: flex; flex-direction: column; gap: var(--s-4);
	margin-bottom: var(--s-8);
}
.elt-tool-filters__cats {
	display: flex; flex-wrap: wrap; gap: 8px;
}
.elt-tool-filter {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	display: inline-flex; align-items: center; gap: 6px;
	padding: 7px 16px;
	border: 1px solid var(--edge);
	border-radius: 999px;
	background: var(--glass-2);
	font-family: var(--font-ui);
	font-size: 13px;
	font-weight: 500;
	color: var(--ink-2);
	cursor: pointer;
	line-height: 1.4;
	transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.elt-tool-filter:hover {
	background: var(--glass-3);
	border-color: var(--edge-strong);
}
.elt-tool-filter.is-active {
	background: var(--accent);
	border-color: var(--accent);
	color: var(--accent-ink);
}
.elt-tool-filter__count {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 20px; height: 20px;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.08);
	font-size: 10.5px;
	font-weight: 700;
}
.elt-tool-filter.is-active .elt-tool-filter__count {
	background: rgba(255, 255, 255, 0.25);
}
.elt-tool-filters__compliance {
	display: flex; flex-wrap: wrap; gap: 8px;
}
.elt-tool-badge-filter {
	cursor: pointer;
	user-select: none;
}
.elt-tool-badge-filter input { display: none; }
.elt-tool-badge-filter .elt-tool-badge {
	cursor: pointer;
	transition: opacity 0.2s, box-shadow 0.2s;
	opacity: 0.5;
}
.elt-tool-badge-filter input:checked + .elt-tool-badge {
	opacity: 1;
	box-shadow: 0 0 0 2px var(--accent);
}
@media (max-width: 600px) {
	.elt-tool-filters__cats { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 4px; }
	.elt-tool-filters__cats::-webkit-scrollbar { display: none; }
	.elt-tool-filter { white-space: nowrap; flex: 0 0 auto; }
}

/* -------- Compare prompt (floating bar) ------------------- */
.elt-tool-compare-prompt {
	position: fixed;
	bottom: -100px;
	left: 0; right: 0;
	z-index: 900;
	padding: 0 var(--s-6);
	transition: bottom 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
	pointer-events: none;
}
.elt-tool-compare-prompt.is-visible {
	bottom: var(--s-6);
	pointer-events: auto;
}
.elt-tool-compare-prompt__inner {
	max-width: 680px;
	margin: 0 auto;
	display: flex; align-items: center; justify-content: space-between; gap: var(--s-4);
	padding: var(--s-4) var(--s-6);
	background: var(--glass-4);
	border: 1px solid var(--edge-strong);
	border-radius: var(--r-lg);
	backdrop-filter: blur(20px) saturate(1.6);
	-webkit-backdrop-filter: blur(20px) saturate(1.6);
	box-shadow: 0 20px 60px -20px rgba(0, 0, 0, 0.35);
}
.elt-tool-compare-prompt__label {
	font-family: var(--font-ui);
	font-size: 13.5px;
	color: var(--ink-2);
}
.elt-tool-compare-prompt__actions {
	display: flex; gap: 8px;
}
@media (max-width: 600px) {
	.elt-tool-compare-prompt__inner { flex-direction: column; text-align: center; }
}

/* -------- Compare table ----------------------------------- */
.elt-tool-compare {
	margin-top: var(--s-10);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	padding: var(--s-6);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
}
.elt-tool-compare[aria-hidden="true"] { display: none; }
.elt-tool-compare__head {
	display: flex; justify-content: space-between; align-items: center;
	margin-bottom: var(--s-6);
}
.elt-tool-compare__head h2 {
	font-family: var(--font-display);
	font-size: 1.5rem;
	margin: 0;
}
.elt-tool-compare__body table {
	width: 100%;
	border-collapse: collapse;
	font-family: var(--font-ui);
	font-size: 14px;
}
.elt-tool-compare__body th,
.elt-tool-compare__body td {
	padding: var(--s-3) var(--s-4);
	text-align: left;
	border-bottom: 1px solid var(--edge);
	vertical-align: top;
}
.elt-tool-compare__body th {
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink-muted);
	font-weight: 600;
	width: 30%;
}
.elt-tool-compare__body td {
	color: var(--ink);
}
.elt-tool-compare__body .cmp-name {
	font-weight: 700;
	font-size: 1.125rem;
}
.elt-tool-compare__body .cmp-good { color: var(--success); }
.elt-tool-compare__body .cmp-mid  { color: var(--warning); }
.elt-tool-compare__body .cmp-bad  { color: var(--danger); }
@media (max-width: 600px) {
	.elt-tool-compare__body th { font-size: 10px; padding: var(--s-2) var(--s-3); }
	.elt-tool-compare__body td { font-size: 13px; padding: var(--s-2) var(--s-3); }
}

/* -------- Single tool layout ----------------------------- */
.elt-tool-hero {
	display: flex; align-items: flex-start; gap: var(--s-6);
}
.elt-tool-hero__rating {
	display: flex; align-items: center; gap: 4px;
	margin-top: var(--s-3);
}
.elt-tool-hero__rating-label {
	font-family: var(--font-ui);
	font-size: 12px;
	color: var(--ink-muted);
	margin-left: 4px;
}
@media (max-width: 560px) { .elt-tool-hero { flex-direction: column; } }

.elt-tool-facts {
	max-width: var(--container-prose);
	margin: 0 auto var(--s-6);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: var(--s-4);
	padding: var(--s-5) var(--s-6);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
}
.elt-tool-facts > div { display: flex; flex-direction: column; gap: 4px; }
.elt-tool-facts dt {
	font-family: var(--font-ui);
	font-size: 10.5px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ink-muted);
	font-weight: 600;
	margin: 0;
}
.elt-tool-facts dd {
	font-family: var(--font-ui);
	font-size: 14px;
	color: var(--ink);
	margin: 0;
	font-weight: 500;
	letter-spacing: -0.005em;
}

/* Single-tool compliance grid */
.elt-tool-compliance-grid {
	max-width: var(--container-prose);
	margin: 0 auto var(--s-8);
	padding: var(--s-5) var(--s-6);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
}
.elt-tool-compliance-grid__title {
	font-family: var(--font-ui);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink-muted);
	margin: 0 0 var(--s-4);
}
.elt-tool-compliance-grid__items {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: var(--s-4);
}
.elt-tool-compliance-item {
	display: flex; align-items: center; gap: var(--s-3);
	padding: var(--s-3) var(--s-4);
	background: var(--glass-1);
	border-radius: var(--r-sm);
	border: 1px solid var(--edge);
}
.elt-tool-compliance-item__icon {
	flex: 0 0 auto;
	display: flex; align-items: center; justify-content: center;
	width: 32px; height: 32px;
	border-radius: 999px;
}
.elt-tool-compliance-item--good .elt-tool-compliance-item__icon { background: rgba(5, 150, 105, 0.12); color: var(--success); }
.elt-tool-compliance-item--mid  .elt-tool-compliance-item__icon { background: rgba(217, 119, 6, 0.12); color: var(--warning); }
.elt-tool-compliance-item--bad  .elt-tool-compliance-item__icon { background: rgba(220, 38, 38, 0.12); color: var(--danger); }
.elt-tool-compliance-item__label {
	font-family: var(--font-ui);
	font-size: 12.5px;
	color: var(--ink-muted);
	flex: 1;
}
.elt-tool-compliance-item__value {
	font-family: var(--font-ui);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--ink);
}

/* -------- Prose list item for hash-links ------------------- */
.elt-prose h2, .elt-prose h3 { scroll-margin-top: 100px; }

/* -------- Topic pillars (homepage) -------------------------- */
.elt-pillars {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--s-6);
}
@media (max-width: 980px) { .elt-pillars { grid-template-columns: 1fr; gap: var(--s-4); } }

.elt-pillar {
	position: relative;
	background: linear-gradient(180deg, var(--glass-3) 0%, var(--glass-1) 60%);
	border: 1px solid var(--edge);
	border-radius: var(--r-lg);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	padding: var(--s-8);
	display: flex;
	flex-direction: column;
	gap: var(--s-5);
	overflow: hidden;
	box-shadow: var(--shadow-1);
	isolation: isolate;
}
.elt-pillar::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 22%);
	pointer-events: none;
	z-index: 0;
}
.elt-pillar > * { position: relative; z-index: 1; }

.elt-pillar__head { display: flex; flex-direction: column; gap: 6px; }
.elt-pillar__cat {
	font-family: var(--font-ui);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--accent);
	transition: color 0.18s var(--ease);
}
.elt-pillar__cat:hover { color: var(--accent-2); }
.elt-pillar__kicker {
	font-family: var(--font-display);
	font-style: normal;
	font-weight: 700;
	font-size: 1.5rem;
	line-height: 1.15;
	letter-spacing: -0.018em;
	color: var(--ink);
	margin: 0;
}

.elt-pillar__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
}
.elt-pillar__item {
	padding: 14px 0;
	border-top: 1px solid var(--edge);
}
.elt-pillar__item:first-child { border-top: 0; padding-top: 0; }
.elt-pillar__title {
	display: block;
	font-family: var(--font-ui);
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: -0.008em;
	color: var(--ink);
	transition: color 0.18s var(--ease);
}
.elt-pillar__title:hover { color: var(--accent); }
.elt-pillar__meta {
	display: flex;
	gap: 10px;
	align-items: center;
	margin-top: 6px;
	color: var(--ink-muted);
	font-family: var(--font-ui);
	font-size: 12.5px;
	font-variant-numeric: tabular-nums;
}

.elt-pillar__more {
	margin-top: auto;
	font-family: var(--font-ui);
	font-size: 13.5px;
	font-weight: 500;
	color: var(--accent);
	letter-spacing: -0.005em;
	transition: color 0.18s var(--ease), gap 0.18s var(--ease);
	display: inline-flex;
	gap: 4px;
}
.elt-pillar__more:hover { color: var(--accent-2); gap: 8px; }

/* -------- Pull-quote (editorial homepage section) ----------- */
.elt-pull {
	max-width: 920px;
	margin: 0 auto;
	padding: var(--s-12) var(--s-8);
	border-radius: var(--r-xl);
	background:
		radial-gradient(60% 80% at 0% 0%, rgba(34, 211, 238, 0.18), transparent 60%),
		radial-gradient(80% 100% at 100% 100%, rgba(139, 92, 246, 0.18), transparent 60%),
		var(--glass-2);
	border: 1px solid var(--edge);
	backdrop-filter: var(--blur-3);
	-webkit-backdrop-filter: var(--blur-3);
	box-shadow: var(--shadow-2);
	text-align: center;
	position: relative;
	overflow: hidden;
}
.elt-pull::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 22%);
	pointer-events: none;
}
.elt-pull > * { position: relative; z-index: 1; }
.elt-pull .elt-eyebrow { margin-bottom: var(--s-5); }
.elt-pull__text {
	font-family: var(--font-display);
	font-style: normal;
	font-weight: 700;
	font-size: clamp(1.5rem, 3vw, 2.25rem);
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--ink);
	margin: 0 0 var(--s-6);
}
.elt-pull__caption {
	font-family: var(--font-ui);
	font-size: 14px;
	color: var(--ink-3);
	letter-spacing: -0.005em;
}
.elt-pull__caption a {
	color: var(--ink);
	border-bottom: 1px solid var(--edge);
	padding-bottom: 1px;
	transition: color 0.18s var(--ease), border-color 0.18s var(--ease);
}
.elt-pull__caption a:hover { color: var(--accent); border-color: var(--accent); }

/* -------- Glossary teaser link ------------------------------ */
.elt-teaser {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: var(--s-8);
	align-items: center;
	padding: var(--s-8) var(--s-10);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-lg);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	box-shadow: var(--shadow-1);
	transition: background 0.2s var(--ease), border-color 0.2s var(--ease), transform 0.25s var(--ease-out);
	position: relative;
	overflow: hidden;
}
.elt-teaser::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 24%);
	pointer-events: none;
}
.elt-teaser > * { position: relative; z-index: 1; }
.elt-teaser:hover {
	background: var(--glass-3);
	border-color: var(--edge-strong);
	transform: translateY(-2px);
}
.elt-teaser__title {
	font-family: var(--font-display);
	font-style: normal;
	font-weight: 700;
	font-size: clamp(1.5rem, 2.6vw, 2rem);
	line-height: 1.1;
	letter-spacing: -0.022em;
	color: var(--ink);
	margin: var(--s-2) 0 var(--s-3);
}
.elt-teaser__title em {
	background: linear-gradient(100deg, var(--aurora-2), var(--aurora-1) 50%, var(--aurora-4));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.elt-teaser__text {
	font-family: var(--font-ui);
	color: var(--ink-2);
	max-width: 60ch;
	margin: 0;
	line-height: 1.55;
	font-size: 1rem;
}
.elt-teaser__cta {
	font-family: var(--font-ui);
	font-weight: 500;
	font-size: 14px;
	color: var(--accent);
	letter-spacing: -0.005em;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
@media (max-width: 720px) {
	.elt-teaser { grid-template-columns: 1fr; }
}

/* -------- FAQ accordion ------------------------------------- */
.elt-faq {
	max-width: var(--container-prose);
	margin: var(--s-10) auto;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.elt-faq__item {
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	overflow: hidden;
	transition: background 0.2s var(--ease), border-color 0.2s var(--ease);
}
.elt-faq__item[open] {
	background: var(--glass-3);
	border-color: var(--edge-strong);
}
.elt-faq__q {
	padding: 18px 22px;
	font-family: var(--font-ui);
	font-size: 1.0625rem;
	font-weight: 500;
	letter-spacing: -0.008em;
	color: var(--ink);
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	position: relative;
}
.elt-faq__q::-webkit-details-marker { display: none; }
.elt-faq__q::after {
	content: "";
	width: 20px; height: 20px;
	flex: 0 0 auto;
	background: currentColor;
	opacity: 0.6;
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 5v14M5 12h14'/></svg>") center/contain no-repeat;
	        mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 5v14M5 12h14'/></svg>") center/contain no-repeat;
	transition: transform 0.2s var(--ease);
}
.elt-faq__item[open] .elt-faq__q::after {
	transform: rotate(45deg);
}
.elt-faq__a {
	padding: 0 22px 18px;
	font-family: var(--font-serif);
	font-size: 1rem;
	line-height: 1.65;
	color: var(--ink-2);
}
.elt-faq__a p { margin: 0; }
.elt-faq__a a { color: var(--accent); }

/* -------- Topic Pillar Page -------------------------------- */
.elt-pillar-page .elt-article__title {
	font-size: clamp(2.5rem, 6vw, 4.75rem);
	letter-spacing: -0.028em;
	line-height: 0.98;
}
.elt-pillar-page .elt-meta__cat {
	font-size: 11.5px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--accent);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-pill);
	padding: 6px 14px;
	display: inline-block;
	margin-bottom: var(--s-5);
	font-weight: 600;
}
.elt-pillar-page .elt-toc {
	background: linear-gradient(180deg, var(--glass-3) 0%, var(--glass-1) 60%);
	border-color: var(--edge-strong);
	box-shadow: var(--shadow-1);
}
@media (min-width: 1180px) {
	.elt-pillar-page .elt-toc {
		position: sticky;
		top: 96px;
		max-width: 280px;
		margin: 0 0 var(--s-10) auto;
		float: right;
		clear: right;
		shape-outside: margin-box;
		transform: translateX(calc(50vw - var(--container-prose) / 2 - 100%));
	}
}
.elt-pillar-spokes {
	padding: var(--s-16) 0 var(--s-12);
	margin-top: var(--s-12);
	border-top: 1px solid var(--edge);
}
.elt-pillar-spokes__heading {
	font-family: var(--font-display);
	font-style: normal;
	font-weight: 700;
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	line-height: 1.05;
	letter-spacing: -0.022em;
	color: var(--ink);
	margin: 0 0 var(--s-3);
}
.elt-pillar-spokes__heading em {
	background: linear-gradient(100deg, var(--aurora-2), var(--aurora-1) 60%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

/* -------- Studies database --------------------------------- */
.elt-study-card {
	display: flex;
	flex-direction: column;
	gap: var(--s-4);
	padding: var(--s-6);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	box-shadow: var(--shadow-1);
	transition: transform 0.25s var(--ease-out), border-color 0.25s var(--ease-out), background 0.25s var(--ease-out);
	position: relative;
	overflow: hidden;
}
.elt-study-card::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 24%);
	pointer-events: none;
}
.elt-study-card > * { position: relative; z-index: 1; }
.elt-study-card:hover {
	transform: translateY(-2px);
	background: var(--glass-3);
	border-color: var(--edge-strong);
}
.elt-study-card__top {
	display: flex;
	gap: 12px;
	align-items: center;
	justify-content: space-between;
	font-family: var(--font-ui);
	font-size: 11.5px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-muted);
	font-weight: 600;
}
.elt-study-card__year {
	color: var(--accent);
}
.elt-study-card__title {
	font-family: var(--font-display);
	font-style: normal;
	font-weight: 700;
	font-size: 1.5rem;
	line-height: 1.15;
	letter-spacing: -0.018em;
	margin: 0;
}
.elt-study-card__title a {
	color: var(--ink);
	transition: color 0.18s var(--ease);
}
.elt-study-card__title a:hover { color: var(--accent); }
.elt-study-card__finding {
	font-family: var(--font-serif);
	font-size: 1rem;
	line-height: 1.55;
	color: var(--ink-2);
	margin: 0;
}
.elt-study-card__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: auto;
	font-family: var(--font-ui);
	font-size: 12.5px;
	color: var(--ink-3);
}
.elt-study-card__facts span {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.elt-study-card__facts strong {
	color: var(--ink);
	font-weight: 500;
}

.elt-study-meta {
	max-width: var(--container-prose);
	margin: 0 auto var(--s-10);
	padding: var(--s-6) var(--s-8);
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--s-4);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
}
.elt-study-meta dt {
	font-family: var(--font-ui);
	font-size: 10.5px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-muted);
	font-weight: 600;
	margin: 0 0 4px;
}
.elt-study-meta dd {
	font-family: var(--font-ui);
	font-size: 14px;
	color: var(--ink);
	margin: 0;
	font-weight: 500;
}
@media (max-width: 720px) {
	.elt-study-meta { grid-template-columns: repeat(2, 1fr); }
}

.elt-study-filters {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin: 0 0 var(--s-10);
	padding: var(--s-3);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-pill);
	backdrop-filter: var(--blur-1);
	width: fit-content;
}
.elt-study-filters a {
	padding: 8px 16px;
	border-radius: var(--r-pill);
	color: var(--ink-2);
	font-family: var(--font-ui);
	font-size: 13.5px;
	font-weight: 500;
	transition: background 0.18s var(--ease), color 0.18s var(--ease);
}
.elt-study-filters a:hover { background: var(--glass-3); color: var(--ink); }
.elt-study-filters a.is-active {
	background: var(--accent);
	color: white;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25) inset, 0 4px 14px -4px color-mix(in oklab, var(--accent) 60%, transparent);
}

/* -------- DACH L&D Barometer (form + results) -------------- */
.elt-barometer {
	max-width: var(--container-narrow);
	margin: var(--s-12) auto;
	padding: var(--s-12);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-xl);
	backdrop-filter: var(--blur-3);
	-webkit-backdrop-filter: var(--blur-3);
	box-shadow: var(--shadow-2);
	position: relative;
	overflow: hidden;
}
.elt-barometer::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 22%);
	pointer-events: none;
}
.elt-barometer > * { position: relative; z-index: 1; }
.elt-barometer__head { margin-bottom: var(--s-10); }
.elt-barometer__title {
	font-family: var(--font-display);
	font-style: normal;
	font-weight: 700;
	font-size: clamp(1.75rem, 3.4vw, 2.75rem);
	line-height: 1.05;
	letter-spacing: -0.022em;
	margin: var(--s-3) 0 var(--s-3);
	color: var(--ink);
}
.elt-barometer__title em {
	background: linear-gradient(100deg, var(--aurora-2), var(--aurora-1) 60%, var(--aurora-4));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.elt-barometer__intro {
	font-family: var(--font-ui);
	color: var(--ink-2);
	font-size: 1.0625rem;
	line-height: 1.55;
	margin: 0;
	max-width: 60ch;
}
.elt-barometer__intro a {
	color: var(--accent);
	border-bottom: 1px solid currentColor;
	padding-bottom: 1px;
}
.elt-barometer__q {
	border: 0;
	margin: 0 0 var(--s-8);
	padding: 0;
}
.elt-barometer__label {
	display: block;
	font-family: var(--font-ui);
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: -0.008em;
	color: var(--ink);
	margin-bottom: var(--s-3);
}
.elt-barometer__required { color: var(--accent); }
.elt-barometer__sub {
	font-family: var(--font-ui);
	font-size: 12.5px;
	color: var(--ink-muted);
	margin: 8px 0 0;
}
.elt-barometer__choices {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}
.elt-barometer__choices--multi { grid-template-columns: 1fr 1fr; }
@media (max-width: 600px) {
	.elt-barometer__choices,
	.elt-barometer__choices--multi { grid-template-columns: 1fr; }
}
.elt-barometer__choice {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-sm);
	font-family: var(--font-ui);
	font-size: 14.5px;
	color: var(--ink);
	cursor: pointer;
	transition: background 0.2s var(--ease), border-color 0.2s var(--ease);
}
.elt-barometer__choice:hover {
	background: var(--glass-3);
	border-color: var(--edge-strong);
}
.elt-barometer__choice input[type="radio"],
.elt-barometer__choice input[type="checkbox"] {
	flex: 0 0 auto;
	margin: 0;
	accent-color: var(--accent);
	width: 16px; height: 16px;
}
.elt-barometer__choice:has(input:checked) {
	background: color-mix(in oklab, var(--accent) 14%, var(--glass-2));
	border-color: color-mix(in oklab, var(--accent) 50%, var(--edge));
}
.elt-barometer__scale {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
	font-family: var(--font-ui);
	font-size: 13px;
	color: var(--ink-muted);
}
.elt-barometer__scale-step {
	display: inline-grid;
	place-items: center;
	gap: 4px;
	cursor: pointer;
}
.elt-barometer__scale-step input[type="radio"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.elt-barometer__scale-step span {
	display: inline-grid;
	place-items: center;
	width: 44px; height: 44px;
	border-radius: 50%;
	background: var(--glass-2);
	border: 1px solid var(--edge);
	color: var(--ink);
	font-weight: 500;
	font-size: 14.5px;
	font-variant-numeric: tabular-nums;
	transition: background 0.2s var(--ease), border-color 0.2s var(--ease), transform 0.2s var(--ease);
}
.elt-barometer__scale-step:hover span { background: var(--glass-3); transform: translateY(-1px); }
.elt-barometer__scale-step:has(input:checked) span {
	background: var(--accent);
	color: white;
	border-color: var(--accent);
	box-shadow: 0 4px 14px -4px color-mix(in oklab, var(--accent) 60%, transparent);
}
.elt-barometer__scale-label { font-size: 12.5px; }

.elt-barometer__textarea {
	min-height: 90px;
	max-width: 100%;
	resize: vertical;
}
.elt-barometer__consent {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-family: var(--font-ui);
	font-size: 13.5px;
	color: var(--ink-2);
	line-height: 1.5;
	margin-top: var(--s-3);
}
.elt-barometer__consent input[type="checkbox"] {
	margin: 4px 0 0;
	accent-color: var(--accent);
	flex: 0 0 auto;
}
.elt-barometer__hint {
	font-family: var(--font-ui);
	font-size: 12.5px;
	color: var(--ink-muted);
	margin: var(--s-3) 0 0;
}

/* Results */
.elt-barometer-results {
	max-width: var(--container-narrow);
	margin: var(--s-16) auto;
}
.elt-barometer-results__head {
	margin-bottom: var(--s-10);
}
.elt-barometer-results__head h2 {
	font-family: var(--font-display);
	font-style: normal;
	font-weight: 700;
	font-size: clamp(1.75rem, 3.4vw, 2.75rem);
	letter-spacing: -0.022em;
	line-height: 1.05;
	margin: var(--s-3) 0 var(--s-3);
	color: var(--ink);
}
.elt-barometer-results__head h2 em {
	background: linear-gradient(100deg, var(--aurora-2), var(--aurora-1) 60%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.elt-barometer-results__q {
	margin: 0 0 var(--s-10);
	padding: var(--s-6) var(--s-8);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
}
.elt-barometer-results__label {
	font-family: var(--font-ui);
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: -0.008em;
	color: var(--ink);
	margin: 0 0 var(--s-4);
}
.elt-barometer-bars {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.elt-barometer-bar {
	display: grid;
	grid-template-columns: 1fr 2fr 56px;
	align-items: center;
	gap: 14px;
	font-family: var(--font-ui);
	font-size: 13.5px;
}
.elt-barometer-bar__label {
	color: var(--ink-2);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.elt-barometer-bar__track {
	background: var(--glass-3);
	border-radius: var(--r-pill);
	height: 10px;
	overflow: hidden;
}
.elt-barometer-bar__fill {
	height: 100%;
	background: linear-gradient(90deg, var(--aurora-2), var(--aurora-1) 60%, var(--aurora-4));
	border-radius: inherit;
	box-shadow: 0 0 12px color-mix(in oklab, var(--aurora-1) 40%, transparent);
	transition: width 0.6s var(--ease-out);
}
.elt-barometer-bar__value {
	text-align: right;
	color: var(--ink);
	font-weight: 500;
	font-variant-numeric: tabular-nums;
}
@media (max-width: 600px) {
	.elt-barometer-bar { grid-template-columns: 1fr; gap: 4px; }
	.elt-barometer-bar__value { text-align: left; }
}

/* -------- Topical video (privacy-first click-to-load) ------- */
.elt-video {
	max-width: var(--container-prose);
	margin: var(--s-10) auto;
	padding: 0;
}
.elt-video__shell {
	display: block;
	width: 100%;
	aspect-ratio: 16/9;
	position: relative;
	border-radius: var(--r-md);
	overflow: hidden;
	cursor: pointer;
	border: 1px solid var(--edge);
	box-shadow: var(--shadow-2);
	background: var(--glass-3);
	padding: 0;
	transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}
.elt-video__shell:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-3);
}
.elt-video__thumb {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
}
.elt-video__overlay {
	position: absolute; inset: 0;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: 12px;
	background: linear-gradient(180deg, transparent 40%, rgba(11, 11, 18, 0.55));
	color: white;
}
.elt-video__play {
	width: 76px; height: 76px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: var(--accent);
	display: grid; place-items: center;
	box-shadow: 0 12px 30px -6px rgba(0, 0, 0, 0.45);
	transition: transform 0.2s var(--ease);
}
.elt-video__shell:hover .elt-video__play { transform: scale(1.06); }
.elt-video__play svg { width: 36px; height: 36px; margin-left: 4px; }
.elt-video__hint {
	font-family: var(--font-ui);
	font-size: 12.5px;
	font-weight: 500;
	letter-spacing: 0.04em;
	color: white;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45);
}
.elt-video__caption {
	margin-top: var(--s-3);
	font-family: var(--font-ui);
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.elt-video__eyebrow { margin: 0; }
.elt-video__title {
	font-size: 15px;
	font-weight: 600;
	color: var(--ink);
	letter-spacing: -0.008em;
}
.elt-video__meta {
	font-size: 12.5px;
	color: var(--ink-muted);
}
.elt-video iframe {
	width: 100%;
	aspect-ratio: 16/9;
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	box-shadow: var(--shadow-2);
}

/* -------- Audio narration ---------------------------------- */
.elt-audio {
	max-width: var(--container-prose);
	margin: 0 auto var(--s-8);
	padding: var(--s-4) var(--s-5);
	display: flex;
	align-items: center;
	gap: var(--s-4);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-pill);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	box-shadow: var(--shadow-1);
}
.elt-audio__play {
	flex: 0 0 48px;
	width: 48px; height: 48px;
	border-radius: 50%;
	background: var(--accent);
	color: white;
	display: grid; place-items: center;
	cursor: pointer;
	border: 0;
	transition: transform 0.15s var(--ease), background 0.15s var(--ease);
	box-shadow: 0 4px 14px -4px color-mix(in oklab, var(--accent) 60%, transparent);
}
.elt-audio__play:hover { transform: scale(1.05); background: color-mix(in oklab, var(--accent) 90%, black); }
.elt-audio__play svg { width: 22px; height: 22px; }
.elt-audio__icon-pause { display: none; }
.elt-audio.is-playing .elt-audio__icon-play { display: none; }
.elt-audio.is-playing .elt-audio__icon-pause { display: block; }
.elt-audio__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}
.elt-audio__eyebrow { margin: 0; padding: 4px 10px 4px 8px; }
.elt-audio__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--font-ui);
	font-size: 12.5px;
	color: var(--ink-muted);
	font-variant-numeric: tabular-nums;
}
.elt-audio__progress {
	flex: 1;
	height: 6px;
	background: var(--glass-3);
	border-radius: var(--r-pill);
	overflow: hidden;
}
.elt-audio__progress-bar {
	display: block;
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, var(--aurora-2), var(--aurora-1) 60%, var(--aurora-4));
	border-radius: inherit;
	transition: width 0.1s linear;
}
.elt-audio__time-sep { color: var(--ink-muted); }
.elt-audio audio { display: none; }

/* -------- Inline charts (SVG) ------------------------------ */
.elt-chart {
	max-width: var(--container-prose);
	margin: var(--s-10) auto;
	padding: var(--s-6);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	box-shadow: var(--shadow-1);
}
.elt-chart__title {
	font-family: var(--font-ui);
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: -0.008em;
	color: var(--ink);
	margin: 0 0 var(--s-4);
}
.elt-chart__canvas {
	width: 100%;
	overflow: visible;
}
.elt-chart__canvas svg {
	width: 100%;
	height: auto;
	display: block;
}
.elt-chart__source {
	display: block;
	margin-top: var(--s-3);
	font-family: var(--font-ui);
	font-size: 12px;
	color: var(--ink-muted);
}
.elt-chart__fallback {
	display: none; /* visible only via screen readers / print */
}
@media print {
	.elt-chart__fallback {
		display: table;
		width: 100%;
		margin-top: 12px;
		border-collapse: collapse;
	}
	.elt-chart__fallback th,
	.elt-chart__fallback td {
		padding: 6px;
		border-bottom: 1px solid #ddd;
		text-align: left;
	}
	.elt-chart__canvas { display: none; }
}

/* -------- Mini-poll [elt_pulse] ----------------------------- */
.elt-pulse {
	max-width: var(--container-prose);
	margin: var(--s-10) auto;
	padding: var(--s-6) var(--s-8);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	box-shadow: var(--shadow-1);
}
.elt-pulse__head { margin-bottom: var(--s-4); }
.elt-pulse__question {
	font-family: var(--font-ui);
	font-size: 1.125rem;
	font-weight: 600;
	letter-spacing: -0.012em;
	color: var(--ink);
	margin: var(--s-2) 0 0;
}
.elt-pulse__form {
	display: grid;
	gap: 8px;
}
.elt-pulse__option {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	background: var(--glass-2);
	border: 1px solid var(--edge);
	border-radius: var(--r-sm);
	font-family: var(--font-ui);
	font-size: 14.5px;
	color: var(--ink);
	cursor: pointer;
	transition: background 0.18s var(--ease), border-color 0.18s var(--ease);
}
.elt-pulse__option:hover { background: var(--glass-3); }
.elt-pulse__option:has(input:checked) {
	background: color-mix(in oklab, var(--accent) 14%, var(--glass-2));
	border-color: color-mix(in oklab, var(--accent) 50%, var(--edge));
}
.elt-pulse__option input { accent-color: var(--accent); }
.elt-pulse__form button { margin-top: 6px; justify-self: flex-start; }

.elt-pulse__results { display: none; flex-direction: column; gap: 10px; }
.elt-pulse.is-voted .elt-pulse__form { display: none; }
.elt-pulse.is-voted .elt-pulse__results { display: flex; }
.elt-pulse__bar {
	display: grid;
	grid-template-columns: 1fr 2fr 50px;
	align-items: center;
	gap: 12px;
	font-family: var(--font-ui);
	font-size: 13.5px;
}
.elt-pulse__bar-label { color: var(--ink-2); }
.elt-pulse__bar-track {
	height: 10px;
	background: var(--glass-3);
	border-radius: var(--r-pill);
	overflow: hidden;
}
.elt-pulse__bar-fill {
	height: 100%;
	background: linear-gradient(90deg, var(--aurora-2), var(--aurora-1) 60%, var(--aurora-4));
	border-radius: inherit;
	width: 0;
	transition: width 0.6s var(--ease-out);
}
.elt-pulse__bar-value {
	color: var(--ink);
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	text-align: right;
}
.elt-pulse__total {
	font-size: 12.5px;
	color: var(--ink-muted);
	margin: 4px 0 0;
}

/* -------- Image gallery (wp-block-gallery polish) ------------ */
.elt-prose .wp-block-gallery {
	max-width: var(--container);
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 0 var(--s-6);
}
.elt-prose .wp-block-gallery .wp-block-image img {
	border-radius: var(--r-sm);
	border: 1px solid var(--edge);
	box-shadow: var(--shadow-1);
	transition: transform 0.4s var(--ease-out), box-shadow 0.25s var(--ease-out);
}
.elt-prose .wp-block-gallery .wp-block-image:hover img {
	transform: translateY(-2px);
	box-shadow: var(--shadow-2);
}
.elt-prose .wp-block-gallery figcaption {
	font-family: var(--font-ui);
	font-size: 12.5px;
	color: var(--ink-muted);
	text-align: center;
	margin-top: 6px;
}

/* -------- Quote share buttons ------------------------------- */
.elt-prose blockquote { position: relative; }
.elt-quote-share {
	display: inline-flex;
	gap: 6px;
	margin-top: 10px;
	font-family: var(--font-ui);
}
.elt-quote-share button {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: var(--r-pill);
	background: var(--glass-2);
	border: 1px solid var(--edge);
	color: var(--ink-2);
	font-size: 12.5px;
	font-weight: 500;
	letter-spacing: -0.005em;
	cursor: pointer;
	transition: background 0.18s var(--ease), color 0.18s var(--ease);
}
.elt-quote-share button:hover { background: var(--glass-3); color: var(--accent); }
.elt-quote-share button svg { width: 14px; height: 14px; }
.elt-quote-share button.is-copied { color: var(--success); }

/* -------- AI transparency disclosure ----------------------- */
.elt-ai-disclosure {
	max-width: var(--container-prose);
	margin: var(--s-10) auto 0;
	padding: var(--s-5) var(--s-6);
	display: flex;
	gap: var(--s-4);
	align-items: flex-start;
	background:
		radial-gradient(120% 120% at 0% 0%, color-mix(in oklab, var(--accent) 14%, transparent), transparent 60%),
		var(--glass-2);
	border: 1px solid color-mix(in oklab, var(--accent) 30%, var(--edge));
	border-radius: var(--r-md);
	backdrop-filter: var(--blur-2);
	-webkit-backdrop-filter: var(--blur-2);
	position: relative;
	overflow: hidden;
}
.elt-ai-disclosure::before {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 32%);
	pointer-events: none;
}
.elt-ai-disclosure > * { position: relative; z-index: 1; }

.elt-ai-disclosure__icon {
	flex: 0 0 44px;
	width: 44px; height: 44px;
	border-radius: 12px;
	background:
		radial-gradient(120% 100% at 0% 0%, color-mix(in oklab, var(--aurora-2) 50%, transparent), transparent 55%),
		var(--accent);
	color: white;
	display: grid; place-items: center;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset, 0 8px 22px -8px color-mix(in oklab, var(--accent) 60%, transparent);
}
.elt-ai-disclosure__icon svg { width: 22px; height: 22px; }

.elt-ai-disclosure__body {
	flex: 1;
	min-width: 0;
}
.elt-ai-disclosure__title {
	font-family: var(--font-ui);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--accent);
	margin: 0 0 6px;
}
.elt-ai-disclosure__text {
	font-family: var(--font-ui);
	font-size: 14px;
	line-height: 1.55;
	color: var(--ink-2);
	margin: 0;
	letter-spacing: -0.005em;
}
.elt-ai-disclosure__text strong { color: var(--ink); font-weight: 600; }
.elt-ai-disclosure__links {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
	margin: var(--s-3) 0 0;
	font-family: var(--font-ui);
	font-size: 13px;
}
.elt-ai-disclosure__links a {
	color: var(--accent);
	border-bottom: 1px solid currentColor;
	padding-bottom: 1px;
}
.elt-ai-disclosure__links a:hover { color: var(--accent-2); }
.elt-ai-disclosure__links span { color: var(--ink-muted); }

@media (max-width: 560px) {
	.elt-ai-disclosure { padding: var(--s-4); gap: var(--s-3); flex-direction: column; }
	.elt-ai-disclosure__icon { flex-basis: 36px; width: 36px; height: 36px; }
}

/* "KI-bearbeitet" inline badge for the meta line */
.elt-ai-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 8px 2px 6px;
	border-radius: var(--r-pill);
	background: color-mix(in oklab, var(--accent) 12%, var(--glass-2));
	color: var(--accent);
	font-family: var(--font-ui);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border: 1px solid color-mix(in oklab, var(--accent) 30%, var(--edge));
	white-space: nowrap;
}
.elt-ai-badge svg { flex: 0 0 11px; }

/* -------- Mobile polish (components) ----------------------- */
@media (max-width: 720px) {
	.elt-pillar { padding: var(--s-6); gap: var(--s-4); }
	.elt-pull { padding: var(--s-8) var(--s-5); }
	.elt-pull__text { font-size: clamp(1.25rem, 5vw, 1.75rem); }
	.elt-teaser { padding: var(--s-6); }
	.elt-teaser__title { font-size: 1.5rem; }

	.elt-toc { padding: var(--s-5) var(--s-5); }

	.elt-author-bio { padding: var(--s-6); gap: var(--s-4); }
	.elt-author-bio__name { font-size: 1.5rem; }

	.elt-prevnext { gap: 12px; }
	.elt-prevnext__link { padding: var(--s-4) var(--s-5); }

	.elt-study-filters {
		width: 100%;
		justify-content: flex-start;
		overflow-x: auto;
		flex-wrap: nowrap;
		padding: 6px;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.elt-study-filters::-webkit-scrollbar { display: none; }
	.elt-study-filters a { white-space: nowrap; flex: 0 0 auto; }

	.elt-study-meta { padding: var(--s-4) var(--s-5); gap: var(--s-3); }
	.elt-tool-facts { padding: var(--s-4) var(--s-5); }
	.elt-tool-compliance-grid { padding: var(--s-4) var(--s-5); }
}

/* ============================================================
   Article hero — photo credit line
   ============================================================ */
.elt-article__hero-credit {
	display: block;
	margin-top: 8px;
	padding: 0 2px;
	font-family: var(--font-ui);
	font-size: 11.5px;
	line-height: 1.4;
	color: var(--ink-muted);
	text-align: right;
}
.elt-article__hero-credit a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.elt-article__hero-credit a:hover {
	color: var(--ink);
}

/* -------- Print styles ------------------------------------- */
@media print {
	body::before, body::after, .elt-cursor-glow, .elt-header, .elt-footer,
	.elt-progress, .elt-top, .elt-cookie, .elt-share, .elt-nav, .elt-breadcrumbs,
	.elt-toc, .elt-source, .elt-ad-block, .elt-cta, .elt-prevnext {
		display: none !important;
	}
	body { background: white; color: black; }
	.elt-article__title, .elt-prose h2, .elt-prose h3 { color: black; }
	.elt-prose { font-size: 11pt; line-height: 1.55; color: black; }
	.elt-article__hero img { border-radius: 0; box-shadow: none; }
	a[rel~="sponsored"]::after { display: none; }
}