/*!
Theme Name: NECC
Theme URI: http://necc.clementdorchies.com//
Author: Clement Dorchies
Author URI: http://necc.clementdorchies.com//
*/

body,
html {
	margin: 0px;
	overflow-x: hidden;
}


:root {
	--cta-dark: rgba(39, 35, 34, 1);
	--body-font: "Outfit";
	--neutral-gray: rgba(33, 33, 33, 1);
	--brown-700: rgba(167, 157, 151, 1);
	--brown-500: rgba(234, 227, 224, 1);
	--brown-900: rgba(39, 35, 34, 1);
	--brown-400: rgba(244, 241, 239, 1);
	--brown-800: rgba(93, 85, 81, 1);
	--brown-600: rgba(212, 203, 198, 1);
	--orange: rgba(218, 103, 59, 1);
}


.container {
	max-width: 1260px;
	margin: 0 auto;
	width: 100%;
	box-sizing: border-box;

}

.header-container {

	width: 100%;
	padding-top: 8px;
	padding-right: 8px;
	padding-bottom: 8px;
	padding-left: 16px;
	background: white;
	border-radius: 20px;
	box-sizing: border-box;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
	box-shadow: 0px 8px 3px rgba(93, 85, 80, 0.01), 0px 4px 3px rgba(93, 85, 80, 0.04), 0px 2px 2px rgba(93, 85, 80, 0.07), 0px 0px 1px rgba(93, 85, 80, 0.08);
	position: relative;

}

.main-header {
	margin-top: 24px;
	position: absolute;
	width: 100%;
	top: 24px;
	z-index: 100;
}


.header-cta {
	max-width: 163px;
	width: 100%;
	display: flex;
	align-items: center;

}

.header-cta a {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--cta-dark);
	color: #fff;
	font-family: var(--body-font);
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0px;
	line-height: 140%;
	max-width: 163px;
	width: 163px;
	height: 46px;
	padding: 12px 24px;
	box-sizing: border-box;
	border-radius: 16px;
	text-decoration: none;

}


#menu-header-menu {
	list-style-type: none;
	display: flex;
	gap: 60px;
	margin: 0px;

}

#menu-header-menu li a {
	text-decoration: none;
	color: var(--brown-700);
	font-family: var(--body-font);
	font-weight: 400;
	font-size: 16px;
	line-height: 140%;
	letter-spacing: 0%;


}

@media(max-width:1400px) {
	.container {
		padding-left: 30px;
		padding-right: 30px;
	}
}


.main-footer-section {
	background: var(--neutral-gray);
	padding-top: 80px;
	display: flex;
	padding-bottom: 38px;
}

.footer-logo-container {
	max-width: 331px;
	width: 100%;
}

.footer-logo-container img {
	max-width: 151px;
	width: 100%;
	height: 52px;

}


.footer-top {
	display: flex;
	justify-content: space-between;
	gap: 240.5px;
}

.footer-menu {
	list-style: none;
	padding: 0px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.footer-menu a {
	text-decoration: none;
	color: var(--brown-500) !important;
	font-family: var(--body-font);
	font-weight: 400;
	font-size: 16px;
	line-height: 140%;
	letter-spacing: 0%;

}

@media(min-width:1025px) {

	.footer-menu .current-menu-item a {
		color: var(--brown-500) !important;
	}

}

.footer-menu-wrapper,
.footer-social {
	max-width: 100%;
	width: 100%;
}

.footer-top {
	padding-bottom: 60px;
	margin-bottom: 40px;
	border-bottom: 1px solid var(--brown-500);
}


.footer-bottom {
	display: flex;
	justify-content: space-between;
	gap: 212.67px;
}

.footer-bottom p,
.footer-privacy a {
	margin: 0px;
	color: var(--brown-500);
	font-family: var(--body-font);
	font-weight: 400;
	font-size: 12px;
	line-height: 140%;
	letter-spacing: 0%;

}


.footer-privacy {
	list-style: none;
	margin: 0px;
	padding: 0px;
	display: flex;
	justify-content: space-between;
	gap: 212.67px;
}

.footer-privacy a {
	text-decoration: none;
}

@media (max-width: 1280px) {
	.container {
		padding-left: 80px;
		padding-right: 80px;
	}
}

.header-menu-mobile {
	display: none;
}


@media(max-width:1024px) {
	.container {
		max-width: 100%;
		padding-left: 20px;
		padding-right: 20px;
	}

	.header-container {
		background: transparent;
		padding-left: 0px;
		padding-right: 0px;
		box-shadow: unset !important;
	}

	.header-cta {
		display: none;
	}



	.header-menu-container {
		display: none;
	}

	.header-menu-mobile {
		display: block;
	}
}

@media(min-width:1025px) {

	ul.sub-menu {
		position: absolute;
		top: 78px;
		padding: 0px;
		margin: 0px;
		display: grid;
		grid-template-columns: repeat(3, 353.33px);

		left: 50%;
		right: 0;
		margin: 0 auto;
		transform: translateX(-50%);
		background: white;
		width: 100%;
		list-style: none;
		justify-content: center;
		padding: 0px 20px 0px 40px;
		background: #FFFFFF;
		box-shadow: 0px 102px 41px rgba(0, 0, 0, 0.01), 0px 57px 34px rgba(0, 0, 0, 0.03), 0px 25px 25px rgba(0, 0, 0, 0.06), 0px 6px 14px rgba(0, 0, 0, 0.06);
		border-radius: 22px;
		row-gap: 12px;
		box-sizing: border-box;
		max-height: 0px;
		overflow: hidden;
		transition: 0.3s;
	}

	#menu-header-menu .sub-menu li a {
		color: var(--cta-dark);
		position: relative;
		display: flex;
		align-items: center;
		padding-left: 24px;
		gap: 10px;
		overflow: hidden;
	}

	.current-menu-parent .sub-menu li a {
		color: var(--brown-700) !important;
	}

	#menu-header-menu .current-menu-parent .sub-menu li svg {
		opacity: 0.3;
	}

	/* #menu-header-menu .sub-menu li a:before {
		content: url('/wp-content/uploads/2026/03/Vector.svg');
		width: 16px;
		height: 16px;
		min-width: 16px;
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		left: 0;
		top: 0;
	} */



	ul.sub-menu {
		pointer-events: none;
	}

	ul.sub-menu.menu-item-active {
		pointer-events: all;
	}

	.menu-item-has-children::after {
		content: url('/wp-content/uploads/2026/03/Vector-1.svg');
		position: absolute;
		width: 20px;
		height: 20px;
		min-width: 20px;
		display: inline-flex;
		justify-content: center;
		align-items: center;
		margin-left: 4px;
		transition: 0.3s;
		opacity: 0.3;
	}


	.menu-item-has-children:hover:after
	{
		opacity: 1;
	}
	.current-menu-ancestor::after {
		opacity: 1;
	}

	.menu-item-active:after {
		transform: rotate(180deg) translateY(-5px);
	}

	
}


@supports (-moz-appearance: none) {

	@media(min-width:1025px) {
		.menu-item-has-children::after {
			position: unset !important;
			margin-left: 0px;
			margin-right: -20px;
			width: unset;
			height: unset;
			min-width: unset;
			margin-top: 4px;
		}

		.menu-item-has-children {
			display: inline-flex;
			align-items: center;
			gap: 10px
		}

		.menu-item-active:after {
		transform: rotate(180deg) translateY(1px);
	}

	}

}

.header-menu-mobile svg path {
	fill: var(--brown-900);
}

.header-mobile-container {
	display: none;
}

@media(max-width:1024px) {
	.header-mobile-container {
		display: block;
		background: var(--brown-900);
		min-height: 100vh;
		padding-top: 138px;
		padding-bottom: 40px;
		padding-left: 20px;
		padding-right: 20px;
		width: 100%;
		position: fixed;
		top: 100%;
		left: 0;
		box-sizing: border-box;
		transition: 0.5s;
	}

	.mobile-drawer-active .header-mobile-container {
		top: 0%;
	}

	.header-navigation ul {
		padding: 0px;
		margin: 0px;
		list-style: none;
	}

	.header-navigation li a {
		text-decoration: none;
		font-family: var(--body-font);
		font-weight: 500;
		font-size: 18px;
		line-height: 140%;
		color: var(--brown-400) !important;

	}

	header .menu-item {
		min-height: 57px;
		border-bottom: 1px solid var(--brown-800);
		padding-top: 16px;
		padding-bottom: 16px;
		display: flex;
		justify-content: center;
		box-sizing: border-box;
		flex-direction: column;
	}

	header .menu-item:last-child {
		border-bottom: 0px;


	}

	header .sub-menu .menu-item {
		border: 0px !important;
		min-height: 40px;
		padding-top: 9px;
		padding-bottom: 9px;
	}

	.sub-menu .menu-item a {
		font-weight: 400;
		font-size: 16px;
		line-height: 140%;

	}

	.sub-menu {
		padding-left: 20px !important;
		transition: 0.3s;
		max-height: 0px;
		overflow: hidden;
	}


	.menu-item-has-children a {
		position: relative;
	}

	.menu-item-has-children a:after {
		content: url('/wp-content/uploads/2026/03/Vector-2.svg');
		width: 24px;
		height: 24px;
		min-width: 24px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		right: 0;
		transition: 0.5s;
	}

	.sub-menu a:after {
		display: none;
	}

	.mobile-menu-item-active .sub-menu {
		padding-top: 17px;
	}

	.mobile-menu-item-active a:after {
		transform: rotate(90deg);
	}

	.header-mobile-menu-container {
		margin-bottom: 73px;
	}

	.header-menu-btn {
		background: var(--brown-400);
		font-family: var(--body-font);
		font-weight: 400;
		font-size: 16px;
		line-height: 140%;
		color: var(--brown-900);
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		height: 46px;
		width: 100%;
		text-decoration: none;
		border-radius: 16px;
	}

	.header-logo {
		position: relative;
		z-index: 11;
	}

	.header-logo img {
		transition: 0.3s;
	}

	.mobile-drawer-active .header-logo img {
		filter: brightness(100);

	}

	.header-menu-mobile {
		position: relative;
		z-index: 1111;
		width: 16px;
		height: 16px;
	}

	.h-line {
		background-color: var(--brown-400);
		width: 17px;
		height: 2px;
	}

	.h-line-1 {
		transform: rotate(45deg) translateX(0px) scale(0);
		margin-left: 3px;
		/* margin-top: 6px; */
		transform-origin: top left;
		transition: 0.5s;
	}

	.h-line-2 {
		transform: rotate(-45deg) translateX(3px) scale(0);
		margin-left: -5px;
		/* margin-top: 0px; */
		transform-origin: top right;
		transition: 0.5s;

	}

	.mobile-drawer-active .h-line-1 {
		transform: rotate(45deg) translateX(0px) scale(1);
	}

	.mobile-drawer-active .h-line-2 {
		transform: rotate(-45deg) translateX(3px) scale(1);


	}


	.mobile-drawer-active .header-icon-visible {
		opacity: 0;
	}

	.header-icon-visible {
		width: 16px;
		height: 16px;
		position: absolute;
		transition: 0.5s;
	}

	.header-icon-hidden {
		position: absolute;
		top: 1px;
	}

	.mobile-drawer-active {
		overflow-y: hidden;
	}
}


.reveal-text {
	opacity: 0;
	overflow: hidden;
}

.word-wrapper {
	overflow: hidden;
	display: inline-block;
	/* important — keeps words inline */
}

.words-reveal {
	display: inline-block;
	transform: translateY(100%);
}


@media(max-width:767px) {
	.footer-top {
		flex-direction: column;
		gap: 0px;
		align-items: center;
	}

	.footer-logo-container {
		margin-bottom: 40px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.footer-menu {
		align-items: center;
		margin: 0px;
		padding: 0px;
	}

	.footer-menu a {
		color: var(--brown-700);
	}

	.footer-social-navigation {
		margin-top: 20px;
	}

	.main-footer-section {
		padding-top: 40px;
		padding-bottom: 40px;
	}

	.footer-top {
		margin-bottom: 40px;
		padding-bottom: 40px;
		border-bottom: 1px solid var(--brown-800);
	}

	.footer-bottom {
		flex-direction: column-reverse;
		gap: 24px;
		align-items: center;

	}

	.footer-privacy {
		gap: 24px;
		flex-direction: column;
		align-items: center;
	}

	.footer-bottom p,
	.footer-privacy a {
		font-family: var(--body-font);
		font-weight: 400;
		font-size: 12px;
		line-height: 140%;
		color: var(--brown-700);

	}
}

@media(min-width:1025px) {
	#menu-header-menu .sub-menu li a:after {
		content: '';
		border-bottom: 1px solid rgba(33, 33, 33, 1);

		height: 1px;
		width: 0%;
		transition: 0.3s;
		display: block;
		position: absolute;
		bottom: 0;


	}

	#menu-header-menu .sub-menu li a:hover:after {
		width: 100%;
	}

	.sub-menu li {
		max-width: fit-content;
	}

	.footer-menu a {
		position: relative;
	}


	.footer-menu a:after {
		content: '';
		border-bottom: 1px solid var(--brown-400);

		height: 1px;
		width: 0%;
		transition: 0.3s;
		display: block;
		position: absolute;
		bottom: 0;

	}

	.footer-menu a:hover:after {
		width: 100%;
	}

}




.btn-dark,
.btn-light,
.header-cta a,
.btn-transparent {
	transition: 0.5s;
}


@media(min-width:1025px) {

	.btn-dark:hover,
	.btn-light:hover,
	.header-cta a:hover,
	.btn-transparent:hover {
		border-radius: 30px;
	}
}


.what-you-get-content:last-child {
	border-bottom: 0px;
}


@media(min-width:1025px) {

	.current-menu-item a,
	.current-menu-parent a,
	.current-menu-parent .sub-menu .current-menu-item a {
		color: var(--cta-dark) !important;
	}
}

.current-menu-item a svg {
	opacity: 1 !important;
}




.menu-icon-svg-wrapper {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	overflow: hidden;

}

.menu-icon-svg-wrapper svg {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: 0.5s
}


.menu-icon-visible {
	left: 0;
}

.menu-icon-hidden {
	left: -30px;

}

#menu-header-menu li a {
	transition: 0.5s;
}


@media(min-width:1025px) {
	#menu-header-menu .sub-menu li a:hover .menu-icon-hidden {
		left: 0px;
	}

	#menu-header-menu .sub-menu li a:hover .menu-icon-visible {
		left: 30px;
	}

	#menu-header-menu li a:hover {
		color: var(--cta-dark);
	}

	#menu-header-menu li a:hover svg {
		opacity: 1 !important;
	}
}

.hero-content h1 {
	line-height: 112% !important;
}

@media(max-width: 1024px) {
	.hero-content h1 {
		line-height: 120% !important;
	}
}