/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.3.0.1741973049
Updated: 2025-03-14 18:24:09

*/
/*Section horizontale*/
.section_h .panel #btnRDV{
    border: 2px solid #1C1C1C;
    border-radius: 20px;
}

.section_h .panel #btnRDV:hover{
    border: 2px solid white;
    border-radius: 20px;
}

/* Conteneur des produits */
.products-container {
    display: flex;
  	flex-wrap: wrap;
  	margin: -10px; /* pour compenser les marges internes */
  	max-width: 1200px;
  	margin-left: auto;
  	margin-right: auto;
}

/* Conteneur de chaque produit */
.product-item {
	width: calc(33.333% - 20px); /* 3 cartes par ligne avec 20px d’espace total */
  	margin: 10px; /* espacement horizontal ET vertical */
  	box-sizing: border-box;

  	background: #fff;
  	padding: 20px;
  	border-radius: 20px;
  	box-shadow: 0 4px 12px rgba(0,0,0,0.1);

  	display: flex;
  	flex-direction: column;
  	justify-content: space-between;
	
	cursor: pointer;
}

.product-item:hover {
	background-color: #1C1C1C;
}
.product-item:hover .product-tag{
	color: #FFFFFF;
}
.product-item:hover #btnInteret button{
	color: #FFFFFF;
	border: 2px solid #FFFFFF;
}
.product-item:hover #btnInteret button:hover{
	color: #1C1C1C;
	background-color: #FFFFFF;
	border: 2px solid #1C1C1C;
}

.product-item .corner-img {
  position: absolute;
  top: -1px;
  left: -2px;
  width: 55px;
  height: 55px;
  object-fit: cover;
}

.product-item img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Titre du produit */
.product-title {
    font-size: 18px;
  	font-weight: bold;
  	margin-top: 10px;
  	word-break: break-word;      /* évite que les mots longs débordent */
  	line-height: 1.2;
 	min-height: 50px;
}
/* Ligne dégradée */
.gradient-line {
    height: 2px;
    background-image: url('https://sitedemo.annapurnasolution.fr/wp-content/uploads/2025/03/ligne.svg'); 
    background-repeat: no-repeat;
    width: 200px; 
}
/* Bouton "ça m'intéresse" */
#btnInteret button{
	color: #1C1C1C;
	border: 2px solid #1C1C1C;
	border-radius: 20px;
	margin-top: 5px;
	margin-bottom: 10px;
}
#btnInteret button:active,#btnInteret button:focus, #btnInteret button:hover{
	color: #FFFFFF;
	background-color: #1C1C1C;
	border: 2px solid #FFFFFF;
}

.product-item .bottom-img {
  position: absolute;
  bottom: 15px;
  right: 15px;
  width: 40px;
  height: 40px;
  background-image: var(--normal-img);
  background-size: contain;
  background-repeat: no-repeat;
  /*transition: background-image 0.3s ease;*/
}
.product-item:hover .bottom-img {
  background-image: var(--hover-img);
}

/* Liste des étiquettes */
.product-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 5px;
}

.product-tag {
    /*color: white;*/
    padding-right: 5px;
    font-size: 12px;
}

.product-image{
	position: relative;
	width: 200px;
}
.product-image .product-img-circle{
	display: block;
}
.product-image .sOverlay{
	position: absolute;
  	top: 0;
  	left: 0;
  	right: 0;
  	bottom: 0;
  	background-color: rgba(0, 0, 0, 0.5); /* Couleur noire avec opacité */
  	color: white;
  	display: none;
  	justify-content: center;
  	align-items: center;
  	text-align: center;
}
.product-image:hover .sOverlay {
  display: flex;
}


/*Fiche produit*/
#containImage{
	position: relative;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
}
.wpr-product-title, .wpr-product-description h2{
	margin:0px 0px 10px 0px;
	padding:0;
	display: inline-block;
	background: linear-gradient(to right, #68B5E3, #83C2CE, #6CB080);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.wpr-product-description h2:before{
	content: "";
	display: block;
	width: 80px; /* Largeur du trait */
    height: 2px; /* Hauteur du trait */
	background: linear-gradient(to right, #68B5E3, #83C2CE, #6CB080);
	margin-top: 25px;
	margin-bottom: 5px;
}

/*Services dans le modèle des domaines*/
.articles-flex-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: normal;
	align-items: center;
	padding: 20px;
	gap: 40px;
}
.article-item {
	width: 350px;
	height: 215px;
	padding: 15px;
	flex: 0 0 calc(33.333% - 40px); /* 3 par ligne avec espace */
	box-sizing: border-box;
	
	background: #fff;
	border-radius: 20px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	margin-right: 40px;
	margin-bottom: 40px;
	
	overflow: hidden;
}
.article-item:hover{
	background-color: #1C1C1C;
}
.article-item .service_tag{
	width: 28px;
	height: 72px;
    position: relative;
    top: -15px;
    right: -265px;
}
.article-item:hover p{
	color: #FFFFFF;
}
.article-item h3 {
	margin-top: -20px;
	font-size: 1.2em;
	margin-bottom: 15px;
	background: linear-gradient(to right, #68B5E3, #83C2CE, #6CB080);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.article-item p {
	font-size: 0.80em;
	line-height: 1.4;
	margin-top: 10px;
}
#lienDemandeDevis{
	text-align: center;
}
#lienDemandeDevis button{
	color: #1C1C1C;
	border: 1px solid #1C1C1C;
	border-radius: 20px;
	margin-top: 5px;
	margin-bottom: 10px;
	margin-top: -5px;
}
#lienDemandeDevis button:active,#lienDemandeDevis button:focus, #lienDemandeDevis button:hover{
	color: white;
	background-color: #1C1C1C;
}

.article-item:hover #lienDemandeDevis button{
	color: #FFFFFF;
	border: 2px solid #FFFFFF;
}
.article-item:hover #lienDemandeDevis button:hover{
	color: #1C1C1C;
	background-color: #FFFFFF;
	border: 2px solid #1C1C1C;
}
.article-item .corner-img {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 55px;
  height: 55px;
  object-fit: cover;
}
.article-item .bottom-img {
  position: absolute;
  bottom: -1px;
  right: -24px;
  width: 60px;
  height: 60px; 
  /*transition: background-image 0.3s ease;*/
}

/*Contact*/
.contactH2{
	display: inline-block;
	background: linear-gradient(to right, #68B5E3, #83C2CE, #6CB080);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

/*Footer*/
.elementor-9607 .elementor-element.elementor-element-55e5efd .elementor-repeater-item-c84bdb8.elementor-social-icon svg{
	fill: #FFFFFF;
}

@media (max-width: 768px) {
    .product-item {
        width: 100%; /* Affichage en 1 colonne pour les mobiles */
    }
    .products-container {
        justify-content: center; /* Centre les éléments sur les petits écrans */
    }
	
	/*Services dans domaine*/
	.article-item {
	    flex:1;
	}
	.article-item .service_tag{
		right: -245px;
	}
	
	/* bloc en ce moment - formation */
	.btnuser{
    	height: 180px;
	}
}