@charset "UTF-8";
/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Equinoxal
 * Author URI: https://equinoxal.fr
 * Template: blocksy
 * Text Domain: blocksy
 */
h2.custom-border {
  position: relative;
}
h2.custom-border:before {
  content: "";
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 30px;
  height: 5px;
  background-color: #30555b;
}
.blk_shadow {
  border-radius: 20px;
  box-shadow: 0 0 20px #00103c20;
  padding: 20px;
}
.blk_green {
  border-radius: 20px;
  background-color: #1C3A28;
  padding: 20px;
  position: relative;
  max-width: 1100px !important;
}
.blk_green p, .blk_green h2 {
  color: white;
}
.blk_green .img_over img {
  position: relative;
  /* Positionnement absolu pour l'image */
  bottom: -20px;
  /* Touche le bas du conteneur */
  width: 100%;
  /* Largeur à 100% du conteneur */
}
.arrow_btn a {
  position: relative;
  display: inline-block;
  color: #30555b !important;
}
.arrow_btn a.wp-block-post-excerpt__more-link {
  padding: 5px 15px 10px 0px;
  text-decoration: none;
}
.arrow_btn a::after {
  content: "";
  position: absolute;
  right: -15px;
  top: 50%;
  width: 20px;
  /* La largeur de votre SVG */
  height: 13.5px;
  /* La hauteur de votre SVG */
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20.243" height="13.501" viewBox="0 0 20.243 13.501"><path d="M20.784,11.51a.919.919,0,0,0-.007,1.294l4.275,4.282H8.782a.914.914,0,0,0,0,1.828H25.045L20.77,23.2a.925.925,0,0,0,.007,1.294.91.91,0,0,0,1.287-.007l5.794-5.836h0a1.026,1.026,0,0,0,.19-.288.872.872,0,0,0,.07-.352.916.916,0,0,0-.26-.64l-5.794-5.836A.9.9,0,0,0,20.784,11.51Z" transform="translate(-7.875 -11.252)" fill="%2330555b"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  transform: translateY(-50%);
  transition: transform 0.3s ease;
}
.arrow_btn a:hover {
  transform: none;
  background-color: transparent !important;
  color: #2A3337 !important;
}
.arrow_btn a:hover::after {
  transform: translateX(10px) translateY(-50%);
}
.cta_infos {
  border: 3px solid #02CC76;
  border-radius: 20px;
  padding: 20px;
  max-width: 650px !important;
}
/* Home */
#poles-exp figure {
  max-width: 200px;
  max-height: 200px;
  margin-bottom: 0;
}
#poles-exp .wp-block-buttons {
  margin-top: 10px;
}
/*Process*/
.process {
  display: flex;
  flex-direction: column;
  position: relative;
  height: 100%;
  justify-content: space-between;
  align-items: flex-start;
}
.process .line {
  position: absolute;
  top: 80px;
  bottom: 80px;
  left: 20px;
  width: 2px;
  background-color: #03AA94;
  z-index: -1;
}
.process .step {
  display: flex;
  align-items: center;
  margin: 10px 0;
  padding: 20px;
  /*  flex: 1; */
  flex-direction: column;
}
.process .step:nth-child(even) .description {
  background-color: #02CC76;
  color: white;
  border-radius: 20px;
  padding: 20px;
}
.process .step:nth-child(odd) .description {
  background-color: white;
  color: #30555b;
  border-radius: 20px;
  padding: 20px;
}
.process .circle {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #02CC76;
  border: 2px solid white;
  color: white;
  font-weight: bold;
  font-size: 18px;
  left: 0px;
  padding-bottom: 5px;
}
.process .title, .process .description {
  flex: 1;
}
.process .title {
  text-align: left;
  margin: 0 0 10px 20px;
  padding: 0 0 0 30px;
  width: 100%;
}
.process .step-image {
  display: none;
}
.process .description {
  text-align: left;
  margin-left: 20px;
  padding: 0 0 0 30px;
}
.checklist {
  list-style-type: none;
  padding-left: 0;
}
.checklist li {
  position: relative;
  padding-left: 50px;
  margin-bottom: 1em;
}
.checklist li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 25px;
  transform: translateY(-50%);
  /* Centrer verticalement */
  width: 44px;
  /* Largeur du SVG */
  height: 44px;
  /* Hauteur du SVG */
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="44" height="44" viewBox="0 0 44 44"><defs><clipPath id="a"><path d="M0-20.878H44v-44H0Z" transform="translate(0 64.878)" fill="%23e2ecec"/></clipPath></defs><g transform="translate(-933 -1238.634)"><g transform="translate(933 1238.634)" clip-path="url(%23a)"><g transform="translate(1.017 1.017)"><path d="M-9.956-19.912A20.983,20.983,0,0,0,11.027-40.9,20.983,20.983,0,0,0-9.956-61.878,20.983,20.983,0,0,0-30.939-40.9,20.983,20.983,0,0,0-9.956-19.912Z" transform="translate(30.939 61.878)" fill="%23e2ecec"/><path d="M-9.956-18.412a22.343,22.343,0,0,1-8.752-1.767A22.406,22.406,0,0,1-25.854-25a22.406,22.406,0,0,1-4.818-7.146A22.343,22.343,0,0,1-32.439-40.9a22.343,22.343,0,0,1,1.767-8.752,22.406,22.406,0,0,1,4.818-7.146,22.406,22.406,0,0,1,7.146-4.818,22.343,22.343,0,0,1,8.752-1.767A22.343,22.343,0,0,1-1.2-61.611a22.406,22.406,0,0,1,7.146,4.818,22.406,22.406,0,0,1,4.818,7.146A22.343,22.343,0,0,1,12.527-40.9a22.343,22.343,0,0,1-1.767,8.752A22.406,22.406,0,0,1,5.942-25,22.406,22.406,0,0,1-1.2-20.18,22.343,22.343,0,0,1-9.956-18.412Zm0-41.966a19.359,19.359,0,0,0-7.583,1.53,19.42,19.42,0,0,0-6.193,4.176,19.42,19.42,0,0,0-4.176,6.193,19.359,19.359,0,0,0-1.53,7.583,19.359,19.359,0,0,0,1.53,7.583,19.42,19.42,0,0,0,4.176,6.193,19.42,19.42,0,0,0,6.193,4.176,19.359,19.359,0,0,0,7.583,1.53,19.359,19.359,0,0,0,7.583-1.53A19.42,19.42,0,0,0,3.82-27.119,19.42,19.42,0,0,0,8-33.312,19.359,19.359,0,0,0,9.527-40.9,19.359,19.359,0,0,0,8-48.478,19.42,19.42,0,0,0,3.82-54.672a19.42,19.42,0,0,0-6.193-4.176A19.359,19.359,0,0,0-9.956-60.378Z" transform="translate(30.939 61.878)" fill="%23fff"/></g></g><path d="M41.415,15,38.869,12.38a.547.547,0,0,0-.4-.174h0a.525.525,0,0,0-.4.174L20.414,30.155l-6.422-6.422a.559.559,0,0,0-.81,0l-2.574,2.574a.576.576,0,0,0,0,.824l8.1,8.1a2.561,2.561,0,0,0,1.692.824,2.684,2.684,0,0,0,1.678-.8h.014L41.429,15.822A.618.618,0,0,0,41.415,15Z" transform="translate(934.263 1230.915)" fill="%2302cc76"/></g></svg>');
  background-size: contain;
  background-repeat: no-repeat;
}
@media (min-width: 768px) {
  .blk_shadow {
    padding: 30px;
  }
  .blk_green {
    border-radius: 20px;
    background-color: #1C3A28;
    padding: 30px;
  }
  .blk_green p, .blk_green h2 {
    color: white;
  }
  .blk_green .img_over img {
    position: absolute;
    /* Positionnement absolu pour l'image */
    top: -30px;
    /* Fait déborder de 20px en haut */
    left: 70%;
    /* Fait déborder de 20px à droite */
    bottom: 0;
    /* Touche le bas du conteneur */
    width: 100%;
    /* Largeur à 100% du conteneur */
    height: calc(100% + 30px) !important;
    object-fit: cover;
    overflow: visible;
  }
  .cta_infos {
    padding: 30px 20px 40px 20px;
  }
  .process {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    height: 100%;
    justify-content: space-between;
  }
  .process .line {
    position: absolute;
    top: 14%;
    bottom: auto;
    height: 74%;
    width: 2px;
    z-index: -1;
    left: calc(50% - 6px);
  }
  .process .step {
    display: flex;
    align-items: center;
    margin: 10px 0;
    padding: 20px;
    flex: 1;
    flex-direction: row;
  }
  .process .step:nth-child(even) .description {
    background-color: #02CC76;
    color: white;
    border-radius: 20px;
    padding: 20px;
  }
  .process .step:nth-child(even) .description h3 {
    color: white;
  }
  .process .step:nth-child(odd) .description {
    background-color: white;
    color: #30555b;
    border-radius: 20px;
    padding: 20px;
    border: 2px solid #02CC76;
  }
  .process .step:nth-child(odd) .description h3 {
    color: #02CC76;
  }
  .process .step-image {
    display: block;
    margin-right: 20px;
  }
  .process .circle {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #02CC76;
    border: 2px solid white;
    color: white;
    font-weight: bold;
    font-size: 30px;
    margin: auto;
  }
  .process .title, .process .description {
    flex: 1;
  }
  .process .title {
    text-align: left;
    margin: 0 20px 0 0;
    padding: 0;
    display: flex;
  }
  .process .title h3 {
    margin: auto 0;
  }
  .process .description {
    text-align: left;
    margin-left: 20px;
    margin-right: -30px;
  }
  #footer p {
    font-size: 16px;
  }
  #footer h2 {
    font-size: 22px;
    color: #2B3338;
    font-weight: 600;
  }
  #footer ul {
    line-height: 2em;
    font-size: 16px;
  }
}
