depannage.css
/* ===== PAGE DEPANNAGE ===== */

.depannage{
  padding:10px 0 30px;
}

/* ===== RETOUR ACCUEIL ===== */

.back-home{
  padding:12px 0;
}

.back-home a{
  font-weight:600;
  color:#1a66c7;
}

.back-home a:hover{
  text-decoration:underline;
}

/* ===== BANDEAU ===== */

.depannage-banner{
  width:100%;
  height:320px;
  border-radius:22px;
  margin:10px 0 25px;
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(rgba(13,62,119,.58), rgba(13,62,119,.42)),
    url("images/depannage-bandeau.jpg") center center / cover no-repeat;
  box-shadow:0 14px 30px rgba(0,0,0,.14);
}

.depannage-banner__content{
  position:absolute;
  left:28px;
  bottom:28px;
  color:#fff;
  z-index:2;
}

.depannage-banner__content h1{
  margin:0 0 8px;
  font-size:2.3rem;
  line-height:1.1;
  font-weight:900;
  color:#fff;
}

.depannage-banner__content p{
  margin:0;
  font-size:1.05rem;
  color:rgba(255,255,255,.96);
}

/* ===== CONTENU ===== */

.depannage-box{
  background:#fff;
  border-radius:22px;
  padding:24px;
  box-shadow:0 10px 25px rgba(0,0,0,.08);
}

.depannage-box h2{
  margin-top:0;
  color:#0d3e77;
}

.depannage-list{
  margin:10px 0 20px;
  padding-left:22px;
}

.depannage-list li{
  margin-bottom:8px;
}

.depannage-phone{
  margin-top:15px;
  font-weight:800;
  color:#0d3e77;
}

.depannage-cta{
  margin-top:20px;
  display:flex;
  justify-content:flex-start;
}

@media (max-width:700px){
  .depannage-banner{
    height:230px;
    border-radius:18px;
  }

  .depannage-banner__content{
    left:18px;
    right:18px;
    bottom:18px;
  }

  .depannage-banner__content h1{
    font-size:1.8rem;
  }

  .depannage-banner__content p{
    font-size:.98rem;
  }

  .depannage-box{
    padding:20px;
  }
}