/*==================================================
EVER THEME
Navigation
Version 2.0.0
==================================================*/

/* DESKTOP MENU
==================================================*/

.ever-nav__menu {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-7);

	margin: 0;
	padding: 0;

	list-style: none;
}

.ever-nav__item {
	position: relative;
}

.ever-nav__link {
	position: relative;

	display: flex;
	align-items: center;
	gap: var(--space-2);

	padding-block: var(--space-3);

	font-family: var(--font-body);
	font-size: 14px;
	font-weight: var(--fw-medium);
	line-height: 1.2;

	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;

	color: var(--color-text);

	transition: color var(--transition-fast);
}

.ever-nav__link:hover,
.ever-nav__item.is-current > .ever-nav__link,
.ever-nav__item.is-current-parent > .ever-nav__link {
	color: var(--color-primary);
}

/* LINK UNDERLINE
==================================================*/

.ever-nav__text {
	position: relative;
}

.ever-nav__text::after {
	content: "";

	position: absolute;
	right: 0;
	bottom: -8px;
	left: 0;

	height: 1px;

	background: currentColor;

	transform: scaleX(0);
	transform-origin: right center;

	transition: transform var(--transition);
}

.ever-nav__link:hover .ever-nav__text::after,
.ever-nav__item.is-current > .ever-nav__link .ever-nav__text::after,
.ever-nav__item.is-current-parent > .ever-nav__link .ever-nav__text::after {
	transform: scaleX(1);
	transform-origin: left center;
}

/* ARROW
==================================================*/

.ever-nav__arrow {
	flex-shrink: 0;

	transition: transform var(--transition);
}

.ever-nav__item--has-children:hover
> .ever-nav__link
.ever-nav__arrow,
.ever-nav__item--has-children:focus-within
> .ever-nav__link
.ever-nav__arrow {
	transform: rotate(180deg);
}

/* SUBMENU
==================================================*/

.ever-submenu {
	position: absolute;
	top: calc(100% + 12px);
	left: 50%;
	z-index: var(--z-dropdown);

	min-width: 270px;

	margin: 0;
	padding: var(--space-3);

	list-style: none;

	background: rgba(255, 255, 255, 0.97);

	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);

	box-shadow: var(--shadow-md);

	backdrop-filter: blur(18px);
	-webkit-backdrop-filter: blur(18px);

	opacity: 0;
	visibility: hidden;

	transform:
		translateX(-50%)
		translateY(14px);

	transition:
		opacity var(--transition),
		visibility var(--transition),
		transform var(--transition);
}

.ever-nav__item--has-children:hover > .ever-submenu,
.ever-nav__item--has-children:focus-within > .ever-submenu {
	opacity: 1;
	visibility: visible;

	transform:
		translateX(-50%)
		translateY(0);
}

/* SUBMENU BRIDGE
==================================================*/

.ever-submenu::before {
	content: "";

	position: absolute;
	right: 0;
	bottom: 100%;
	left: 0;

	height: 18px;
}

/* SUBMENU ITEMS
==================================================*/

.ever-submenu .ever-nav__item {
	opacity: 0;

	transform: translateY(8px);

	transition:
		opacity var(--transition),
		transform var(--transition);
}

.ever-nav__item--has-children:hover
> .ever-submenu
> .ever-nav__item,
.ever-nav__item--has-children:focus-within
> .ever-submenu
> .ever-nav__item {
	opacity: 1;
	transform: translateY(0);
}

.ever-submenu .ever-nav__item:nth-child(1) {
	transition-delay: 0.04s;
}

.ever-submenu .ever-nav__item:nth-child(2) {
	transition-delay: 0.08s;
}

.ever-submenu .ever-nav__item:nth-child(3) {
	transition-delay: 0.12s;
}

.ever-submenu .ever-nav__item:nth-child(4) {
	transition-delay: 0.16s;
}

.ever-submenu .ever-nav__item:nth-child(5) {
	transition-delay: 0.20s;
}

.ever-submenu .ever-nav__link {
	width: 100%;

	padding: 12px 14px;

	font-size: 14px;
	letter-spacing: 0;
	text-transform: none;

	border-radius: var(--radius-sm);
}

.ever-submenu .ever-nav__link:hover,
.ever-submenu .is-current > .ever-nav__link {
	background: var(--color-hover);
}

.ever-submenu .ever-nav__text::after {
	display: none;
}

/* NESTED DESKTOP SUBMENU
==================================================*/

.ever-submenu .ever-submenu {
	top: 0;
	left: calc(100% + 14px);

	transform: translateX(10px);
}

.ever-submenu
.ever-nav__item--has-children:hover
> .ever-submenu,
.ever-submenu
.ever-nav__item--has-children:focus-within
> .ever-submenu {
	transform: translateX(0);
}

/* BURGER
==================================================*/

.ever-burger {
	position: relative;

	display: none;

	width: 48px;
	height: 48px;

	padding: 0;

	background: transparent;

	border-radius: var(--radius-round);

	cursor: pointer;

	transition: background var(--transition-fast);
}

.ever-burger:hover {
	background: var(--color-secondary);
}

.ever-burger span {
	position: absolute;
	left: 10px;

	width: 28px;
	height: 1.5px;

	background: var(--color-primary-dark);

	border-radius: var(--radius-round);

	transition:
		top var(--transition),
		transform var(--transition),
		opacity var(--transition);
}

.ever-burger span:nth-child(1) {
	top: 15px;
}

.ever-burger span:nth-child(2) {
	top: 23px;
}

.ever-burger span:nth-child(3) {
	top: 31px;
}

.ever-burger.is-active span:nth-child(1) {
	top: 23px;
	transform: rotate(45deg);
}

.ever-burger.is-active span:nth-child(2) {
	opacity: 0;
}

.ever-burger.is-active span:nth-child(3) {
	top: 23px;
	transform: rotate(-45deg);
}

/* MOBILE MENU
==================================================*/

.ever-mobile-nav__menu {
	margin: 0;
	padding: 0;

	list-style: none;
}

.ever-mobile-nav__menu > .ever-nav__item {
	border-bottom: 1px solid var(--color-border);
}

.ever-mobile-nav__menu .ever-nav__link {
	justify-content: space-between;

	width: 100%;

	padding: var(--space-5) var(--space-2);

	font-family: var(--font-heading);
	font-size: 30px;
	font-weight: var(--fw-regular);

	letter-spacing: 0;
	text-transform: none;

	color: var(--color-primary-dark);
}

.ever-mobile-nav__menu .ever-nav__text::after {
	display: none;
}

.ever-mobile-nav__menu .ever-nav__arrow {
	width: 14px;
	height: 10px;
}

/* MOBILE SUBMENU
==================================================*/

.ever-mobile-nav__menu .ever-submenu {
	position: static;

	min-width: 0;
	max-height: 0;

	padding: 0;
	margin: 0;

	overflow: hidden;

	background: transparent;

	border: 0;
	border-radius: 0;

	box-shadow: none;

	backdrop-filter: none;
	-webkit-backdrop-filter: none;

	opacity: 1;
	visibility: visible;

	transform: none;

	transition:
		max-height var(--transition-slow),
		padding var(--transition);
}

.ever-mobile-nav__menu
.ever-nav__item--has-children.is-open
> .ever-submenu {
	max-height: 800px;

	padding-bottom: var(--space-4);
}

.ever-mobile-nav__menu .ever-submenu::before {
	display: none;
}

.ever-mobile-nav__menu .ever-submenu .ever-nav__item {
	opacity: 1;
	transform: none;
}

.ever-mobile-nav__menu .ever-submenu .ever-nav__link {
	padding: var(--space-3) var(--space-5);

	font-family: var(--font-body);
	font-size: var(--fs-sm);

	color: var(--color-text-light);
}

.ever-mobile-nav__menu
.ever-nav__item--has-children.is-open
> .ever-nav__link
.ever-nav__arrow {
	transform: rotate(180deg);
}

/* RESPONSIVE
==================================================*/

@media (max-width: 1180px) {

	.ever-nav__menu {
		gap: var(--space-5);
	}

	.ever-nav__link {
		font-size: 13px;
	}

}

@media (max-width: 1024px) {

	.ever-nav {
		display: none;
	}

	.ever-burger {
		display: block;
	}

}

@media (max-width: 480px) {

	.ever-mobile-nav__menu .ever-nav__link {
		font-size: 27px;
	}

}

/* MOBILE : neutralise le survol / focus du menu ordinateur
   Sur un écran tactile, un appui déclenche :hover et :focus-within,
   ce qui décalait le sous-menu de -50% hors de l'écran.
==================================================*/

.ever-mobile-nav__menu .ever-nav__item--has-children:hover > .ever-submenu,
.ever-mobile-nav__menu .ever-nav__item--has-children:focus-within > .ever-submenu {
	opacity: 1;
	visibility: visible;

	transform: none;
}

.ever-mobile-nav__menu .ever-nav__item--has-children:hover > .ever-nav__link .ever-nav__arrow,
.ever-mobile-nav__menu .ever-nav__item--has-children:focus-within > .ever-nav__link .ever-nav__arrow {
	transform: none;
}

.ever-mobile-nav__menu .ever-nav__item--has-children.is-open > .ever-nav__link .ever-nav__arrow {
	transform: rotate(180deg);
}