/* Trusted Elements — Building Blocks */

.te-root.te-bb {
	--te-cols: 3;
	--te-zoom: 1.06;
	--te-title-gap: 10px;
	--te-desc-gap: 18px;
}

/* ===================================================================== */
/* Shared pieces                                                          */
/* ===================================================================== */

.te-root .te-bb__media {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	background: var(--te-dark);
}

.te-root .te-bb__img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	object-fit: cover;
	transform: scale(1.001);
	transition: transform 1.1s var(--te-ease-out), filter 0.6s var(--te-ease);
}

.te-root .te-bb__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	transition: background-color 0.5s var(--te-ease), opacity 0.5s var(--te-ease);
}

.te-root .te-bb__overlay::after {
	content: "";
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity 0.5s var(--te-ease);
}

.te-root .te-bb__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 16px;
}

.te-root .te-bb__meta:empty {
	display: none;
}

/* Number */
.te-root .te-bb__num {
	--te-num-size: 34px;
	--te-num-bg: var(--te-dark);
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	min-width: var(--te-num-size);
	height: var(--te-num-size);
	padding: 0 0.6em;
	border: 1.5px solid transparent;
	border-radius: 8px;
	background-color: var(--te-num-bg);
	color: #FFFFFF;
	font-family: var(--te-font-heading);
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.06em;
	font-variant-numeric: tabular-nums;
	transition: background-color 0.35s var(--te-ease), color 0.35s var(--te-ease), border-color 0.35s var(--te-ease);
}

.te-root .te-on-dark .te-bb__num {
	--te-num-bg: var(--te-accent);
}

.te-root.te-num--outline .te-bb__num {
	background-color: transparent;
	border-color: var(--te-num-bg);
	color: var(--te-num-bg);
}

.te-root.te-num--outline .te-on-dark .te-bb__num {
	border-color: rgba(255, 255, 255, 0.6);
	color: #FFFFFF;
}

.te-root.te-num--text .te-bb__num {
	min-width: 0;
	height: auto;
	padding: 0;
	border: 0;
	background-color: transparent;
	color: var(--te-accent);
	font-size: 13px;
	letter-spacing: 0.16em;
}

/* Icon */
.te-root .te-bb__icon {
	--te-icon-size: 18px;
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: calc(var(--te-icon-size) * 2.1);
	height: calc(var(--te-icon-size) * 2.1);
	border-radius: 10px;
	background-color: rgba(255, 255, 255, 0.14);
	color: var(--te-accent);
	fill: var(--te-accent);
	font-size: var(--te-icon-size);
	line-height: 1;
}

.te-root .te-on-light .te-bb__icon {
	background-color: rgba(233, 100, 43, 0.1);
	background-color: color-mix(in srgb, var(--te-accent) 12%, transparent);
}

.te-root .te-bb__icon svg,
.te-root .te-bb__icon i {
	width: 1em;
	height: 1em;
	font-size: 1em;
	fill: currentColor;
}

/* Title & text */
.te-root .te-bb__title {
	margin: 0 0 var(--te-title-gap);
	padding: 0;
	font-family: var(--te-font-heading);
	font-size: var(--te-fs-h3);
	font-weight: var(--te-fw-heading);
	line-height: 1.25;
	letter-spacing: -0.01em;
	text-transform: none;
}

.te-root .te-on-light .te-bb__title {
	color: var(--te-heading);
}

.te-root .te-on-dark .te-bb__title {
	color: var(--te-on-dark);
}

.te-root .te-bb__desc {
	margin: 0 0 var(--te-desc-gap);
	font-size: 15.5px;
	line-height: 1.65;
}

.te-root .te-on-light .te-bb__desc {
	color: var(--te-text);
}

.te-root .te-on-dark .te-bb__desc {
	color: var(--te-on-dark-soft);
}

.te-root .te-bb__desc:last-child {
	margin-bottom: 0;
}

/* Highlights */
.te-root .te-bb__highlights {
	margin: 0 0 22px;
}

.te-root .te-bb__highlights:last-child {
	margin-bottom: 0;
}

.te-root .te-bb__list-label {
	display: block;
	margin-bottom: 10px;
	font-family: var(--te-font-heading);
	font-size: 11.5px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--te-accent);
}

.te-root .te-bb__list {
	--te-marker: var(--te-accent);
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.te-root .te-bb__list li {
	position: relative;
	margin: 0;
	padding: 0 0 0 26px;
	font-size: 14.5px;
	line-height: 1.45;
	list-style: none;
}

.te-root .te-bb__list li::before {
	content: "";
	position: absolute;
	top: 0.18em;
	left: 0;
	width: 16px;
	height: 16px;
	margin: 0;
	border: 0;
	border-radius: 0;
	background-color: var(--te-marker);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12.5l5 5L19.5 7'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12.5l5 5L19.5 7'/%3E%3C/svg%3E") center / contain no-repeat;
}

.te-root .te-on-light .te-bb__list li {
	color: var(--te-heading);
}

.te-root .te-on-dark .te-bb__list li {
	color: var(--te-on-dark);
}

.te-root .te-bb__list--chips {
	display: flex;
	flex-wrap: wrap;
}

.te-root .te-bb__list--chips li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 12px;
	border: 1px solid rgba(255, 255, 255, 0.24);
	border-radius: 999px;
	background-color: rgba(255, 255, 255, 0.12);
	font-size: 13px;
	line-height: 1.3;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}

.te-root .te-on-light .te-bb__list--chips li {
	border-color: var(--te-border);
	background-color: var(--te-muted);
}

.te-root .te-bb__list--chips li::before {
	position: static;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	-webkit-mask: none;
	mask: none;
}

.te-root .te-bb__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

/* ===================================================================== */
/* Layout 1 — Explorer                                                    */
/* ===================================================================== */

.te-bb-explorer {
	--te-ex-nav-w: 34%;
	--te-ex-gap: 28px;
	--te-ex-h: 580px;
	--te-ex-cols: minmax(0, var(--te-ex-nav-w)) minmax(0, 1fr);
	--te-ex-areas: "nav stage";
	--te-ex-nav-dir: column;
	--te-ex-nav-overflow: visible;
	--te-ex-tab-w: 100%;
	--te-ex-tab-arrow: inline-flex;
	--te-ex-tab-ws: normal;
	--te-ex-tab-pad: 18px 20px;
	--te-ex-tab-flex: 1 1 0;
	display: grid;
	grid-template-columns: var(--te-ex-cols);
	grid-template-areas: var(--te-ex-areas);
	gap: var(--te-ex-gap);
	align-items: stretch;
}

.te-root .te-bb-explorer__nav {
	position: relative;
	grid-area: nav;
	display: flex;
	flex-direction: var(--te-ex-nav-dir);
	gap: 10px;
	min-width: 0;
	margin: -4px;
	padding: 4px;
	overflow-x: var(--te-ex-nav-overflow);
	scroll-snap-type: x proximity;
	scroll-padding-inline: 4px;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.te-root .te-bb-explorer__nav::-webkit-scrollbar {
	display: none;
}

.te-root .te-bb-explorer__tab {
	--_c: var(--te-heading);
	--_bg: var(--te-surface);
	--_bc: var(--te-border);
	position: relative;
	display: flex;
	flex: var(--te-ex-tab-flex);
	align-items: center;
	gap: 14px;
	width: var(--te-ex-tab-w);
	padding: var(--te-ex-tab-pad);
	border-width: 1px;
	border-style: solid;
	border-radius: 12px;
	overflow: hidden;
	text-align: left;
	white-space: var(--te-ex-tab-ws);
	scroll-snap-align: start;
	isolation: isolate;
	transition: color 0.35s var(--te-ease), background-color 0.35s var(--te-ease), border-color 0.35s var(--te-ease), box-shadow 0.35s var(--te-ease);
}

.te-root .te-bb-explorer__tab:hover {
	--_bc: var(--te-accent);
}

.te-root .te-bb-explorer__tab.is-active {
	--_c: #FFFFFF;
	--_bg: var(--te-dark);
	--_bc: var(--te-dark);
	--_sh: 0 16px 32px -18px rgba(11, 19, 38, 0.6);
}

.te-root .te-bb-explorer__tab .te-bb__num {
	--te-num-bg: var(--te-muted);
	color: var(--te-heading);
}

.te-root.te-num--outline .te-bb-explorer__tab .te-bb__num {
	--te-num-bg: var(--te-border);
	color: var(--te-heading);
}

.te-root .te-bb-explorer__tab.is-active > .te-bb__num {
	--te-num-bg: var(--te-accent);
	color: #FFFFFF;
}

.te-root.te-num--outline .te-bb-explorer__tab.is-active > .te-bb__num {
	color: #FFFFFF;
}

.te-root.te-num--text .te-bb-explorer__tab .te-bb__num {
	color: var(--te-accent);
}

.te-root .te-bb-explorer__tab-label {
	flex: 1 1 auto;
	min-width: 0;
	font-family: var(--te-font-heading);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.005em;
}

.te-root .te-bb-explorer__tab-arrow {
	display: var(--te-ex-tab-arrow);
	flex: none;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	opacity: 0.3;
	transform: translateX(-4px);
	transition: transform 0.45s var(--te-ease-out), opacity 0.35s var(--te-ease), background-color 0.35s var(--te-ease);
}

.te-root .te-bb-explorer__tab-arrow .te-ico {
	width: 18px;
	height: 18px;
}

.te-root .te-bb-explorer__tab:hover .te-bb-explorer__tab-arrow {
	opacity: 0.75;
	transform: none;
}

.te-root .te-bb-explorer__tab.is-active .te-bb-explorer__tab-arrow {
	opacity: 1;
	transform: none;
	background-color: var(--te-accent);
	color: #FFFFFF;
}

.te-root .te-bb-explorer__thumb {
	position: relative;
	flex: none;
	width: 46px;
	height: 46px;
	overflow: hidden;
	border-radius: 10px;
	background: var(--te-muted);
}

.te-root .te-bb-explorer__thumb img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}

/* Autoplay progress */
.te-root .te-bb-explorer__progress {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 3px;
	color: var(--te-accent);
	opacity: 0;
	pointer-events: none;
}

.te-root .te-bb-explorer__progress > span {
	display: block;
	height: 100%;
	background-color: currentColor;
	transform: scaleX(0);
	transform-origin: left center;
}

.te-root.is-autoplay .te-bb-explorer__tab.is-active .te-bb-explorer__progress {
	opacity: 1;
}

.te-root.is-autoplay .te-bb-explorer__tab.is-active .te-bb-explorer__progress > span {
	animation: te-progress var(--te-autoplay, 6000ms) linear forwards;
}

.te-root.is-autoplay.is-paused .te-bb-explorer__progress > span {
	animation-play-state: paused;
}

@keyframes te-progress {
	to {
		transform: scaleX(1);
	}
}

/* Stage */
.te-root .te-bb-explorer__stage {
	grid-area: stage;
	position: relative;
	display: grid;
	min-width: 0;
	min-height: var(--te-ex-h);
	border-radius: var(--te-radius);
	overflow: hidden;
	isolation: isolate;
	background: var(--te-dark);
	box-shadow: var(--te-shadow-lg);
}

.te-root .te-bb-explorer__panel {
	grid-area: 1 / 1;
	position: relative;
	display: flex;
	align-items: flex-end;
	min-width: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.7s var(--te-ease), visibility 0s linear 0.7s;
}

.te-root .te-bb-explorer__panel.is-active {
	z-index: 1;
	opacity: 1;
	visibility: visible;
	transition: opacity 0.7s var(--te-ease), visibility 0s;
}

.te-root .te-bb-explorer__panel .te-bb__img {
	transform: scale(1.08);
	transition: transform 1.8s var(--te-ease-out), filter 0.6s var(--te-ease);
}

.te-root .te-bb-explorer__panel.is-active .te-bb__img {
	transform: scale(1);
}

.te-root .te-bb-explorer__stage:hover .te-bb-explorer__panel.is-active .te-bb__img {
	transform: scale(var(--te-zoom));
}

.te-root .te-bb-explorer--overlay .te-bb-explorer__content::before {
	content: "";
	position: absolute;
	top: -60%;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	pointer-events: none;
	background-image: linear-gradient(180deg, rgba(11, 19, 38, 0) 0%, rgba(11, 19, 38, 0.55) 45%, rgba(11, 19, 38, 0.88) 100%);
}

.te-root .te-bb-explorer__content {
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: flex-start;
	width: 100%;
	padding: 28px;
}

.te-root .te-bb-explorer__card {
	--te-accent-bar: 3px;
	position: relative;
	width: 100%;
	max-width: 500px;
}

.te-root .te-bb-explorer--card .te-bb-explorer__card {
	padding: 30px 32px;
	border-top: var(--te-accent-bar) solid var(--te-accent);
	border-radius: max(0px, calc(var(--te-radius) - 4px));
	background-color: var(--te-surface);
	box-shadow: 0 30px 60px -28px rgba(11, 19, 38, 0.55);
}

.te-root .te-bb-explorer--overlay .te-bb-explorer__card {
	max-width: 640px;
	padding: 8px 6px;
}

.te-root .te-bb-explorer--overlay .te-bb__title {
	font-size: 30px;
}

.te-root .te-bb-explorer__card > * {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.5s var(--te-ease), transform 0.65s var(--te-ease-out);
}

.te-root .te-bb-explorer__panel.is-active .te-bb-explorer__card > * {
	opacity: 1;
	transform: none;
}

.te-root .te-bb-explorer__panel.is-active .te-bb-explorer__card > :nth-child(1) { transition-delay: 0.12s; }
.te-root .te-bb-explorer__panel.is-active .te-bb-explorer__card > :nth-child(2) { transition-delay: 0.18s; }
.te-root .te-bb-explorer__panel.is-active .te-bb-explorer__card > :nth-child(3) { transition-delay: 0.24s; }
.te-root .te-bb-explorer__panel.is-active .te-bb-explorer__card > :nth-child(4) { transition-delay: 0.3s; }
.te-root .te-bb-explorer__panel.is-active .te-bb-explorer__card > :nth-child(5) { transition-delay: 0.36s; }
.te-root .te-bb-explorer__panel.is-active .te-bb-explorer__card > :nth-child(n+6) { transition-delay: 0.42s; }

@media (max-width: 767px) {
	.te-root .te-bb-explorer__content {
		padding: 14px;
	}

	.te-root .te-bb-explorer--card .te-bb-explorer__card {
		padding: 22px 20px;
	}

	.te-root .te-bb-explorer--overlay .te-bb__title {
		font-size: 24px;
	}

	/* Only the open block takes space, so short blocks leave no gap. */
	.te-root .te-bb-explorer__panel:not(.is-active) {
		display: none;
	}

	.te-root .te-bb-explorer__panel.is-active {
		animation: te-fade-in 0.5s var(--te-ease);
	}

	/* Card style: image on top, card below it (overlapping slightly). */
	.te-root .te-bb-explorer--card .te-bb-explorer__stage {
		min-height: 0;
		overflow: visible;
		background: transparent;
		box-shadow: none;
	}

	.te-root .te-bb-explorer--card .te-bb-explorer__panel {
		flex-direction: column;
		align-items: stretch;
	}

	.te-root .te-bb-explorer--card .te-bb-explorer__panel .te-bb__media {
		position: relative;
		inset: auto;
		aspect-ratio: 16 / 11;
		border-radius: var(--te-radius);
	}

	.te-root .te-bb-explorer--card .te-bb-explorer__panel > .te-bb__overlay {
		display: none;
	}

	.te-root .te-bb-explorer--card .te-bb-explorer__content {
		margin-top: -36px;
		padding: 0 10px;
	}

	.te-root .te-bb-explorer--card .te-bb-explorer__card {
		box-shadow: 0 20px 40px -24px rgba(11, 19, 38, 0.45);
	}
}

@keyframes te-fade-in {
	from {
		opacity: 0;
	}
}

/* ===================================================================== */
/* Layout 2 — Expanding panels                                            */
/* ===================================================================== */

.te-bb-panels {
	--te-pn-h: 560px;
	--te-pn-grow: 4.5;
	--te-pn-gap: 12px;
	--te-pn-collapsed: 84px;
	--te-pn-open: 440px;
	--te-pn-dim: 0.62;
	--te-pn-dir: row;
	--te-pn-height-eff: var(--te-pn-h);
	--te-pn-flex: 1 1 0%;
	--te-pn-active-flex: var(--te-pn-grow) 1 0%;
	--te-pn-label-mode: vertical-rl;
	--te-pn-label-rotate: rotate(180deg);
	--te-pn-label-ws: nowrap;
	--te-pn-trigger-dir: column;
	--te-pn-trigger-align: flex-start;
	--te-pn-trigger-justify: space-between;
	--te-pn-content-min: 380px;
	display: flex;
	flex-direction: var(--te-pn-dir);
	gap: var(--te-pn-gap);
	height: var(--te-pn-height-eff);
}

.te-root .te-bb-panel {
	position: relative;
	flex: var(--te-pn-flex);
	min-width: 0;
	min-height: 0;
	overflow: hidden;
	border-radius: var(--te-radius);
	isolation: isolate;
	background: var(--te-dark);
	transition: flex 0.8s var(--te-ease-out), box-shadow 0.5s var(--te-ease);
}

.te-root .te-bb-panel.is-active {
	flex: var(--te-pn-active-flex);
	box-shadow: var(--te-shadow-lg);
}

.te-root .te-bb-panel:not(.is-active) .te-bb__img {
	filter: brightness(var(--te-pn-dim)) saturate(0.9);
}

.te-root .te-bb-panel:not(.is-active):hover .te-bb__img {
	filter: brightness(calc(var(--te-pn-dim) + 0.15)) saturate(1);
}

.te-root .te-bb-panel.is-active .te-bb__img {
	transform: scale(var(--te-zoom));
	transition-duration: 2.4s;
}

.te-root .te-bb-panel__trigger {
	--_c: #FFFFFF;
	--_bg: transparent;
	--_bc: transparent;
	position: absolute;
	inset: 0;
	z-index: 3;
	display: flex;
	flex-direction: var(--te-pn-trigger-dir);
	align-items: var(--te-pn-trigger-align);
	justify-content: var(--te-pn-trigger-justify);
	gap: 14px;
	width: 100%;
	height: 100%;
	padding: 22px 20px;
	text-align: left;
	transition: opacity 0.35s var(--te-ease);
}

.te-root .te-bb-panel__label {
	writing-mode: var(--te-pn-label-mode);
	transform: var(--te-pn-label-rotate);
	font-family: var(--te-font-heading);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -0.005em;
	white-space: var(--te-pn-label-ws);
	color: #FFFFFF;
	text-shadow: 0 1px 14px rgba(0, 0, 0, 0.35);
}

.te-root .te-bb-panel.is-active .te-bb-panel__trigger {
	opacity: 0;
	pointer-events: none;
}

.te-root .te-bb-panel:has(> .te-bb-panel__trigger:focus-visible) {
	outline: 2px solid var(--te-accent);
	outline-offset: 3px;
}

.te-root .te-bb-panel__trigger:focus-visible {
	outline: none;
}

.te-root .te-bb-panel__content {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	padding: 34px;
	pointer-events: none;
}

.te-root .te-bb-panel__content::before {
	content: "";
	position: absolute;
	top: -45%;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	pointer-events: none;
	background-image: linear-gradient(180deg, rgba(11, 19, 38, 0) 0%, rgba(11, 19, 38, 0.55) 40%, rgba(11, 19, 38, 0.82) 100%);
	opacity: 0;
	transition: opacity 0.5s var(--te-ease);
}

.te-root .te-bb-panel.is-active .te-bb-panel__content::before {
	opacity: var(--te-pn-scrim, 1);
}

.te-root .te-bb-panel__content-inner {
	min-width: var(--te-pn-content-min);
	max-width: 560px;
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.3s var(--te-ease), transform 0.5s var(--te-ease-out);
}

.te-root .te-bb-panel.is-active .te-bb-panel__content {
	pointer-events: auto;
}

.te-root .te-bb-panel.is-active .te-bb-panel__content-inner {
	opacity: 1;
	transform: none;
	transition-delay: 0.3s;
}

.te-root .te-bb-panel .te-bb__title {
	font-size: 28px;
}

@media (max-width: 767px) {
	.te-root .te-bb-panel__content {
		padding: 22px;
	}

	.te-root .te-bb-panel .te-bb__title {
		font-size: 22px;
	}
}

/* ===================================================================== */
/* Layout 3 — Flip cards                                                  */
/* ===================================================================== */

.te-bb-flip-grid {
	--te-gap: 24px;
	--te-card-h: 440px;
	--te-flip-speed: 750ms;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--te-gap);
}

.te-root .te-bb-flip {
	position: relative;
	flex: 0 0 calc((100% - (var(--te-cols) - 1) * var(--te-gap)) / var(--te-cols));
	min-width: 0;
	perspective: 1800px;
}

.te-root .te-bb-flip__inner {
	position: relative;
	display: grid;
	height: 100%;
	min-height: var(--te-card-h);
	transition: transform var(--te-flip-speed) var(--te-ease-out);
}

.te-root .te-bb-flip__face {
	grid-area: 1 / 1;
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	overflow: hidden;
	border-radius: var(--te-radius);
	isolation: isolate;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.te-root .te-bb-flip__front {
	box-shadow: var(--te-shadow);
}

.te-root .te-bb-flip__front .te-bb__media::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 34%;
	z-index: 1;
	pointer-events: none;
	background-image: linear-gradient(180deg, rgba(11, 19, 38, 0.38), rgba(11, 19, 38, 0));
}

.te-root .te-bb-flip:hover .te-bb__img {
	transform: scale(var(--te-zoom));
}

.te-root .te-bb-flip__front-content {
	position: relative;
	z-index: 2;
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	padding: 26px;
}

.te-root .te-bb-flip__front-main {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-start;
	gap: 12px;
}

.te-root .te-bb-flip__front .te-bb__title {
	margin: 0;
	font-size: 24px;
}

.te-root .te-bb-flip__front .te-bb__meta {
	margin-bottom: 0;
}

.te-root .te-bb-flip__hint {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--te-font-heading);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.86);
}

.te-root .te-bb-flip__hint .te-ico {
	width: 16px;
	height: 16px;
	color: var(--te-accent);
	transition: transform 0.4s var(--te-ease-out);
}

.te-root .te-bb-flip:hover .te-bb-flip__hint .te-ico {
	transform: translateX(4px);
}

.te-root .te-bb-flip__back {
	justify-content: center;
	align-items: stretch;
	padding: 36px 32px;
	background-color: var(--te-dark);
	box-shadow: var(--te-shadow-lg);
}

.te-root .te-bb-flip__back::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-image: radial-gradient(120% 90% at 100% 0%, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 55%), radial-gradient(90% 70% at 0% 100%, rgba(0, 0, 0, 0.28) 0%, rgba(0, 0, 0, 0) 60%);
}

.te-root .te-bb-flip__back::before {
	content: "";
	position: absolute;
	top: 0;
	left: 32px;
	width: 52px;
	height: 3px;
	border-radius: 0 0 3px 3px;
	background-color: var(--te-accent);
}

.te-root .te-bb-flip__back > .te-bb__meta {
	justify-content: var(--te-back-items, flex-start);
}

.te-root .te-bb-flip__back .te-bb__actions {
	justify-content: var(--te-back-items, flex-start);
}

/* Back image (per block): under the overlay, the sheen and the text. */
.te-root .te-bb-flip__back > .te-bb__media {
	z-index: -2;
}

.te-root .te-bb-flip__back-overlay {
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-color: rgba(11, 19, 38, 0.75);
	transition: background-color 0.5s var(--te-ease);
}

/*
 * Flip toggle: no icon. The mouse passes through it (clicks reach the card);
 * keyboard users see it only as a focus ring around the whole card.
 */
.te-root .te-bb-flip__toggle {
	--_bg: transparent;
	--_bc: transparent;
	position: absolute;
	inset: 0;
	z-index: 5;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: var(--te-radius);
	pointer-events: none;
}

/* Direction values */
.te-bb--dir-left { --te-flip-to: rotateY(-180deg); --te-slide-x: 100%; --te-slide-y: 0%; }
.te-bb--dir-right { --te-flip-to: rotateY(180deg); --te-slide-x: -100%; --te-slide-y: 0%; }
.te-bb--dir-up { --te-flip-to: rotateX(180deg); --te-slide-x: 0%; --te-slide-y: 100%; }
.te-bb--dir-down { --te-flip-to: rotateX(-180deg); --te-slide-x: 0%; --te-slide-y: -100%; }

/* 3D flip */
.te-root.te-bb--flip-flip .te-bb-flip__inner {
	transform-style: preserve-3d;
}

.te-root.te-bb--flip-flip .te-bb-flip__front {
	transform: translateZ(0.1px);
}

.te-root.te-bb--flip-flip .te-bb-flip__back {
	transform: rotateY(180deg) translateZ(0.1px);
}

.te-root.te-bb--flip-flip.te-bb--dir-up .te-bb-flip__back,
.te-root.te-bb--flip-flip.te-bb--dir-down .te-bb-flip__back {
	transform: rotateX(180deg) translateZ(0.1px);
}

.te-root.te-bb--flip-flip .te-bb-flip.is-flipped .te-bb-flip__inner {
	transform: var(--te-flip-to);
}

/* Slide over */
.te-root.te-bb--flip-slide .te-bb-flip__inner,
.te-root.te-bb--flip-fade .te-bb-flip__inner {
	overflow: hidden;
	border-radius: var(--te-radius);
}

.te-root.te-bb--flip-slide .te-bb-flip__back {
	transform: translate(var(--te-slide-x), var(--te-slide-y));
	transition: transform var(--te-flip-speed) var(--te-ease-out);
}

.te-root.te-bb--flip-slide .te-bb-flip__front {
	transition: transform var(--te-flip-speed) var(--te-ease-out);
}

.te-root.te-bb--flip-slide .te-bb-flip.is-flipped .te-bb-flip__back {
	transform: none;
}

.te-root.te-bb--flip-slide .te-bb-flip.is-flipped .te-bb-flip__front {
	transform: translate(calc(var(--te-slide-x) * -0.3), calc(var(--te-slide-y) * -0.3));
}

/* Fade & zoom */
.te-root.te-bb--flip-fade .te-bb-flip__back {
	opacity: 0;
	transform: scale(1.05);
	pointer-events: none;
	transition: opacity calc(var(--te-flip-speed) * 0.7) var(--te-ease), transform var(--te-flip-speed) var(--te-ease-out);
}

.te-root.te-bb--flip-fade .te-bb-flip.is-flipped .te-bb-flip__back {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}

/* Hover trigger (mouse devices only; keyboard focus flips too) */
@media (hover: hover) {
	.te-root.te-bb--flip-flip.te-bb--trigger-hover .te-bb-flip:hover .te-bb-flip__inner,
	.te-root.te-bb--flip-flip.te-bb--trigger-hover .te-bb-flip:has(:focus-visible) .te-bb-flip__inner {
		transform: var(--te-flip-to);
	}

	.te-root.te-bb--flip-slide.te-bb--trigger-hover .te-bb-flip:hover .te-bb-flip__back,
	.te-root.te-bb--flip-slide.te-bb--trigger-hover .te-bb-flip:has(:focus-visible) .te-bb-flip__back {
		transform: none;
	}

	.te-root.te-bb--flip-slide.te-bb--trigger-hover .te-bb-flip:hover .te-bb-flip__front,
	.te-root.te-bb--flip-slide.te-bb--trigger-hover .te-bb-flip:has(:focus-visible) .te-bb-flip__front {
		transform: translate(calc(var(--te-slide-x) * -0.3), calc(var(--te-slide-y) * -0.3));
	}

	.te-root.te-bb--flip-fade.te-bb--trigger-hover .te-bb-flip:hover .te-bb-flip__back,
	.te-root.te-bb--flip-fade.te-bb--trigger-hover .te-bb-flip:has(:focus-visible) .te-bb-flip__back {
		opacity: 1;
		transform: none;
		pointer-events: auto;
	}
}

.te-root.te-bb--trigger-click .te-bb-flip {
	cursor: pointer;
}

/* ===================================================================== */
/* Layout 4 — Bento grid                                                  */
/* ===================================================================== */

.te-bb-grid {
	--te-gap: 20px;
	--te-row-h: 300px;
	--te-clamp: 3;
	display: grid;
	grid-template-columns: repeat(var(--te-cols), minmax(0, 1fr));
	grid-auto-rows: var(--te-row-h);
	grid-auto-flow: dense;
	gap: var(--te-gap);
}

.te-root .te-bb-tile {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-width: 0;
	margin: 0;
	overflow: hidden;
	border-radius: var(--te-radius);
	isolation: isolate;
	background: var(--te-dark);
}

.te-root .te-bb-tile::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 3;
	height: 3px;
	background-color: var(--te-accent);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.7s var(--te-ease-out);
}

.te-root .te-bb-tile__content {
	position: relative;
	z-index: 2;
	padding: 26px;
}

.te-root .te-bb-tile .te-bb__title {
	margin-bottom: 0;
	font-size: 22px;
}

.te-root .te-bb-tile .te-bb__meta {
	margin-bottom: 14px;
}

.te-root .te-bb-tile__reveal {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.55s var(--te-ease-out);
}

.te-root .te-bb-tile__reveal-inner {
	min-height: 0;
	overflow: hidden;
}

.te-root .te-bb-tile__reveal-inner > :first-child {
	margin-top: 12px;
}

.te-root .te-bb-tile__reveal-inner > * {
	opacity: 0;
	transform: translateY(10px);
	transition: opacity 0.35s var(--te-ease), transform 0.5s var(--te-ease-out);
}

.te-root .te-bb-tile .te-bb__desc {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--te-clamp);
}

.te-root.te-bb--reveal-always .te-bb-tile__reveal,
.te-root.te-bb--reveal-hover .te-bb-tile:hover .te-bb-tile__reveal,
.te-root.te-bb--reveal-hover .te-bb-tile:focus-within .te-bb-tile__reveal {
	grid-template-rows: 1fr;
}

.te-root.te-bb--reveal-always .te-bb-tile__reveal-inner > *,
.te-root.te-bb--reveal-hover .te-bb-tile:hover .te-bb-tile__reveal-inner > *,
.te-root.te-bb--reveal-hover .te-bb-tile:focus-within .te-bb-tile__reveal-inner > * {
	opacity: 1;
	transform: none;
	transition-delay: 0.1s;
}

.te-root.te-bb--reveal-always .te-bb-tile .te-bb__overlay::after,
.te-root .te-bb-tile:hover .te-bb__overlay::after,
.te-root .te-bb-tile:focus-within .te-bb__overlay::after {
	opacity: 1;
}

.te-root .te-bb-tile:hover::after,
.te-root .te-bb-tile:focus-within::after {
	transform: scaleX(1);
}

.te-root .te-bb-tile:hover .te-bb__img,
.te-root .te-bb-tile:focus-within .te-bb__img {
	transform: scale(var(--te-zoom));
}

@media (hover: none) {
	.te-root.te-bb--reveal-hover .te-bb-tile__reveal {
		grid-template-rows: 1fr;
	}

	.te-root.te-bb--reveal-hover .te-bb-tile__reveal-inner > * {
		opacity: 1;
		transform: none;
	}

	.te-root.te-bb--reveal-hover .te-bb-tile .te-bb__overlay::after {
		opacity: 1;
	}
}

/* ===================================================================== */
/* Deep-link highlight + reduced motion                                   */
/* ===================================================================== */

.te-root.te-bb--grid .te-bb-tile.is-te-target .te-bb-tile__reveal {
	grid-template-rows: 1fr;
}

.te-root.te-bb--grid .te-bb-tile.is-te-target .te-bb-tile__reveal-inner > * {
	opacity: 1;
	transform: none;
}

.te-root.te-bb--grid .te-bb-tile.is-te-target .te-bb__overlay::after {
	opacity: 1;
}

.te-root.te-bb--grid .te-bb-tile.is-te-target::after {
	transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
	.te-root .te-bb__img,
	.te-root .te-bb-explorer__panel .te-bb__img,
	.te-root .te-bb-explorer__panel.is-active .te-bb__img {
		transform: none !important;
	}

	.te-root.is-autoplay .te-bb-explorer__progress {
		display: none;
	}
}

/* ===================================================================== */
/* Layout 5 — Carousel                                                    */
/* ===================================================================== */

.te-root .te-bb-carousel {
	--te-per-view: 3;
	--te-gap: 20px;
	position: relative;
}

.te-root .te-bb-carousel .te-carousel__track {
	margin: -6px -4px -24px;
	padding: 6px 4px 24px;
	scroll-padding-inline: 4px;
}

.te-root .te-bb-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--te-border);
	border-radius: calc(var(--te-radius) + 4px);
	background-color: var(--te-surface);
	transition: box-shadow 0.35s var(--te-ease), transform 0.35s var(--te-ease), border-color 0.35s var(--te-ease);
}

.te-root .te-bb-card:hover {
	border-color: transparent;
	box-shadow: var(--te-shadow);
	transform: translateY(-4px);
}

.te-root .te-bb-card.is-te-target {
	border-color: var(--te-accent);
	box-shadow: 0 0 0 3px rgba(233, 100, 43, 0.25), var(--te-shadow);
}

.te-root .te-bb-card__media {
	position: relative;
	flex: none;
	aspect-ratio: 16 / 11;
	border-radius: 0;
}

.te-root .te-bb-card__media .te-cover {
	transition: transform 1.1s var(--te-ease-out);
}

.te-root .te-bb-card:hover .te-bb-card__media .te-cover {
	transform: scale(var(--te-zoom));
}

.te-root .te-bb-card__meta {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 2;
	margin: 0;
}

.te-root .te-bb-card__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	align-items: flex-start;
	padding: 24px 24px 26px;
}

.te-root .te-bb-card__body > .te-bb__icon {
	margin-bottom: 18px;
}

.te-root .te-bb-card__body .te-bb__actions {
	margin-top: auto;
	padding-top: 4px;
}

/* ===================================================================== */
/* Layout 6 — Hover list                                                  */
/* ===================================================================== */

.te-root .te-bb-list {
	--te-bl-pad: 26px;
	--te-bl-line: var(--te-border);
	--te-bl-hover: var(--te-accent);
	--te-bl-preview: 340px;
	position: relative;
	border-top: 1px solid var(--te-bl-line);
}

.te-root .te-bb-list__item {
	position: relative;
	border-bottom: 1px solid var(--te-bl-line);
}

.te-root .te-bb-list__item.is-te-target .te-bb-list__trigger {
	--_c: var(--te-bl-hover);
}

.te-root .te-bb-list__heading {
	margin: 0;
	padding: 0;
	font: inherit;
}

.te-root .te-bb-list__trigger {
	--_c: var(--te-heading);
	display: flex;
	align-items: center;
	gap: 24px;
	width: 100%;
	padding: var(--te-bl-pad) 4px;
	text-align: left;
	transition: color 0.3s var(--te-ease);
}

.te-root .te-bb-list__trigger:hover,
.te-root .te-bb-list__item.is-open .te-bb-list__trigger {
	--_c: var(--te-bl-hover);
}

.te-root .te-bb-list__title {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	font-size: clamp(24px, 15px + 1.7vw, 42px);
	line-height: 1.12;
	letter-spacing: -0.03em;
	color: inherit;
	transition: transform 0.5s var(--te-ease-out);
}

.te-root .te-bb-list__trigger:hover .te-bb-list__title {
	transform: translateX(8px);
}

.te-root .te-bb-list__ico {
	order: 0;
}

.te-root .te-bb-list__icon {
	position: relative;
	flex: none;
	width: 46px;
	height: 46px;
	border: 1px solid var(--te-bl-line);
	border-radius: 50%;
	color: var(--te-heading);
	transition: background-color 0.3s var(--te-ease), border-color 0.3s var(--te-ease), color 0.3s var(--te-ease), transform 0.45s var(--te-ease-out);
}

.te-root .te-bb-list__icon::before,
.te-root .te-bb-list__icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 14px;
	height: 1.8px;
	margin: -0.9px 0 0 -7px;
	border-radius: 2px;
	background-color: currentColor;
	transition: transform 0.45s var(--te-ease-out);
}

.te-root .te-bb-list__icon::after {
	transform: rotate(90deg);
}

.te-root .te-bb-list__trigger:hover .te-bb-list__icon {
	border-color: var(--te-bl-hover);
	color: var(--te-bl-hover);
}

.te-root .te-bb-list__item.is-open .te-bb-list__icon {
	border-color: var(--te-bl-hover);
	background-color: var(--te-bl-hover);
	color: #FFFFFF;
	transform: rotate(180deg);
}

.te-root .te-bb-list__item.is-open .te-bb-list__icon::after {
	transform: rotate(0deg);
}

.te-root .te-bb-list__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.55s var(--te-ease-out);
}

.te-root .te-bb-list__item.is-open .te-bb-list__panel {
	grid-template-rows: 1fr;
}

.te-root .te-bb-list__panel-inner {
	min-height: 0;
	overflow: hidden;
	visibility: hidden;
	transition: visibility 0s linear 0.55s;
}

.te-root .te-bb-list__item.is-open .te-bb-list__panel-inner {
	visibility: visible;
	transition-delay: 0s;
}

.te-root .te-bb-list__body {
	display: grid;
	grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
	align-items: start;
	gap: 32px;
	padding: 2px 4px calc(var(--te-bl-pad) + 8px);
}

.te-root .te-bb-list__media {
	aspect-ratio: 4 / 3;
	border-radius: var(--te-radius);
}

.te-root .te-bb-list__details {
	max-width: 620px;
	padding-top: 4px;
}

/* Cursor-following preview */
.te-root .te-bb-list__float {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 6;
	width: var(--te-bl-preview);
	aspect-ratio: 4 / 3;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s var(--te-ease);
	will-change: transform;
}

.te-root .te-bb-list.is-hovering .te-bb-list__float {
	opacity: 1;
}

.te-root .te-bb-list.is-hover-open .te-bb-list__float {
	opacity: 0;
}

.te-root .te-bb-list__float-inner {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	border-radius: var(--te-radius);
	background-color: var(--te-muted);
	box-shadow: var(--te-shadow-lg);
	transform: scale(0.82);
	transition: transform 0.5s var(--te-ease-out);
}

.te-root .te-bb-list.is-hovering .te-bb-list__float-inner {
	transform: scale(1);
}

.te-root .te-bb-list__float-img {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity 0.35s var(--te-ease);
}

.te-root .te-bb-list__float-img.is-active {
	opacity: 1;
}

@media (hover: none), (max-width: 1024px) {
	.te-root .te-bb-list__float {
		display: none;
	}
}

@media (max-width: 767px) {
	.te-root .te-bb-list__trigger {
		gap: 14px;
	}

	.te-root .te-bb-list__ico {
		display: none;
	}

	.te-root .te-bb-list__icon {
		width: 38px;
		height: 38px;
	}

	.te-root .te-bb-list__body {
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
	}

	.te-root .te-bb-list__media {
		aspect-ratio: 16 / 10;
	}
}