.gradient_ali{
background: radial-gradient(circle at 75% 75%, #0a3d91 0%, #061c33 60%, #050f1f 100%)!important;
}
.grid-cas .el-item {
  position: relative;
  padding-top: 200px; /* espace réservé à l'image */
  overflow: hidden;
  border-radius: 20px;
}

/* image sprite */
.grid-cas .el-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%; /* s’adapte au conteneur */
  height: 180px;
  background-image: url('/wp-content/uploads/2025/07/spriteillgrid.jpg');
  background-repeat: no-repeat;
  background-size: 100% 540px; /* scale automatique */
  border-top-left-radius: 17px;
  border-top-right-radius: 17px;
  z-index: 0;
}

/* Positionnements individuels */
.grid-cas .uk-grid > div:nth-of-type(1) .el-item::before {
  background-position: 0 0;
}
.grid-cas .uk-grid > div:nth-of-type(2) .el-item::before {
  background-position: 0 -180px;
}
.grid-cas .uk-grid > div:nth-of-type(3) .el-item::before {
  background-position: 0 -360px;
}

/*******/
#gridcirclesprite .el-item {
  position: relative;
  padding-top: 270px; /* espace réservé pour l'image + marge */
  overflow: hidden;
}

/* Image sprite circulaire */
#gridcirclesprite .el-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 250px;
  height: 250px;
  background-image: url('/wp-content/uploads/2025/07/spritecircle.png');
  background-repeat: no-repeat;
  background-size: 750px 250px;
  z-index: 0;
  border-radius: 50%; /* bonus visuel si tu veux forcer l’effet cercle */
}

/* Sprite 1 : éco-conception */
#gridcirclesprite .uk-grid > div:nth-of-type(1) .el-item::before {
  background-position: 0 0;
}

/* Sprite 2 : IA raisonnée */
#gridcirclesprite .uk-grid > div:nth-of-type(2) .el-item::before {
  background-position: -250px 0;
}

/* Sprite 3 : neurosciences */
#gridcirclesprite .uk-grid > div:nth-of-type(3) .el-item::before {
  background-position: -500px 0;
}


#blueline {
  position: relative;
  padding-top: 100px; /* ajuste selon la hauteur désirée */
  z-index: 1;
}

/* La ligne bleue */
#blueline::before {
  content: "";
  position: absolute;
  top: 60px; /* positionné en haut de la section */
  left: 0;
  width: 100%;
  height: 120px; /* hauteur de la ligne bleue */
  background-color: #2d4b9a; /* bleu */
  z-index: 0;
}

