[data-composant="zone-texte"]
{
	&{
		width: var(--maxWidth);
		margin: 0 auto;
		padding: var(--padding);
	}
	
	h1
	{
		margin-bottom: 50px;
		color: var(--couleurTitre);
	}
	
	
	
}
[data-composant="footer"]
{
	&{
		background: var(--couleurDegrader1);
		color: white;
		padding: 20px;
		padding-top:40px;
		position: sticky;
		bottom: 0;
		margin-top: -20px;
		
	}
	
	@media (max-width: 820px)
	{
		h2, h3{
			font-size: 1.5em!important;
		}
	}
	
	& > div {
		display: flex;
		justify-content: space-between;
		gap: 1em;
	}
	
	@media (max-width: 720px)
	{
		& > div {
			display: block;
		}
	}
	
	
	@media (max-width: 820px)
	{
		& > div > div{
			max-width: 350px;
		}
	}
	
	.txt{
		max-width: 500px;
	}
	#menus{
		display: flex;
		gap: 1em;
	}
	
	@media (max-width: 720px)
	{
		nav {
			font-size: .8em;
		}
	}
	
	
	ul{
		padding-left: 0;
	}
	li{
		list-style: none;
		padding-left: 0;
	}
	
	h2, h3, h4{
		color: white !important;
	}
	
	
	a{
		color: white;
	}
	
	li a{
		text-decoration: none;
	}
	
	[data-composant="bouton"]
	{
		color: var(--couleurBTNTexte);
	}
	
	
	#copyright
	{
		&{
			font-size: .8em;
			
		}
		
		p{
		}
	}
	
	
}


@keyframes emotion-pena {
	0%, 70%, to {
		transform:rotate(0)scale(1)
	}

	78% {
		transform:rotate(-12deg)scale(1.18)
	}

	87% {
		transform:rotate(10deg)scale(1.18)
	}
}

@keyframes particules-pena {
	from {
		background-position:
			4px 52px,
			17px 58px,
			33px 59px,
			11px 106px;
	}

	to {
		background-position:
			51px 9px,
			48px 21px,
			92px 6px,
			84px 39px;
	}
}


body
{
	
	.balise
	{
		&{
			background: white;
			padding: 5px 30px;
			border-radius: var(--borderRadiusS);
			width: fit-content;
			font-size: .8em;
			position: relative;
			padding-right: 20px;
			margin-bottom: 20px
		}
		
		&:before
		{
			content: " ";
			aspect-ratio: 1/1;
			width: 10px;
			background: var(--couleurBTN);
			border-radius: 50%;
			position: absolute;
			left: 10px;
			top: 50%;
			transform: translateY(-50%);
		}
	}
	
	
	main{
		padding-bottom: 20px;
	}
	
	.ena-boring, .pena-boring
	{
		min-width: 160px;
	}
	
	.ena-boring
	{
		background: none;
		border: 1px solid white;
		filter: grayscale();
	}
	
	.pena-boring 
	{
		
		&{
			overflow: hidden;
			font-family: fontBold;
		}
		&:last-child::before {
			content: "";
			z-index: 1;
			opacity: 0.78;
			background-image: radial-gradient(circle, rgb(255, 255, 255) 0px, rgb(255, 255, 255) 2px, rgba(0, 0, 0, 0) 2.6px), radial-gradient(circle, rgb(255, 255, 255) 0px, rgb(255, 255, 255) 1px, rgba(0, 0, 0, 0) 1.8px), radial-gradient(circle, rgb(255, 220, 225) 0px, rgb(255, 220, 225) 1.5px, rgba(0, 0, 0, 0) 2.1px), radial-gradient(circle, rgb(255, 255, 255) 0px, rgb(255, 255, 255) 2.5px, rgba(0, 0, 0, 0) 3px);
			background-position: 4px 9px, 17px 21px, 33px 6px, 11px 39px;
			background-size: 47px 43px, 31px 37px, 59px 53px, 73px 67px;
			position: absolute;
			inset: -70%;
			
			animation: particules-pena 2.5s linear infinite;
			transform: rotate(8deg);
		}

		strong
		{
			animation: emotion-pena 2.8s 1.8s cubic-bezier(.18, .78, .22, 1) infinite;		
		}
	}
}


[data-composant="header"]
{
	/*&{
		position: absolute;
		top: 0;
		color: wheat;
		z-index: 2;
	}*/
	.logo svg{
		.couleur2 path{
			fill:var(--couleurBTN)!important;
		}
	}
}

section[data-composant="banniere-hero"]
{
	h1{
		font-size: 6em
	}
	
	h1 strong
	{
		font-size: 1em;
		position: relative;
		color: var(--couleurBTN2);
	}
	
	h1 strong:after
	{
		content: "";
		position: absolute;
		top: 0px;
		left: 0px;
		z-index: 200;
		background: url(/uploads/images/barrer-blanc.png);
		width: 100%;
		height: 100%;
		background-repeat: no-repeat;
		background-size: 100% 100%;
		opacity: .9;
	}
	
	
}

[data-composant="ImageStickyEtTextes"]
{
	h2{
		font-size: 1.5em;
	}
	h2 strong{
		font-size: 2.5em;
		display: block;
	}
}
#_accueil main > section:not(#banniere)
, #_realisations-enfant main > section:not([data-composant="avant-apres"])
{
	margin: 100px auto;
}

#contact > div{
	background: var(--couleurBTN2);
}

@keyframes masquerTxtsBanniere
{
	from
	{
		opacity: 1;
	}

	to
	{
		opacity: 0;
	}
}

@keyframes paralaxeTexte

{

	from
	{
		translate: 0 -45%;
	}
	to
	{
		translate: 0 -20%;
	}

}

#banniere
{
	
	.slide 
	{
		&:before
		{
			content:unset;
		}
	}
}
	


section[data-composant="banniere-hero"].citation
{
	
	.balise{
		color: initial;
		margin:auto;
	}
	
	.slide {
		&:has(.background):before
		{
			background: rgba(0,0,0,.2);
		}
		
		.txts
		{
			max-width: 100%;
		}
		
		h2{
			color: white;
			font-size: 6em;
		}
	}
	
	
}
[data-composant="Citation"]
{
	&{
		display: grid;
		place-content: center;
		font-size: 3em;
		font-family: var(--fontBold);
	}
	
	blockquote
	{
		text-align:left;
	}
}
#_accueil
{
	
	
	[data-composant="TxtGalerieSlider"]
	{
		&
		{
			background: gray;
			position: relative;
			width: 100%;
			filter: grayscale();
			color: white;
		}
		
		.conteneur{
			width: var(--maxWidth);
			margin: 0 auto;
			padding: var(--padding);
			
		}
		
		h2{
			color: white;
		}
		
		.liste{
			gap: .5em;
		}
		
		& > li{
			padding: 0;
			border-radius: var(--borderRadiusXS);
		}
		
		a{
			color: white;
		}
		
		header{
			height: 70dvh;
			border-radius:var(--borderRadiusXS);
			overflow: hidden;
			width: 100%;
		}
		
		img{
			border-radius:var(--borderRadiusXS);
			border:none;
		}
		
		.main{
			width: 60%;
		}
		
		[data-composant="tags"], .tag
		{
			color: white;
		}
	}
	
	
	#services
	{
		&{
			position: relative;
		}
		
		&:before{
			content: "";
			position: sticky;
			top: 20px;
			background: url("https://static.wixstatic.com/media/e26fa0_019fab707dbe453d809c1b1366f2ef75~mv2.jpg/v1/fill/w_2048,h_961,al_c,q_90,enc_avif,quality_auto/e26fa0_019fab707dbe453d809c1b1366f2ef75~mv2.jpg");
			background-size: cover;
			background-repeat: no-repeat;
			height: calc(100dvh - 40px);
			left: 0;
			display: block;
			border-radius: var(--borderRadius);
			
		}
	}
}