
.tarifs{max-width:1100px;margin:3rem auto;padding:0 1rem;}
.tarifs h2{text-align:center;margin-bottom:2rem;}
.tarif-group{margin-bottom:2.5rem;}
.tarif-group h3{margin-bottom:.8rem;color:#0d9488;}

.tarif-group table{width:100%;border-collapse:collapse;background:#f8fafc;border-radius:10px;overflow:hidden;}
.tarif-group th,.tarif-group td{padding:.7rem .9rem;text-align:left;border-bottom:1px solid #e5e7eb;}
.tarif-group th{background:#e0f2f1;font-weight:600;}
.tarif-group tr:last-child td{border-bottom:none;}

@media(max-width:768px){
  .tarif-group table, 
  .tarif-group thead, 
  .tarif-group tbody, 
  .tarif-group tr, 
  .tarif-group td, 
  .tarif-group th{display:block;}
  .tarif-group tr{margin-bottom:1rem;border:1px solid #e5e7eb;border-radius:10px;overflow:hidden;}
  .tarif-group td, .tarif-group th{border:none;}
}


@media(max-width:768px){

  /* Masque la ligne d'en-tête du tableau */
  .tarif-group table tr:first-child{
    /* display:none; */
  }

  /* Chaque ligne devient un petit bloc */
  .tarif-group tr{
    display:block;
    margin-bottom:1rem;
    background:#f8fafc;
    border-radius:12px;
    padding:.5rem;
  }

  /* Les cellules deviennent empilées */
  .tarif-group td{
    display:block;
    padding:.6rem .8rem;
    border:none;
  }

  /* La première cellule devient un "titre" visuel */
  .tarif-group td:first-child{
    background:#e0f2f1;
    font-weight:600;
    border-radius:10px;
    margin-bottom:.4rem;
  }

}

@media(max-width:768px){
  .tarif-group td:last-child{
    font-weight:bold;
    color:#0d9488;
  }
}
