/*-----------------------------------------------------------------------------

Atelier__85 CSS 

-------------------------------------------------------------------------------

By Nicolas EVARISTE (https://www.atelier85.fr)
© 2025 - All rights reserved - Toute reproduction interdite

------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
 Structure
------------------------------------------------------------------------------*/
header{
	padding-bottom: 0px;
}
main{
	
}
footer{
	margin-top: 0px;
}
header,
main,
footer{
	
}

/*-----------------------------------------------------------------------------
 Header
------------------------------------------------------------------------------*/
header{
	background: url("../img/bg-header.svg") top center;
	background-repeat: no-repeat;
    /*background-size: 100% auto;*/
}

/* Logo
--------------------------------------------------*/
div#logo{
	text-align: center;
	padding-top: 30px;
	padding-bottom: 50px;
}
div#logo img{
	width: 250px;
	height: auto;
}

/* Menu
--------------------------------------------------*/
div#menu-icon{
	display: none;
}
ul#menu{
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: flex;
	text-align: center;
	justify-content: center;
	font-family: var(--font-2);
	font-weight: 700;
}
ul#menu li{
	position: relative;
}
ul#menu li a{
	display: block;
	width: 100%;
	position: relative;
	text-decoration: none;
	padding: 8px 25px; 
	color: var(--coul-1);
	font-size: 28px;
}
ul#menu li:hover a,
ul#menu li a:hover,
ul#menu li.current-menu-item a,
ul#menu li.current-post-parent a{
	color: var(--coul-1);	
}
ul#menu li a::after{
    content: '';
    display: block;
	position: absolute;
	bottom: -10px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
    transition: all 300ms;
	opacity: 0;
	width: calc(100% - 30px);
	height: 3px;
	background: var(--coul-1);
}
ul#menu li a:hover::after,
ul#menu li:hover a::after,
ul#menu li.current-menu-item a::after,
ul#menu li.current-post-parent a::after,
ul#menu li.current-menu-parent a::after{
	opacity: 1;
	bottom: 0;
}
ul#menu li.social a img{
	width: 25px;
	height: auto;
}
ul#menu li.social a img.social-resp{
	display: none;
}

/* Menu principal - Drodown
--------------------------------------------------------------------*/
@keyframes sub-menu-anim {
    from {margin-top: 30px; opacity: 0;}
    to {margin-top: -3px; opacity: 1;}
}
span.bt-dropdown{
	display: none;	
}
header nav div#menu-content ul#menu li ul{
	display: none;
	position: absolute;
	min-width: 350px; 
	margin-left: 15px;
	margin-top: -3px;
	padding: 0px 0;
	text-align: left !important;
	animation-name: sub-menu-anim;
    animation-duration: 300ms;
	z-index: 9999;
	background: var(--coul-1);
}
header nav div#menu-content ul#menu li:hover ul{
	display: block;
	position: absolute;
}
header nav div#menu-content ul#menu li ul li{
	display: block;
	width: 100%;
}
header nav div#menu-content ul#menu li ul li a{
	display: block;	 
	padding: 8px 15px;
	color: var(--coul-blanc) !important;
	
	font-family: var(--font-1) !important;
	font-size: 17px !important;
	font-weight: 300 !important;
}
header nav div#menu-content ul#menu li ul li a:hover,
header nav div#menu-content ul#menu li ul li.current_page_item a{
	background: #5d4391;
}
header nav div#menu-content ul#menu li:hover ul li a::after{
	width: 0px;
}

/*-----------------------------------------------------------------------------
 Footer
------------------------------------------------------------------------------*/
footer{
	padding-top: 300px;
	padding-bottom: 20px;
	background: url("../img/bg-footer.svg") center top var(--coul-1);
	background-repeat: no-repeat;
    background-size: 100% auto;
	text-align: center;
	color: #fff;
}
footer strong{
	/*font-size: 20px;*/
}
footer div#copyright{
	font-size: 13px;
	text-align: center;
	padding-top: 80px;
}

/*-----------------------------------------------------------------------------
 Home
------------------------------------------------------------------------------*/

/* Slider
--------------------------------------------------*/
#slider-home{
	padding-top: 50px;
}

/* Titre
--------------------------------------------------*/
#titre-home{
	padding: 50px;
	text-align: center;
	position: relative;
}
#titre-home h1{
	font-family: var(--font-2);
	font-weight: 700;
	font-size: 50px;
	line-height: 1.2;
	color: var(--coul-2);
}

/* Présentation
--------------------------------------------------*/
#presentation{
	padding: 50px 0;
	padding-bottom: 100px;
}
#presentation-photo{
	text-align: center;
}
#presentation-logos{
	text-align: center;	
	padding-top: 50px;
}
#presentation-logos img{
	width: 230px;
	height: auto;
}

/* Infos
--------------------------------------------------*/
#infos{
	background: var(--coul-3);
	padding: 100px 0;
	padding-top: 50px;
}
.infos-item{
	max-width: 230px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
.infos-item h2{
	padding-top: 20px;
	font-family: var(--font-2);
	font-weight: 700;
	font-size: 30px;
	line-height: 1.2;
	color: var(--coul-1);
}

/* Illustrations
--------------------------------------------------*/
div#illustration-01{
	width: 300px;
	position: absolute;
	top: 0px;
}
div#illustration-02{
	width: 300px;
	position: absolute;
	top: -80px;
	right: 40px;
}

/* Nos produits
--------------------------------------------------*/
#nos-produits{
	position: relative;
	padding: 100px 0;
}
#nos-produits h2.titre-1{
	padding-bottom: 60px;
}
div.produit-item{
	text-align: center;
}
div.produit-item div.produit-item-photo{
	
}
div.produit-item h3{
	padding-top: 20px;
}
div.produit-item h3 a{
	font-family: var(--font-2);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.1;
	color: var(--coul-2);
	text-decoration: none;
}

/* Actualités
--------------------------------------------------*/
#actualites{
	position: relative;
	padding: 100px 0;
	background: var(--coul-4);
}
.slider-slide-2{
	padding-top: 60px;
}
.slider-slide-2 div.item{
	padding-left: 2px;
}
.slider-slide-2 div.item div.actu-infos{
	
}
.slider-slide-2 div.item div.actu-infos h3{
	padding-top: 10px;
	font-size: 35px !important;
	line-height: 1.1;
	font-weight: 700;
	font-family: var(--font-2);
	color: var(--coul-1);
}
.slider-slide-2 div.item div.actu-infos small{
	
}
.slider-slide-2 div.item div.actu-infos div{
	
}
.slider-slide-2 div.item div.actu-infos a.bt{

}
  
/*-----------------------------------------------------------------------------
 Pages
------------------------------------------------------------------------------*/
.page,
.category,
.single{
	padding: 50px 0 100px 0;
}
.page h1{
	padding-top: 10px;
	padding-bottom: 50px;
}
.contenu-page{
	
}
.contenu-page h2{
	font-family: var(--font-2);
	font-weight: 700;
	font-size: 40px;
	line-height: 1.2;
	color: var(--coul-2);
	padding-top: 30px;
}
.contenu-page h3{
	font-family: var(--font-2);
	font-weight: 700;
	font-size: 34px;
	line-height: 1.2;
	color: var(--coul-1);
	padding-top: 30px;
}
.contenu-page a{
	display: inline-block;
	position: relative;
	color: var(--coul-2);
	text-decoration: none;
}
.contenu-page a:hover{
		
}
.contenu-page a::after{
    content: '';
    display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 1px;
	margin-left: auto;
	margin-right: auto;
    transition: all 300ms;
	opacity: 0;
	width: 0;
	height: 1px;
	background: var(--coul-2);
}
.contenu-page a:hover::after{
	opacity: 1;
	width: 100%;
}
.contenu-page .wp-block-image a::after{
	display: none;
}
.contenu-page .wp-block-image{
	overflow: hidden;
}
.contenu-page .wp-block-image a img{
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
.contenu-page .wp-block-image a img:hover{
	transform: scale(1.1);
}

/*-----------------------------------------------------------------------------
 Actualités
------------------------------------------------------------------------------*/

/* Liste articles
--------------------------------------------------*/
div.liste-articles{
	padding-top: 60px;
}
div.liste-articles hr{
	display: block;
	background-color: var(--coul-1);
	height: 1px;
	border: 0;
	width: 100%;
	margin-top: 55px;
	margin-bottom: 55px;
	margin-left: 0;
}
div.liste-articles div.actu-photo{
	width: 475px;
	display: inline-block;
	vertical-align: top;
}
div.liste-articles div.actu-infos{
	width: calc(100% - 500px);
	display: inline-block;
	vertical-align: top;
	padding-left: 30px;
}
div.liste-articles div.actu-infos h3{
	padding-top: 10px;
	font-size: 23px;
	font-size: 40px !important;
	font-weight: 700;
	line-height: 1.1;
	font-family: var(--font-2);
	color: var(--coul-1);
}

/* Pagination
--------------------------------------------------*/
div.nav-links{
	text-align: center;
	font-size: 18px;
	padding-top: 20px;
}
div.nav-links span.page-numbers.current{
	display: inline-block;
	color: var(--coul-1);
	text-decoration: none;
	padding: 5px 15px;
	margin-left: 5px;
	margin-right: 5px;
}
div.nav-links a.page-numbers{
	display: inline-block;
	background: var(--coul-1);
	color: #fff;
	text-decoration: none;
	padding: 5px 15px;
	margin-left: 2px;
	margin-right: 2px;
}
div.nav-links a.page-numbers:hover{
	background: var(--coul-2);
}
div.nav-links a.next.page-numbers,
div.nav-links a.prev.page-numbers{
	color: var(--coul-1);
	background: none;
}
div.nav-links a.next.page-numbers:hover,
div.nav-links a.prev.page-numbers:hover{
	text-decoration: underline;
}

/* Article
--------------------------------------------------*/
div.bt-back{
	text-align: center;
	padding-top: 60px;
}
div.bt-back button{
	font-size: 18px !important;
	font-family: var(--font-1);
}