/********************************************************/
/*
/*      Base CSS
/*
/********************************************************/

html, body {
	scroll-behavior: smooth;
	scroll-padding-top: 3rem; 
	width: 100%;
	height: 100%;
	margin-block-start: 0 !important;
	overflow-x: clip;
}

menu {
	padding: 0;
}

.wp-site-blocks {
	
	display: flex;
	flex-direction: column;
	min-height: 100%;
	
	& > :is(main, menu, footer)  {
		width: 100%;

		margin-inline: auto;
	}

	& > main  {
		flex-grow: 2;
		
	}
}

.gform_wrapper {
	.gform_required_legend { 
		display: none;
	}
	
	::file-selector-button {

		color: var(--wp--preset--color--blanc)!important;
		background-color: var(--wp--preset--color--vert)!important;
		cursor: pointer;
	}
	
	.gform-footer button {
		border:none!important;
		background: none!important;
		box-shadow: none!important;
		padding: 0!important;
		

		span {
			
			font-size: var(--wp--preset--font-size--medium-large);
			font-weight: 500;
			line-height: 1.2;
			text-align: left;
			
			&::after{
				font-family:'FontAwesome';
				content:'';
				width:1.4em;
				height:1.4em; 
				font-size:0.8em; 
				text-align:center; 
				line-height:1.4em;
				
				border-radius:50%; 
				aspect-ratio:1;
				display:inline-block; 
				justify-content:center; 
				align-items:center; 
				rotate:45deg; 
				margin-inline-start: 0.5em;
			}
		}
		
		&:is(#gform_submit_button_1) {
			color: var(--wp--preset--color--vert);
			
			& span::after {
				border:2px solid var(--wp--preset--color--jaune); 
			}
			
			&:hover{
				color:var(--wp--preset--color--jaune);
			} 
		}
		
		&:is(#gform_submit_button_2) {
			color: var(--wp--preset--color--balnc);
			
			& span::after {
				border:2px solid var(--wp--preset--color--jaune); 
			}
			
			&:hover{
				color:var(--wp--preset--color--jaune);
			} 
		}
		
	}
}

	


.fillet {
	
	--fillet-width : 1px;
	--fillet-color : var(--wp--preset--color--jaune);
	container-type: inline-size;
	container-name: fillet-container;
	  
	width: 100%;
	max-width: 104rem!important;
		
	& .fillet__ttl {
		max-width:revert;
		margin-inline: 0!important;
		display: grid;
		grid-column: 1/ span 3; 
		grid-row: 1 / span 1;	
		justify-self: stretch;
		
		grid-template-columns: max-content 1fr;
		column-gap: 0.75rem;
		& .wp-block-heading {
			width: max-content!important;
			margin-inline: 0!important;
			
		}
		&::after {
			content:'';
			display: block;
			border-bottom: var(--fillet-width) solid var(--fillet-color );
		}
	}
		
	& .fillet__ctn {
		margin-top : calc(var(--fillet-width)  * -1);
		margin-inline: auto 0!important;
		
		max-width: 36rem;

		& > *  {
			padding-top: 1em;
		}
	}

	
}


.fillet--img:has(.wp-block-image) {
	width: 100%;
	max-width: 104rem!important;
	margin-inline: 0 auto!important;
	display: grid;
	gap: 3rem;
	grid-template-columns: 20rem 1fr;
	
	.wp-block-image {
		align-self: stretch;
		img {
			height: 100%;
			width: 100%;
			object-fit: cover;
		}
	}
	
	.fillet {
		margin-top: 6rem;
	}
	
	@media (width < 1000px) {
		grid-template-columns: 30% 1fr;
	}
	
	@media (width < 760px) {
		.wp-block-image {
			display: none;
		}
		.fillet {
			margin-top: 0rem;
			grid-column: 1 / span 2;
		}
	}
}

@container fillet-container (width < 760px) {
	
	.fillet__ttl::after {
			display: none!important;
	}
	
	.fillet__ctn {
		border-top :var(--fillet-width) solid var(--fillet-color);
		margin-top: 1rem!important;
		margin-inline: 0!important;
		max-width: 100%!important;
	
	}
	
	
}


.equipe_contact {
	
	
	& .value  {
		display: flex;
		flex-direction: column;
		gap : 0.5rem;
		
		a  {
			display: block;
			width: 2rem;
			height: 2rem;
			aspect-ratio: 1;
			border: 2px solid var(--wp--preset--color--jaune);
			border-radius : 50%;
			display: flex;
			justify-content: center;
			align-items: center;
			
			i   {
				font-size: 0.7em;
			}
		}
	}	
}


.wp-block-categories-list {
	padding-inline-start: 0;
	display: flex;
	gap:2rem;
	list-style: none;
	
	.current-cat {
		color:var(--wp--preset--color--jaune);
		border-bottom: 1px solid;
	}
}



.page-template-page-verte {
	background-color: var(--wp--preset--color--vert);
	color: var(--wp--preset--color--blanc);
	
	& :is(h1,h2,h3,h4,h5,h6) {
		color: var(--wp--preset--color--blanc);
			
	}
}

body.single-cke-blogue main  {
	
	header figure img {
		width: 100%;
		height: auto;
		max-height: 32rem;
		object-fit: cover;
	}
	
	h1  {
		font-size: var(--wp--preset--font-size--x-large);
		line-height: var(--wp--custom--line-height--x-large);
	}
	
	h2 {
		
		font-size: var(--wp--preset--font-size--large);
		line-height: var(--wp--custom--line-height--large);
	}
}

