.align-right-text{
	right: 0!important;
}


.projets-grid{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
}




/*fiktion*/
html #projet{
	background-color: #ffffff!important;

}

#header-projet {
 background-image: linear-gradient(180deg, 
      rgba(22, 23, 168, 1) 0%, 
      rgba(22, 23, 168, 0.7) 40%, 
      rgba(22, 23, 168, 0.3) 70%, 
      rgba(255, 255, 255, 0) 100%);
    position: fixed !important;
    top: 0;
    z-index: 999;
    width: 100%;
}

.navbar-projets{
    display: flex;
    justify-content: space-between;
    align-items: center; /* Centrage vertical */
    height: 100px; /* Ajuste la hauteur de la navbar */
    margin:auto;
    width: 95%;
}

.uk-navbar-nav .nav-font-projet a {
    color: white;
    font-family: "Satoshi-regular";
    text-transform: none; /* Désactive la transformation en majuscule */
    font-size: 1vw;
    transition: text-shadow 0.3s ease, color 0.3s ease, filter 0.3s ease, padding 0.3s ease; /* Ajoute une transition douce */
}

.uk-navbar-nav .nav-font-projet a:hover {
    text-shadow: 0 0 10px white, 0 0 20px white, 0 0 30px white, 0 0 40px white; /* Effet de halo autour du texte */
    color: white;
}

.bouton-projet{
    font-size: 1.2vw;
    font-family: "Satoshi-Italic",sans-serif;
    border: 1px solid #1617A8;
    padding: 0px 10px;
    display: inline-block;
    text-transform: uppercase;
    color: #1617A8!important;
}

@media only screen and (max-width: 768px) {
.bouton-projet {
font-size: 3.5vw;
margin-bottom: 10px;
}
}

.bouton-projet:hover{
    background-color: #1617A8!important;
    padding: 0px 10px;
    display: inline-block;
    text-transform: uppercase;
}

a.projet-prec{
	color: #1617A8!important;
}

a.projet-prec:hover{
	color: white!important;
}



.description {
  display: flex;
  align-items: flex-end;
  gap: calc(100% / 6); /* 1/6 d'espace entre */
  margin: 2% auto 1% auto!important;
}

.colonne-gauche {
  flex: 0 0 calc(100% * 2 / 6);
}

.colonne-droite {
  flex: 0 0 calc(100% * 3 / 6);
}


/* Responsive : empile les colonnes sur mobile */
@media screen and (max-width: 768px) {
  .description {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
    margin: 0% auto 1% auto!important;
  }

  .colonne-gauche,
  .colonne-droite {
    flex: auto;
    width: 100%;
    margin-top: 2%!important;
  }
}


.scroll-container {

            overflow-x: auto; /* Active le scroll horizontal */
            overflow-y: hidden; /* Désactive le scroll vertical */
            display: flex;
            scroll-behavior: auto; /* Comportement naturel */
            white-space: nowrap;
            scrollbar-width: none;
        }


 /* Masquer la barre de scroll pour un effet plus propre */
.scroll-container::-webkit-scrollbar {
    display: none;
}

.image-container {
    display: flex;
    gap: 20px;
}

@media screen and (min-width:768px){

    .image-container img {
        height: auto;
        max-height: 454px;
        width: auto;
        max-width: 100%;
        object-fit: cover;
    }

     h2.titre-projet-h2-mode{
    font-size: 3.2vw!important;
}

}

@media screen and (max-width: 768px) {
 .image-container {
    height: 55vh; /* 80% de la hauteur du viewport */
    width: auto;
    gap: 10px;
    margin-bottom: 3%;
  }

  .image-container img {
    object-fit: cover;
    width: 100%;
    height: 100%;
  }


h2.titre-projet-h2{
    font-size: 9vw!important;
}

.image-container {
    gap: 10px;
  }

  .margintopresp{
    margin-top: 30%!important;
  }

    .titre-projet{
        padding: 1%;
        margin:auto;
    }
    .texte-projet{
        padding: 5%;
        margin:auto;
    }
  
}
.svg-fleches{
    position: absolute; 
    width: 0; 
    height: 0;
}





/*bouton retour*/

.btn-circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 1px solid #1617A8;
  border-radius: 50%;
  background-color: #ffffff;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: none;
}

.btn-circle svg {
  transition: all 0.3s ease;
  stroke: #1617A8;
}

.btn-circle:hover {
  background-color: #1617A8;
  box-shadow: 0 0 10px #868CEF, 0 0 20px #868CEF, 0 0 30px #868CEF, 0 0 40px #868CEF;
    transform: translateX(2px);
}

.btn-circle:hover svg {
  stroke: #ffffff;
}



    .nav-projets {
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 95%;
    }

.next-project {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: #1617A8;
  font-family: "Satoshi-medium", sans-serif;
  font-size: 1.2vw;
  transition: all 0.3s ease;
}

.next-project svg {
  margin-left: 8px;
  transition: all 0.3s ease;
  stroke: #1617A8;
}

.next-project:hover {
text-shadow: 0 0 10px #868CEF, 0 0 20px #868CEF, 0 0 35px #868CEF, 0 0 50px #868CEF; /* Effet de halo autour du texte */
text-decoration: none;
color: #1617A8!important;
  transform: translateX(2px);
}

.next-project:hover svg {
  transform: translateX(2px);
}

@media screen and (max-width: 768px) {
  .next-project {
    font-size: 3.5vw;
  }
}

.next-project-l {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: #1617A8;
  font-family: "Satoshi-medium", sans-serif;
  font-size: 1.2vw;
  transition: all 0.3s ease;
}

.next-project-l svg {
  margin-right: 8px; /* la flèche est maintenant à gauche du texte */
  transition: all 0.3s ease;
  stroke: #1617A8;
}

.next-project-l:hover {
  text-shadow: 0 0 10px #868CEF, 0 0 20px #868CEF, 0 0 35px #868CEF, 0 0 50px #868CEF;
  text-decoration: none;
  color: #1617A8!important;
  transform: translateX(-2px); /* décalage vers la gauche au hover */
}

.next-project-l:hover svg {
  transform: translateX(-2px); /* décalage de la flèche vers la gauche */
}

@media screen and (max-width: 768px) {
  .next-project-l {
    font-size: 3.5vw;
  }

.nav-projets{
    margin: 0 auto 7% auto;
}

.paragraphe-desc{
    font-family: "Satoshi-LightItalic",sans-serif;
    color: #ffff;
    font-weight: 100;
    font-style: normal;
    font-size: 15px!important;
    line-height: 1.2;
    text-transform: none;
}
 


}


@media screen and (min-width: 768px){
    .nav-projets{
        margin: 5% auto 1% auto!important;
  }

    .footer-hidden{
    display: none;
}


}




/*menu projet*/
.ligne-images {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  gap: 10px; /* ou la valeur que tu veux pour la gouttière */
}

.ligne-images img {
  height: auto;
  width: auto;
  max-width: 100%;
}

@media screen and (max-width: 768px) {
  .ligne-images a:nth-child(2),
  .ligne-images a:nth-child(3) {
    display: none;
  }
  .main-project-section{ 
    margin-top:100px!important;

.projets-hidden-small{
display: none;
}

}


#blanc{
  background-color: white;
}