/**
 * UI critique non optimisable (menu actif + landings régionales).
 * Chargé avec data-no-optimize pour contourner LiteSpeed UCSS.
 */

body.btk-regional-landing .main-content.btk-regional-main {
	padding-top: 5rem;
}

.main-nav .nav-menu > li > a {
	position: relative;
	display: inline-block;
}

.main-nav .nav-menu > li > a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -0.4rem;
	height: 2px;
	border-radius: 2px;
	background: var(--btk-accent, #ff6b35);
	transform: scaleX(0);
	transform-origin: center;
	opacity: 0;
	transition: transform 0.35s cubic-bezier(0.34, 1.2, 0.64, 1), opacity 0.25s ease;
}

.main-nav .nav-menu > li.current-menu-item > a,
.main-nav .nav-menu > li.current-menu-ancestor > a,
.main-nav .nav-menu > li.btk-nav-is-active > a {
	color: var(--btk-accent, #ff6b35);
}

.main-nav .nav-menu > li.current-menu-item > a::after,
.main-nav .nav-menu > li.current-menu-ancestor > a::after,
.main-nav .nav-menu > li.btk-nav-is-active > a::after {
	transform: scaleX(1);
	opacity: 1;
	animation: btk-nav-indicator-in 0.45s cubic-bezier(0.34, 1.2, 0.64, 1);
}

@keyframes btk-nav-indicator-in {
	from {
		transform: scaleX(0);
		opacity: 0;
	}
	to {
		transform: scaleX(1);
		opacity: 1;
	}
}

@media (max-width: 1024px) {
	body.btk-regional-landing .main-content.btk-regional-main {
		padding-top: 4.25rem;
	}

	.main-nav .nav-menu > li > a::after {
		top: 50%;
		bottom: auto;
		left: 0;
		right: auto;
		width: 3px;
		height: 55%;
		transform: translateY(-50%) scaleY(0);
		border-radius: 0 2px 2px 0;
	}

	.main-nav .nav-menu > li.current-menu-item > a::after,
	.main-nav .nav-menu > li.current-menu-ancestor > a::after,
	.main-nav .nav-menu > li.btk-nav-is-active > a::after {
		transform: translateY(-50%) scaleY(1);
		animation: btk-nav-indicator-in-mobile 0.4s cubic-bezier(0.34, 1.2, 0.64, 1);
	}

	@keyframes btk-nav-indicator-in-mobile {
		from {
			transform: translateY(-50%) scaleY(0);
			opacity: 0;
		}
		to {
			transform: translateY(-50%) scaleY(1);
			opacity: 1;
		}
	}
}

@media (max-width: 640px) {
	body.btk-regional-landing .main-content.btk-regional-main {
		padding-top: 4.25rem;
	}
}