/**
Theme Name: Grégoire CASSAGNEAU
Author: Grégoire CASSAGNEAU
Author URI: https://www.gregoire.cassagneau.fr
Description: Thème réalisé par Grégoire CASSAGNEAU
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gregoire-cassagneau
Template: astra
*/
/* VIDEO YOUTUBE */
.videos-chantier {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}

.video-item {
   width: 280px; /* Largeur adaptée aux Shorts */
    text-align: center;
	margin : 15px;
}

.video-wrapper-youtube {
    position: relative;
    width: 100%;
    padding-top: 177.78%; /* Ratio 9:16 pour le format vertical */
    overflow: hidden;
    border-radius: 12px; /* Coins arrondis pour un meilleur design */
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}

.video-wrapper-youtube iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/* 🎬 Spécifique aux vidéos internes */
.video-wrapper-internal {
    position: relative;
    width: 100%;
    max-width: 600px; /* Ajustable selon le design */
    height: auto;
    overflow: hidden;
    border-radius: 12px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}

.video-wrapper-internal video {
    width: 100%;
    height: auto;
    border-radius: 12px;
}

.video-legende {
    font-size: 14px;
    color: #555;
    margin-top: 10px;
    text-align: center;
}
.video-legende {
    font-size: 14px;
    color: #555;
    margin-top: 10px;
    text-align: center;
}
/* Le Chantier en chiffre */
.chantier-chiffres {
    display: flex;
    flex-wrap: no-wrap;
    justify-content: space-between;
    gap: 15px;
	width:100%;

}
.chiffre-item {
	display: flex;
	flex-direction:column;
	align-items:center;
	align-content:flex-start;
	 justify-content: flex-start;
    text-align: left;
    background:  #0f1972;
    padding: 15px;
    border: 3px solid #0f1972;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
	width:25%;
}
.chiffre-item p {
	margin: 5px;
}
.chiffre-grand {
	/*font-family:'Solitreo', serif; */
    font-size: 35px;
    font-weight: bold;
    color: #ffff;
    margin: 0;
}
.chiffre-description {
	text-align:center;
	font-family:'Solitreo', serif; 
    font-size: 20px;
    color: #ffff;
    margin-top: 5px;
}
/* RELATIONNEL POST */
.relation-posts {
    margin-top: 20px;
    text-align: center;
}
.relation-posts h3 {
    font-size: 20px;
    color: #333;
    margin-bottom: 10px;
}
.relation-list {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}
.relation-item {
    display:block;
    padding: 10px;
 	text-align:center;
    transition: 0.3s;
}
.relation-item .logo-partenaire-contener{
	max-width:250px;
		height:120px;
	display:flex; 
	flex-direction:column; 
	align-items:center; 
	justify-content:center; 
}


.relation-item .relation-logo {
	display:block;
	margin:auto;
 	width: 100%!important;
    height: auto!important;
	margin-bottom:10px;
}
.relation-item h4 {
	font-family: "Montserrat", Sans-serif;
    font-size: 21px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--e-global-color-bf67f1c);
}
.relation-item a {
	padding:5px 10px 0px 10px;
	background-color:var(--e-global-color-bf67f1c);/* bleu marine */
	color:white;
	font-family:'Solitreo', serif; 
	display:inline-block;
    text-decoration: none;

}
/* PREV - NEXT FOR CPT */
.navigation-custom-posts {
    display: flex;
    justify-content: space-around;    
}

.btn-nav {
    display: inline-block;
    padding: 10px 15px;
	margin:0 50px;
    background-color: var(--e-global-color-bf67f1c);
    color: white;
    text-decoration: none;
    border-radius: 0px;
    transition: background 0.3s;
}

.btn-nav.prev-post:hover {
     background-color: var(--e-global-color-5fc0679);
	 color: var(--e-global-color-bf67f1c);
}

.prev-post {
    text-align: left;
}

.next-post {
    text-align: right;
}
.btn-nav.next-post:hover {
	background-color: var(--e-global-color-ee06453);
	color:white;
}
@media only screen and (max-width: 1366px) {
	
}
@media only screen and (max-width: 1200px) {
	.chantier-chiffres {
		 justify-content: center;
	}
	
}
@media (max-width: 1024px) {
	.chantier-chiffres {
		flex-direction:column;
		justify-content: center;
	}
	.chiffre-item {
		min-width:100%;
	}
	.navigation-custom-posts {
		flex-direction:column;
		justify-content: center;    
	}
	.btn-nav {
    display: inline-block;
    padding: 0 5px;
	margin:1px 5px;
}

}
@media (max-width: 880px) {}
@media (max-width: 767px) {}