/* 4EVA Extender - Industry Showcase. Colours use the kit's global variables, with fallbacks. */
.eva-industry {
	--eva-lime: var(--brand-lime, #BFDE47);
	--eva-ink: var(--brand-ink, #1A1A1A);
	--eva-muted: #6B7178;
	--eva-line: #EEF2E2;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 28px;
	align-items: center;
	font-family: var(--font-primary, Poppins), sans-serif;
}

.eva-industry .eva-industry__list { border-top: 1px solid var(--eva-line); }
.eva-industry .eva-industry__item { border-bottom: 1px solid var(--eva-line); }

.eva-industry .eva-industry__tab,
.eva-industry .eva-industry__tab:hover,
.eva-industry .eva-industry__tab:focus,
.eva-industry .eva-industry__tab:active {
	all: unset;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	color: inherit;
	box-sizing: border-box;
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 0;
	cursor: pointer;
}
.eva-industry .eva-industry__tab:focus-visible { outline: 2px solid var(--eva-lime); outline-offset: 2px; }

.eva-industry .eva-industry__title {
	font-size: 18px;
	line-height: 26px;
	font-weight: 500;
	color: var(--eva-muted);
	transition: color .25s ease;
}
.eva-industry .eva-industry__item.is-active .eva-industry__title,
.eva-industry .eva-industry__tab:hover .eva-industry__title { color: var(--eva-ink); font-weight: 600; }

.eva-industry .eva-industry__arrow {
	display: grid;
	place-items: center;
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #F2F8DA;
	color: var(--eva-lime);
	opacity: 0;
	transform: translateX(-6px);
	transition: opacity .25s ease, transform .25s ease;
}
.eva-industry .eva-industry__arrow svg { width: 14px; height: 14px; }
.eva-industry .eva-industry__item.is-active .eva-industry__arrow { opacity: 1; transform: none; }

.eva-industry .eva-industry__desc {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .35s ease;
}
.eva-industry .eva-industry__desc > div { overflow: hidden; }
.eva-industry .eva-industry__item.is-active .eva-industry__desc { grid-template-rows: 1fr; }
.eva-industry .eva-industry__desc p {
	margin: 0 0 20px;
	max-width: 44ch;
	font-size: 15px;
	line-height: 1.6;
	color: var(--eva-ink);
}
.eva-industry .eva-industry__thumb,
.eva-industry .eva-industry__mobile-link { display: none; }

.eva-industry .eva-industry__media {
	position: relative;
	aspect-ratio: 4 / 3;
	border-radius: 12px;
	overflow: hidden;
	background: var(--eva-ink);
}
.eva-industry .eva-industry__card {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity .45s ease, visibility 0s linear .45s;
}
.eva-industry .eva-industry__card.is-active {
	opacity: 1;
	visibility: visible;
	transition: opacity .45s ease;
}
.eva-industry .eva-industry__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.eva-industry .eva-industry__overlay {
	position: absolute;
	inset: auto 0 0 0;
	padding: 120px 28px 28px;
	background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .65) 100%);
	color: #fff;
}
.eva-industry .eva-industry__eyebrow {
	display: block;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: .02em;
	margin-bottom: 6px;
}
.eva-industry .eva-industry__card-title {
	margin: 0 0 14px;
	font-weight: 600;
	color: #fff;
}
.eva-industry .eva-industry__link,
.eva-industry .eva-industry__link:hover,
.eva-industry .eva-industry__link:focus,
.eva-industry .eva-industry__link:visited {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-weight: 600;
	color: var(--eva-lime);
	text-decoration: none;
}
.eva-industry .eva-industry__link svg { width: 20px; height: 20px; transition: transform .25s ease; }
.eva-industry .eva-industry__link:hover svg,
.eva-industry .eva-industry__link:focus-visible svg { transform: translateX(4px); }
.eva-industry .eva-industry__link:focus-visible { outline: 2px solid var(--eva-lime); outline-offset: 3px; }

@media (max-width: 1024px) {
	.eva-industry { grid-template-columns: 1fr; }
	.eva-industry .eva-industry__media { display: none; }
	.eva-industry .eva-industry__thumb {
		display: block;
		width: 100%;
		aspect-ratio: 16 / 10;
		object-fit: cover;
		border-radius: 10px;
		margin-bottom: 20px;
	}
	.eva-industry .eva-industry__title { font-size: 16px; line-height: 24px; }
	.eva-industry .eva-industry__mobile-link { display: block; margin-bottom: 20px; }
	.eva-industry .eva-industry__mobile-link .eva-industry__link { color: var(--eva-ink); }
	.eva-industry .eva-industry__mobile-link .eva-industry__link svg { color: var(--eva-lime); }
}

@media (prefers-reduced-motion: reduce) {
	.eva-industry *, .eva-industry__card { transition: none !important; }
}