 /* Header transparent */


 @import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

 .main-header {
      position: absolute;
      top: 40px;
      width: 100%;
      z-index: 10;
    }

    .slider {
      height: 80vh;
      background: url("https://via.placeholder.com/1600x800") center/cover no-repeat;
    }

    .bg-card-image {
      background: url("https://via.placeholder.com/600x400") no-repeat right center;
      background-size: contain;
      border-radius:24px;
    }

 .reason-icon { font-size: 4em; margin-bottom: 20px; }

    .topheader{
        background:#156798;
    }


    .yellowbg{

        background:#F2B50D;
        border:none;
    }

.orangebg{
      background:#E28A31;
      border:none;
}

body{

}

.bluebg{

    background:#156798;
    border:none;
}


.blackbtn{

height:48px;
background:#252525;
border-radius:8px;
font-size:16px;
 font-family: "Fira Sans", sans-serif;
 font-weight:600;
 padding:4px 24px;
 border:none;
}


.btnornage{

height:48px;
background:#E28A31;
border-radius:8px;
font-size:16px;
 font-family: "Fira Sans", sans-serif;
 font-weight:600;
 padding:4px 24px;
 border:none;
 color:#fff;


}

 .btn.btnornage:hover{
    background:#E28A31!important;
    color:#fff!important;
 }
footer {
  background:#0E151B;
  color:#fff;
}


.list-unstyled li a {
  color:#fff !important;
}

.list-unstyled li  {
  color:#fff !important;
}

footer p{

  color:#fff !important;
}


.bg-card-image{
    background: #0e151b;
    color:#fff;

}

footer .text-muted{
  color:#fff !important;
}

.card{
  border:none;
}

.cardorange{
  background:#E28A31;
  border-radius:12px;
  color:#fff;
  background-image:url('../img/transparentenrgy.png');
  background-repeat:no-repeat;
  background-position:6%;

}


.bluesection{
  background:#156798;
}

.bluesection h2{
  color:#fff;
}


.hero-slider {
  min-height: 80vh;
/* background-image: url("../img/bg.png"); */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}

.hero-slider .overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,0.65),
    rgba(0,0,0,0.2)
  );
}
.text-start
{
  text-align: justify!important;
}
.hero-slider h1,
.hero-slider p {
  text-shadow: 0 4px 15px rgba(0,0,0,0.4);
}


.hero-slider .container {
  animation: fadeUp 1s ease;
}

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}



.fisrst_section{
  background:#FBF9F8;
  background-image:url('../img/rightbg.png');
  background-repeat:no-repeat;
  background-position:right;
}


.bgsecond{

background-image:url('../img/left.png');
  background-repeat:no-repeat;
  background-position:left;

}


.title_1 {
  font-size:32px;
  font-weight:bold;
  text-transform:uppercase;
    font-family: "Poppins", sans-serif;
}


h1,h2,h3,h4,h5{
 font-family: "Poppins", sans-serif;

}


p{

   font-family: "Fira Sans", sans-serif;
}


.title_fblack{
  text-transform:uppercase;
  font-size:32px;
  font-weight:bold;

}


.ornagecolor{
  color:#E28A31;
}


.txtd{
  font-size:20px;
  font-weight:300 !important;
}

.btnplus{
height:48px;
background:#fff;
border-radius:8px;
font-size:16px;
 font-family: "Fira Sans", sans-serif;
 font-weight:600;
 padding:4px 24px;
 border:none;
 color:#000;
 line-height:40px;

}
.btn.btn-primary.btnplus:hover, .btn.btn-primary.blackbtn:hover, .btn.btnplus:hover
{
    background:#156798!important;
    color:#ffffff!important;
}

.titlewhite{
  font-size:32px;
  text-transform:uppercase;
  font-weight:bold;
}


.bgdivise{
  background: linear-gradient(
    to bottom,
    #ffffff 0%,
    #ffffff 50%,
    #156798 50%,
    #156798 100%
  );
}


.titlehero{
  font-size:40px;
  text-transform:uppercase;
}


.bgnumber{
  color:#000;
  background:#FCE6C5;
 border-radius: 19px;
    border: 11px solid #fff;
   width: 320px;
    position: absolute;
    right: -70px;
    top: 250px;
    padding: 12px 20px;


}

.fisrst_section .card{
height:320px;
padding-top:2%;
padding-top:14%;

}



.txtvisible{
  font-size:18px;
  font-family: "Fira Sans", sans-serif;
}


.numberchi{

font-size:64px;
font-weight:900;
}

.cust_txt{
    text-align: center;
    font-size: 19px;
    font-weight: bold;
    top: 22px;
    position: relative;
    margin-left: 15px;

}


.nav li a {
  text-transform:uppercase;
  font-size:15px;
  font-weight:600;
}



.dropdown-menu{
  background:rgba(0,0,0,0.8)
}

.dropdown-item{
  color:#fff;
}

.dropdown-item:focus, .dropdown-item:hover{
  background-color:#E28A31;
  color:#fff!important;

}


.nav-link:focus, .nav-link:hover{
  color:#E28A31 !important;
}





.border-start {
  border-left:1px solid #fff !important;
}





.septitle::before {
   content: "";
  position: absolute;
  bottom: -12px;
  left: 50%;
  transform: translateX(-50%);
  width: 150px;
  height: 3px;
  background-color: #E28A31;
}

footer h6{
  font-size:20px;
  font-weight:bold;
  text-transform:uppercase;
   font-family: "Poppins", sans-serif;

}

.border-top{
  border-top: 1px solid #E28A31 !important;
}


footer h6:before{
content: "";
  position: absolute;
  left: -16px;
  top: 0;
  height: 100%;
  width: 3px;
  background-color: #E28A31; /* Bootstrap primary */

}



.navbar-toggler {
  border: none;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='white' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* Mobile menu spacing */
@media (max-width: 991.98px) {
  .navbar-nav .nav-link {
    padding: 12px 10px;
  }
}


@media (max-width: 768px) {

.bgnumber{
height: 50px;
    display: inline-table;
    margin-top: 16px;
    margin-bottom: 16px;
        position: static !important;
        border:0px;
        width:100%!important;



}

.navbar-nav{
  background:#000 !important;
}



.border-start{
  border:none !important;
}




}




@media (max-width: 768px){


.topheader{

  display:none !important;
}

header{
  top:0px !important;
}



}

.banner-bs {
    min-height: 194px;
    background-color: #E28A31;
    background-repeat: no-repeat;
    background-position: right;
    background-size:contain;

  }



  /* badge */
  .banner-badge {
    background-color: #ffff;
    color: #156798;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: 50px;
    font-size: 14px;
    text-transform:uppercase;
  }





  .page_inner header {

    height:85px;
    background:#fff;
  }


  .page_inner .main-header{
    position:relative;
    top:0px;
  }


  .page_inner .nav-link:not(.activebtn){
  color:#000 !important;
  }
  .page_inner .nav-link.activebtn.active{
    color:#ffffff !important;
  }
.page_inner .nav-link.active:not(.activebtn){
    color:#E28A31 !important;
  }

  .banner-text h1{
    text-transform:uppercase;
    font-size:32px;
  }


  .bigtexte h2{
    font-size:36px;
    font-family: "Fira Sans", sans-serif;
    position:relative;
    margin-left:16px;
    margin-top:5%;
  }

.activebtn {
  background:#E28A31;
  color:#fff !important;
  border-radius:4px;
}


.activebtn:hover  {
  background:#E28A31;
  color:#fff !important;
}
  .bigtexte h2:before{
   content: "";
      position: absolute;
      left: -16px;
      top: 0;
      height: 100%;
      width: 6px;
      background-color: #E28A31;
  }


  .bgcontent{
    background:#FBF9F8;
    border-radius:12px;
  }


  .bgcontent h3{
    font-size:24px;
    position:relative;
    text-transform:uppercase;
    font-weight:bold;
    margin-top:24px;
  }

/* 
  .bgcontent h3:before{
    content: "";
      position: absolute;
      bottom: -12px;
      left: 0%;
      width: 100px;
      height: 3px;
      background-color: #E28A31;
  } */


  .text_big{
    font-size:22px;


  }



  .colorblue{
    color:#156798;
  }


  .expertise-desc li{

  list-style-image: url("../img/puce.svg");

  }

  .expertise-desc div:first-child {
    margin-bottom: 1rem;
    font-family: "Fira Sans", sans-serif;
  }

  @media (max-width: 991px){

  .banner-bs{
    background-image:none;
  }

  .bigtexte h1{
    font-size:22px;
  }


  .navbar-toggler{
    background:#156798;
  }


  .page_inner .nav-link{
    color:#fff !important;
  }

 .page_inner .nav-link:not(.activebtn){
  color:#fff !important;
  }
  .page_inner  .navbar-nav{
  padding:8px;
  }

  .page_inner  .banner-text h1{
  font-size:22px;
  }

  }
  @media (max-width: 767.98px) {
    .banner-bs {
        background-image: none !important;
    }
    .img-steg
    {
      width: 390px!important;
    }
    .img-station
    {
      width: 320px!important;
    }
}

.bgmethod {
    background:#FCE6C5;
    border-radius:12px;
  }


  .bgmethod h3{
  font-size:24px;
  text-transform:uppercase;
  font-weight:bold;

  }

  .bgmethod h5{

    font-size:20px;
  }


  .stepper {
    position: relative;
    margin-top:5%;
  }

  .stepper::before {
    content: "";
    position: absolute;
    top: 22px;
    left: 50%;
    right: 50%;
    height: 1px;
    background: #156798;
    z-index: 1;
    display: none;
  }


  .stepper::before {
    left: calc(100% / 8);
    right: calc(100% / 8);
  }

  .step {
    flex: 1;
    position: relative;
    z-index: 2;
  }

  .step-circle {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff;
    color: #E28A31;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 10px;
    border:1px solid #156798;
  }

  .step-label {
    font-size: 14px;
    max-width: 140px;
    margin: auto;
    font-weight:600;
  }


  .bgmethod h3:before  {
      content: "";
      position: absolute;
      bottom: -4px;
      width: 100px;
      height: 3px;
      background-color: #E28A31;
      left: 50%;
    transform: translateX(-50%);
  }


  .bgmethod h5, .bgmethod h3 {
      position:relative;
  }

.economiesteg .bgcontent h3:before , .sectors.bgcontent h3:before
{
  content: "";
      position: absolute;
      bottom: -6px;
      left: 50%;
      transform: translateX(-50%);
      width: 100px;
      height: 3px;
      background-color: #E28A31;
}
  .bgobjectif{
    background:#000;
    border-radius:12px;
    background-image: url('../img/objectif.png');
    background-position:left;
    background-repeat:no-repeat;
  }


  .bgobjectif h3{
    color:#fff;
    text-transform:uppercase;
    font-size: 24px;

      font-weight: bold;
      text-align:center;
      position:relative;
  }



  .bgobjectif h3{
    color:#fff;
    text-transform:uppercase;
    font-size: 24px;

      font-weight: bold;
      text-align:center;
  }



  .bgobjectif h3:before {
      content: "";
      position: absolute;
      bottom: -12px;

      width: 100px;
      height: 3px;
      background-color: #E28A31;
      left: 50%;
    transform: translateX(-50%);
  }



  .bgobjectif ul li{

    background:#fff;
    border:1px solid #E28A31;
    border-radius:8px;
    padding:16px;
  font-weight:500;


      width: 48%;
  }


  .bgobjectif ul{
    padding-left:0px;
     display: flex;
    flex-wrap: wrap;
    gap: 20px;
    list-style: none;
    padding: 0;
  }

  .servbanner{
    background-image:url('../img/service.png');
  }


  .bgservice{
  background:#FBF9F8;

  }

  .boxjaune{
    background:#F2B50D;
    padding:16px;
    border-radius:16px;
    right: -48px;
      position: relative;
      z-index: 0;
  }


  .orngebg{
     background:#E28A31;
  }

  .boxjaune h4{
    color:#fff;
    font-size:16px;
    font-weight:bold;
    margin-top:16px;
  }

  .boxservice{
    background:#fff;
    padding:1rem;
    border-radius:16px;
    position: relative;
      z-index: 9;
  }


  .boxservice p{
    line-height:30px;
  }


  .bginfo{
  background:#FBE9B6;
  border-radius:6px;
  padding:12px;

  }

  .infoorange{
    background:#F6DCC1;
  }


  .infoblue{
    background:#B9D1E0;

  }

  .blueebg{
    background:#156798;
  }




  .bgintervnetion .feature-box{
  background:#fff;
      border-radius: 12px;
      border:1px solid #E28A31;
  }


  .bgintervnetion .feature-box h5{
    color:#E28A31;
    text-transform:uppercase;
    font-weight:600;
  }

  .bgintervnetion .feature-box img{
  width:100%;
  }

  .bgintervnetion .feature-box h5, .bgintervnetion .feature-box p{
  padding:8px 16px;
  }



  .bgintervnetion .feature-box p{
  padding:8px 16px;
  margin-bottom:3px;
  }


  /* .solutionbanner{
    background-image:url('./images/solutionbg.png')
  } */


  .bgsolution{

    background:#FBF9F8;
    border-radius:12px;
  }



  .bgsolution h4{

    text-transform:uppercase;
    font-weight:bold;
    font-size:24px;
    position:relative;
    text-align:center;
  }




  .bgsolution h5{


    font-weight:500;
    font-size:32px;

  }



  .bgsolution h4:before{


  content: "";
      position: absolute;
      bottom: -12px;
      left: 50%;
      transform: translateX(-50%);
      width: 150px;
      height: 3px;
      background-color: #E28A31;
  }


  .boxsolution{

    background:#FCE6C5;
    border-radius:12px;
    min-height:380px;
  }


  .boxsolution h4{

  text-transform:uppercase;
  font-weight:bold;
  position:relative;
  margin-bottom:3rem;

  }


  .boxsolution h4:before{

  content: "";
      position: absolute;
      bottom: -12px;

      width: 150px;
      height: 3px;
      background-color: #E28A31;

  }

  .stat-card { text-align: center; padding: 5px 30px; background:#ffffff; border-radius: 15px; border-left: 5px solid #e28a31;
}
        .stat-number { font-size: 2.5em; font-weight: 700; margin-bottom: 10px; color:#E28A31}
        .stat-label { font-size: 1em; opacity: 0.5; }
  .custom_list li{
    display: flex;
    align-items: center;   /* 👉 centre verticalement */
    gap: 12px;
    margin-bottom: 12px;
  }


  .custom_list{
    padding-left:0px;
  }

  .custom_list li::before{
    content: "";
    width: 18px;
    height: 18px;
    background: url("../img/puce.svg") no-repeat center;
    background-size: contain;
    flex-shrink: 0;
  }


  .bgform{
  background:#FBF9F8;
  background-image:url('../img/contact.png');
  border-radius:16px;
  background-repeat:no-repeat;
  margin-top:2rem;
  margin-bottom:3rem;




  }


  .bgform form{

  padding:2rem;

  }
  .contactbg {

background-image: url('../img/contactbg.png');
}


/* Dropdown hover animation */
.dropdown-hover:hover > .dropdown-menu {
    display: block;
    animation: fadeInDown 0.3s ease-in-out;
}

.dropdown-menu {
    margin-top: 0;
    animation: fadeOut 0.3s ease-in-out;
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(-10px);
    }
}

/* Smooth transition */
.dropdown-menu {
    transition: all 0.3s ease-in-out;
}

.dropdown-item {
    transition: background-color 0.2s ease, padding-left 0.2s ease;
}

.dropdown-item:hover {
    padding-left: 1.5rem;

}

@media (max-width: 768px) {

    .bgobjectif ul li
    {
        width: 100%;
    }
    .apropos-continue {
        padding:26px;

    }
    .stepper {
      flex-direction: column;
      align-items: stretch;
      gap: 0;
    }

    .step {
      flex-direction: row;
      align-items: flex-start;
      text-align: left;
      padding: 20px 0;
      position: relative;
    }

    .step-circle {
      flex-shrink: 0;
      margin: 0 20px 0 0;
    }

    /* .step-label {
      margin-top: 12px;
      text-align: left;
      padding-right: 20px;
    } */

    /* Ligne verticale connectant les cercles */
    .step:not(:last-child)::before {
      content: '';
      position: absolute;
      left: 22px;
      top: 63px;
      width: 1px;
      height: 100%;
      background-color: #156798;
      z-index: 1;
    }
    .step-label {
        font-size: 14px;
        max-width: unset;
        margin: auto;
        font-weight:600;
        position: absolute;
        left: 55px;
        bottom: 30px;
      }
    /* Supprimer la ligne horizontale */
    .step::after {
      display: none;
    }
    .boxjaune
    {
      right: 0px;
    }
  }
.sectors .card img{
  border-radius:5px;
}
.sectors .card:hover{
  transform: translateY(-5px);
  transition: transform 0.3s ease;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}
.sectors .card{
  border-radius:5px;
  width: 450px;
}
.apropos h3::before {
  content: "";
  position: absolute;
  bottom: -12px;
  left: 20%;
  transform: translateX(-50%);
  width: 100px;
  height: 3px;
  background-color: #E28A31;
}
 .service h3::before{
  content: "";
  position: absolute;
  bottom: -12px;
  left: 50%;
  transform: translateX(-50%);
  width: 100px;
  height: 3px;
  background-color: #E28A31;
}
.station3d .bgnumber
{
    width: 225px;
    left: 30%;
    bottom: 9px;
    top:unset;
    right: unset;
}
.station3d .numberchi{
  font-size:18px;
}
.method-box { background: linear-gradient(135deg, #fff3e0 0%, #ffe0b2 100%); padding: 25px; border-radius: 12px; margin: 25px 0; border-left: 5px solid #ff6f00; }
        .method-title { font-size: 1.3em; color: #e65100; font-weight: 700; margin-bottom: 10px; }

        .service .card
        {
          width: 380px;
        }
         .card-icon {
    font-size: 1.8rem;
    margin-bottom: 1.5rem;
    display: block;
  }
    .img-steg
    {
      width: 600px;
    }
     .img-station
    {
      width: 500px;
    }
    .mx-md-8
    {
      margin-left: 8rem!important;
      margin-right: 8rem!important;
    }