.portfolio{
    width: 100%;
}
.title-port{
    text-align: center;
    padding:50px 0; 
    font-size: 3.125rem ;
    padding-left: 300px;
}
.cont-portfolio{
    width: 100%;
    height: auto;
    margin:0 auto 100px auto;
    padding-left: 300px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.item{
  margin: 20px;
  width: 350px;
  height: auto;
  background: #f0f0f0;
  color: #333;
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
  cursor: pointer;
   transform: scale(1);               /* taille normale au départ */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  }

.item:hover {
    transform: scale(1.2); 
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4); 

  }
.cont-img-port{
    width: 100%;
    height: 180px;
    overflow: hidden;
}
.cont-img-port img{
    width: 100%;
    height: auto;
}
.item h3{
    padding:10px 10px 0;
    font-size:1.375rem;

}
.item p{
    padding: 10px 10px 0;

}
.btn-projets{
  display:block;
  width:180px;
  height:50px;
  line-height:50px;
  margin:10px;
  text-align:center;
  color:#333;
  text-decoration:none;
  border:1px solid #333;
  border-radius:3px;
  position:relative;
  overflow:hidden;              
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);   /* discrète au repos */
  transition: background 0.25s, 
              box-shadow 0.3s ease,
              transform  0.2s ease;
}
.btn-projets::before{
  content:'';
  position:absolute;
  top:-60%;                      
  left:-75%;
  width:50%;
  height:220%;
  background:rgba(255,255,255,0.3);
transform: rotate(25deg);
  transition: transform 0.45s ease-out;
}
.btn-projets:hover {
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5); /* l’ombre ici */
}
.btn-projets:hover::before {
  transform: translateX(350%) rotate(25deg);
}
/* media */
 @media screen and (max-width:1300px) {
    .cont-portfolio{
        padding-left: 0;
        
    }
    .title-port{
        font-size: 2.5rem;
        margin: 50px 0px 70px ;
        padding-left: 0;
    }

}
@media screen and (max-width:500px) {
    
        .title-port{
            margin: 10px 0;
            padding: 30px 0;
        }
}