/* Relooking page formation - à charger APRÈS css/style.css
   Ajuster les 4 couleurs ci-dessous pour les caler sur la charte CFORPRO */
.largeurpage{
  --c-bleu:#1f4e79;
  --c-bleu-clair:#eaf1f8;
  --c-orange:#f08a24;
  --c-texte:#2b3440;
  --c-bord:#d9e2ec;
}

/* Titres */
.largeurpage .contenuformation h1{
  color:var(--c-bleu);
  font-size:2rem;
  line-height:1.2;
  margin:0 0 20px;
  padding-bottom:12px;
  border-bottom:3px solid var(--c-orange);
}
.largeurpage .contenuformation h2{
  color:var(--c-bleu);
  font-size:1.35rem;
  margin:34px 0 12px;
  display:flex;
  align-items:center;
  gap:8px;
}
.largeurpage .contenuformation h3{
  color:var(--c-bleu);
  font-size:1.05rem;
  margin:20px 0 6px;
}
.largeurpage .contenuformation p,
.largeurpage .contenuformation li{
  color:var(--c-texte);
  line-height:1.65;
}
.largeurpage .contenuformation ul{
  padding-left:20px;
}
.largeurpage .contenuformation li{
  margin-bottom:6px;
}

/* Badge TOSA */
.largeurpage .badge-tosa{
  max-width:160px;
  height:auto;
  margin:0 0 10px 20px;
}

/* Bloc résumé */
.largeurpage .contenuformation .resume{
  background:var(--c-bleu-clair);
  border-left:5px solid var(--c-orange);
  border-radius:6px;
  padding:20px 24px;
  line-height:1.9;
  overflow:hidden;
}
.largeurpage .contenuformation .resume span{
  color:var(--c-bleu);
  font-weight:700;
}
.largeurpage .contenuformation .resume img{
  border-radius:6px;
  max-width:100%;
  height:auto;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}

/* Boutons d'action (CPF, programme, calendrier, inscription) */
.largeurpage .clics{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin:24px 0;
}
.largeurpage .clics > div{
  flex:1 1 130px;
  text-align:center;
  background:#fff;
  border:1px solid var(--c-bord);
  border-radius:8px;
  padding:14px 8px 6px;
  float:none;
  margin:0;
  transition:border-color .2s, box-shadow .2s;
}
.largeurpage .clics > div:hover{
  border-color:var(--c-orange);
  box-shadow:0 3px 10px rgba(0,0,0,.1);
}
.largeurpage .clics img{
  height:45px;
  width:auto;
}
.largeurpage .clics p{
  margin:8px 0 6px;
  font-weight:600;
}
.largeurpage .clics a{
  text-decoration:none;
  color:var(--c-bleu);
}

/* Bandeaux "Demande de devis" et "CPF Infos" */
.largeurpage h3.horaires.fdbleu{
  background:var(--c-bleu);
  border-radius:6px;
  padding:12px 18px;
  margin:20px 0;
}
.largeurpage h3.horaires.fdbleu a{
  color:#fff;
  text-decoration:none;
  font-weight:700;
}
.largeurpage h3.horaires.fdbleu a:hover{
  text-decoration:underline;
}

/* Encadrés bleus (test, attestation, certification) */
.largeurpage .cadrebleu{
  background:var(--c-bleu-clair);
  border:1px solid var(--c-bleu);
  border-radius:6px;
  padding:10px 16px;
  font-weight:700;
  color:var(--c-bleu);
}

/* Formulaire de devis */
.largeurpage #ancreform{
  border-radius:8px;
  padding:20px 24px;
}
.largeurpage #ancreform h4{
  line-height:1.4;
}

/* Témoignages */
.largeurpage #temoignages h4{
  color:var(--c-bleu);
  font-size:1.2rem;
  margin:28px 0 12px;
}
.largeurpage .temoignage{
  background:#fff;
  border:1px solid var(--c-bord);
  border-left:4px solid var(--c-orange);
  border-radius:6px;
  padding:14px 18px;
  margin-bottom:14px;
}
.largeurpage .temoignage .citation{
  font-style:italic;
  margin:0 0 8px;
}
.largeurpage .temoignage .temoin{
  font-weight:700;
  color:var(--c-bleu);
  margin:0;
}

/* Mobile */
@media (max-width:640px){
  .largeurpage .contenuformation h1{font-size:1.5rem}
  .largeurpage .badge-tosa{float:none;display:block;margin:0 0 12px}
  .largeurpage .clics > div{flex:1 1 45%}
}

/* Pleine largeur : encadrés bleus, bandeaux et boutons */
.largeurpage .cadrebleu,
.largeurpage h3.horaires.fdbleu,
.largeurpage .clics{
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box;
  float:none !important;
  clear:both;
}
.largeurpage .clics{
  display:flex !important;
}
.largeurpage .clics > div{
  flex:1 1 0 !important;
  min-width:120px;
  width:auto !important;
}
@media (max-width:640px){
  .largeurpage .clics > div{flex:1 1 45% !important}
}
