/* Variables thèmes */
:root {
	/* Font family */
	--font-text: 'Quicksand', sans-serif;
	--font-title: 'Montserrat', sans-serif;
	--font-numeric: 'Righteous', sans-serif;
	
	/* Colors */
	--bg-color: #9dc1ca; /* light blue */
	--bg-color-white: #ffffff; /* white */
	--bg-color-light: #fae6c4; /* light yellow */
	--bg-color-light-3: rgba(250, 230, 196, 0.3); /* light yellow */
	--bg-color-light-7: rgba(250, 230, 196, 0.7); /* light yellow */
	--bg-color-light-gradient : linear-gradient(to bottom, rgba(158, 193, 201, 0.8), rgba(191, 208, 206, 0.8));  /* light blue gradient */
	--bg-color-light-transparent : rgba(253, 248, 238, 0.3);  /* light transparent */
	--bg-color-light-transparent-7 : rgba(253, 248, 238, 0.7);  /* light transparent */


	/* Text colors */
	--txt-color-light : #fae6c4; /* light blue */
	--txt-color-light-grey : #546e7a; /* light grey */
	--txt-color-dark : #411007; /* brown */
	--txt-color-primary : #B83F2A; /* orange */
	--txt-color-primary-5 : rgba(184, 63, 42, 0.5); /* orange */
	--txt-color-secondary : #991e0a; /* dark orange */
	--txt-color-success : #198754; /* green */
	--txt-color-danger : #dc3545; /* red */
	--txt-color-warning : #d8751e; /* orange */
}

body, html {
	margin : 0;
	padding : 0;
	padding-top : 33px;
	height : 100vh;
	font-family: var(--font-text);
	font-optical-sizing: auto;
	font-style: normal;
	scroll-behavior: smooth;
}
body {
	background: var(--bg-color-light);
}
html {
	background-color: #fae6c4 !important;
	color-scheme: only light;
}
@media (prefers-color-scheme: dark) {
	html, body {
		color-scheme: light;
		background-color: #fae6c4 !important;
	}
}
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-title);
	font-optical-sizing: auto;
	font-style: normal;
	font-weight : 200;
}
h1 { font-size : 2rem; }
@media (min-width: 576px) { h1 { font-size : 2.2rem; } }
@media (min-width: 768px) { h1 { font-size : 2.5rem; } }
@media (min-width: 992px) { h1 { font-size : 2.7rem; } }
@media (min-width: 1200px) { h1 { font-size : 2.9rem; } }
@media (min-width: 1400px) { h1 { font-size : 3.1rem; } }

main .container-fluid {
	padding : 0;
	margin : 0;
}

@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
.hr {
          border-color: var(--txt-color-primary-5);
}

/* Button */
.btn {
	color : var(--txt-color-light);
	border-color : var(--txt-color-secondary);
	background-color : var(--txt-color-primary);
	box-shadow : 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}
.btn:hover, :not(.btn-check)+.btn:active {
	color : var(--txt-color-light);
	border-color : var(--txt-color-secondary);
	background-color : var(--txt-color-secondary);
}
.btn .bi {
	color : var(--txt-color-light);
	padding-right : 3px;
	transition: color 0.2s ease;
}
.btn:hover .bi {
	color : var(--txt-color-light);
}
.btn:focus-visible {
	color : var(--txt-color-light);
	background-color: var(--txt-color-secondary);
	border-color : var(--txt-color-secondary);
	box-shadow: 0 0 0 .25rem var(--txt-color-primary-5);
}

/* links */
.nav-link:focus-visible, .navbar-brand:focus-visible {
	outline: 0;
	box-shadow: 0 0 0 .25rem var(--txt-color-primary-5);
	border-radius : 1rem;
}

/* Socials */
.bi-instagram { color : #bc2a8d; }
.bi-facebook { color : #3b5998; }
.bi-discord { color : #7289d9; }
.bi-youtube { color : #bb0000; }
.bi-twitter { color : #00aced; }
.bi-twitter-x { color : rgb(33,37,41); }
.bi-threads { color : rgb(33,37,41); }
.bi-link-45deg { color : rgb(33,37,41); }