@font-face {
	font-family: 'Tribee Icons';
	font-weight: 400;
	src: local('Tribee Icons'), local('Tribee Icons'),
	url("../../../../fonts/tribee-icons/tribee-icons-4CF9gsU.otf") format('opentype');
	font-display: swap;
}

.tribeecon {
	font-style: normal;
	font-family: 'Tribee Icons';
	font-weight: normal;
}

.tribeecon-plus:after {
	content: '\070D';
}

.tribeecon-chevron-right:after {
	display: inline-block;
	transform: rotate(90deg);
	content: '\704';
}

.tribeecon-chevron-left:after {
	display: inline-block;
	transform: rotate(-90deg);
	content: '\704';
}

.tribeecon-user:after {
	font-size: .8em;
	content: '\070E';
}

.tribeecon-logo:after {
	content: '\0700';
	font-size: 20px;
}

.tribeecon-star:after {
	content: '\0721';
}

.tribeecon-arrow:after {
	content: '\0720';
}

.title {
	font-family: "Passion One";
	letter-spacing: -0.02em;
	font-size: 2.1rem;
	line-height: 2.3rem;
	font-weight: 400;
	text-transform: uppercase;
	text-align: center;
	margin: 0;
}

main img {
	width: 100%;
	height: auto;
}

nav, header, main {
	background-color: var(--color-nude)!important;
}

nav:after {
	content: none !important;
}

body {
	--font-brush: 'Hey August';
	--font-brush-ls: 0.05em;
	--font-brush-weight: 400;
	--font-brush-tr: geometricPrecision;
	margin: 0;
	font-family: Inter, sans-serif;
	color: var(--color-carbone);
	background-color: var(--color-nude);
}

.brush {
	font-family: var(--font-brush);
	font-weight: var(--font-brush-weight);
	letter-spacing: var(--font-brush-ls);
	text-rendering: var(--font-brush-tr);
}

.arrow-quote {
	display: none;
}

main {
	width: 100%;
	padding: 0;
}

.wide-container {
	max-width: 1600px;
	margin: 0 auto;
}

nav {
	.burger-menu-link, .nav-user-connexion-link {
		background-color: var(--color-eggshell);
	}
	.mobile-menu {
		background-color: var(--color-nude);
		z-index: 3;
	}
	.right-nav {
		.btn {
			--btn-primary-color: var(--color-carbone);
		}
	}
	.navlinks, .create-money-pot-link, .nav-user-connexion-link {
		z-index: 4;
	}
}

.background-brush-text {
	height: 40px;
	line-height: 40px;
	mask-size: auto 100%;
	mask-position-y: -4px;
}

.tribee-features, .business-model, .qvema {
	--gap: 30px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--gap);
	.text-container {
		width: 90vw;
		display: flex;
		gap: var(--gap);
		flex-direction: column;
		.center-content {
			display: flex;
			flex-direction: column;
			gap: var(--gap);
		}
	}
	picture {
		width: 100%;
	}
	@media screen and (min-width: 720px) {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 0;
		.text-container {
			flex: 1 1 50%;
			order: 2;
			align-items: center;
			.center-content {
				align-items: flex-start;
				max-width: 600px;
				.title {
					align-items: flex-start;
					text-align: left;
				}
			}
			.btn {
				max-width: 270px;
			}
		}
		picture {
			flex: 1 1 50%;
			order: 1;
			max-width: 600px;
		}
	}
	@media screen and (min-width: 1600px) {
		picture {
			max-width: 800px;
		}
	}
}
.qvema {
	@media screen and (min-width: 720px) {
		picture {
			order: 2;
		}
		.text-container {
			order: 1;
			.center-content {
				padding: 0 10px;
			}
		}
	}
	@media screen and (min-width: 1600px) {
		.text-container {
			.center-content {
				padding: 0;
			}
		}
	}
}

.zoom-effect {
	animation: zoom-in-out 0.5s ease-in-out forwards;
}

@keyframes zoom-in-out {
	0% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.2);
	}
	100% {
		transform: scale(1);
	}
}

footer {
	margin-top: 60px;
	@media screen and (min-width: 720px) {
		margin-top: 80px;
	}
	@media screen and (min-width: 1000px) {
		margin-top: 100px;
	}
}

@media screen and (min-width: 720px) {
	nav {
		.nav-user-connexion-link {
			background-color: transparent;
		}
	}
	.arrow-quote {
		display: flex;
		flex-direction: column;
		align-items: center;
		position: absolute;
		font-size: 30px;
		line-height: 31px;
		transform: rotate(-16deg);
		span {
			align-self: flex-start;
			display: block;
		}
	}
}

@media screen and (min-width: 1000px) {
	.title {
		font-size: 48px;
		line-height: 45px;
	}
	.background-brush-text {
		height: 48px;
		line-height: 48px;
	}
}

.tribee-features, .qvema {
	ul {
		padding: 0;
		display: flex;
		flex-direction: column;
		gap: 15px;
		margin: 0;
		li {
			list-style-type: none;
			line-height: 24px;
		}
	}
}