/* Fichier genere par app:styles:assembler depuis assets/styles/ : ne pas modifier a la main (App\Gabarit\FeuillesSite). */
.titre-page .pastille{margin-top:16px}
.titre-page .pastille + h1{margin-top:0;max-width:20ch}
.page-pro .titre-page .chapo{max-width:66ch}
.page-pro>.env{position:relative;z-index:1;padding-top:54px;padding-bottom:32px}
.page-pro .bloc{background:var(--blanc);border-radius:var(--r-grand);padding:26px 22px;margin-bottom:26px;display:block;height:auto}
.page-pro .bloc-tete{margin-bottom:16px;display:block}
.page-pro .bloc-tete h2{margin:0}
.page-pro .bloc-tete--illus{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px}
.page-pro .bloc-tete--illus .illus{height:120px;width:auto}
.selecteur{margin:0 0 26px;min-width:0}
.panneau{background:var(--blanc);border-radius:var(--r-grand);padding:26px 22px;margin-top:16px;box-shadow:var(--ombre);scroll-margin-top:20px}
.panneau h2{margin-bottom:.3em}
.panneau .accroche{font-size:1.08rem;max-width:68ch}
.panneau-tete{display:flex;flex-wrap:wrap;gap:18px 32px;align-items:center}
.panneau-tete>div{flex:1 1 340px;min-width:0}
.panneau-tete .accroche{margin-bottom:0}
.panneau-tete .illus{flex:0 0 auto;height:220px;width:auto;max-width:100%}
.listes{display:grid;gap:20px;grid-template-columns:minmax(0,1fr);margin-top:20px}
.liste{min-width:0}
.liste h3{font-family:var(--sans);font-size:.98rem;color:var(--vert-fonce);margin-bottom:.7em}
.liste ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.liste li{padding:12px 14px 12px 40px;border-radius:var(--r-petit);background:var(--creme);position:relative;font-size:.98rem}
.liste li::before{content:"";position:absolute;left:14px;top:19px;width:12px;height:12px;border-radius:4px;background:var(--vert)}
.encadre{background:var(--vert-pale);border-radius:var(--r);padding:18px 20px;margin-top:20px;font-size:.98rem}
.encadre p{margin:0}
.encadre p+p{margin-top:.6em}
.panneau .suite{margin-top:22px}
.page-pro .intro-illustree{display:flex;flex-wrap:wrap;gap:22px;align-items:center;margin-bottom:16px}
.page-pro .intro-illustree p{flex:1 1 280px;margin-bottom:0;min-width:0;max-width:70ch}
.page-pro .intro-illustree .medaillon{flex:0 0 auto;width:auto;height:200px;max-height:none}
.deux{display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
.carte-simple{background:var(--vert-pale);border-radius:var(--r);padding:20px}
.carte-simple h3{margin-bottom:.25em}
.carte-simple p{margin:0;font-size:.97rem}
.lien-formations{margin:18px 0 0}
.etapes-pro{list-style:none;margin:0;padding:0;display:grid;gap:14px;grid-template-columns:minmax(0,1fr);counter-reset:e}
.etapes-pro li{background:var(--creme);border-radius:var(--r);padding:20px 18px 18px;font-size:.98rem;color:var(--texte-doux)}
.etapes-pro li::before{
  counter-increment:e;content:counter(e);display:flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;background:var(--vert-fonce);color:#fff;font-weight:700;margin-bottom:12px;
}
.etapes-pro strong{display:block;color:var(--anthracite);font-size:1.05rem;margin-bottom:4px}
.contact-pro{background:var(--vert-profond);color:#fff;border-radius:var(--r-grand);padding:30px 24px;margin-bottom:26px;position:relative;overflow:hidden;scroll-margin-top:20px}
.contact-pro h2{color:#fff}
.contact-pro p{color:#EDF3EB;max-width:64ch}
.contact-pro .contact-bouton{margin-bottom:0}
.contact-pro .direct{font-size:.97rem;margin:16px 0 0;overflow-wrap:anywhere}
.contact-pro .direct a{color:var(--vert-clair)}
.contact-pro .bouton:focus-visible,.contact-pro a:focus-visible{outline-color:#fff}
.page-pro .retour{margin:0}
@media (min-width:700px){
  .listes{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
  .deux{grid-template-columns:repeat(2,minmax(0,1fr))}
  .etapes-pro{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:900px){
  .page-pro>.env{padding-top:72px;padding-bottom:40px}
}
@media (min-width:1000px){
  .panneau{padding:34px 32px}
  .page-pro .bloc{padding:32px 30px}
  .contact-pro{padding:40px 36px}
}
.carte-formulaire{background:var(--blanc);border-radius:var(--r-grand);padding:26px 20px;box-shadow:var(--ombre);color:var(--texte);min-width:0}
.carte-formulaire h2{font-size:1.6rem;margin-bottom:.6em}
.formulaire{display:grid;gap:18px;margin:0}
.formulaire-obligatoire{font-size:.92rem;color:var(--texte-doux);margin:0}
.champ{display:flex;flex-direction:column;gap:6px;min-width:0}
.champ label{font-weight:700;color:var(--anthracite)}
.champ-aide{font-size:.9rem;color:var(--texte-doux);margin:0}
.champ input,.champ select,.champ textarea{
  width:100%;min-height:50px;padding:12px 14px;border:2px solid #8C8273;border-radius:var(--r-petit);
  background:var(--blanc);color:var(--texte);font:inherit;font-size:1rem;line-height:1.4;
}
.champ textarea{min-height:170px;resize:vertical}
.champ select{appearance:auto}
.champ input:focus-visible,.champ select:focus-visible,.champ textarea:focus-visible{outline:3px solid var(--vert-fonce);outline-offset:2px;border-color:var(--vert-fonce)}
.champ--erreur input,.champ--erreur select,.champ--erreur textarea{border-color:var(--rose-fonce)}
.champ-erreur{margin:0;font-weight:700;font-size:.95rem;color:var(--rose-fonce)}
.champ-erreur::before{content:"Erreur : "}
.champs-duo{display:grid;gap:18px;grid-template-columns:minmax(0,1fr)}
.formulaire-erreurs{border:3px solid var(--rose-fonce);background:var(--rose-pale);border-radius:var(--r-petit);padding:14px 18px;color:var(--texte)}
.formulaire-erreurs p{margin:0 0 .4em}
.formulaire-erreurs p:last-child{margin-bottom:0}
.formulaire-erreurs:focus-visible{outline:3px solid var(--vert-fonce);outline-offset:3px}
.formulaire-mention{font-size:.9rem;color:var(--texte-doux);margin:0;max-width:70ch}
.formulaire-mention a{color:var(--vert-fonce);font-weight:700}
.formulaire-envoi{margin:0}
.formulaire .bouton{cursor:pointer;font-family:inherit}
.piege{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.contact-grille{display:grid;gap:28px;grid-template-columns:minmax(0,1fr);align-items:start}
.contact-principal{min-width:0}
.contact-intro{max-width:62ch}
.contact-cote{background:var(--blanc);border:2px solid var(--sable);border-radius:var(--r-grand);padding:24px 22px;min-width:0}
.contact-cote h2{font-size:1.4rem;margin-bottom:.6em}
.contact-cote .contact-cote-titre{margin-top:1.2em}
.contact-coordonnees{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.contact-coordonnees li{padding:11px 14px;border-radius:var(--r-petit);background:var(--creme);overflow-wrap:break-word}
.contact-coordonnees .libelle{display:block;font-size:.85rem;color:var(--texte-doux)}
.contact-coordonnees .valeur{display:block;font-weight:700;color:var(--anthracite);font-size:.95rem}
.contact-coordonnees a{color:var(--vert-fonce)}
.contact-horaires{list-style:none;margin:0 0 14px;padding:0;line-height:1.7}
.contact-plus{margin:0}
.merci{max-width:62ch}
.merci-texte{font-size:1.1rem}
.merci h2{font-size:1.4rem;margin-top:1.4em}
.contact-pro .carte-formulaire{margin-top:22px}
.contact-pro .carte-formulaire p{color:var(--texte-doux)}
.contact-pro .carte-formulaire .formulaire-erreurs p{color:var(--texte)}
.contact-pro .carte-formulaire .champ-erreur{color:var(--rose-fonce)}
.contact-pro .carte-formulaire a{color:var(--vert-fonce)}
.contact-pro .carte-formulaire .bouton{color:#fff}
.contact-pro .carte-formulaire .bouton:focus-visible,.contact-pro .carte-formulaire a:focus-visible{outline-color:var(--vert-fonce)}
@media (min-width:700px){
  .champs-duo{grid-template-columns:repeat(2,minmax(0,1fr))}
  .carte-formulaire{padding:32px 30px}
}
@media (min-width:1000px){
  .contact-grille{grid-template-columns:minmax(0,1fr) 350px;gap:36px}
  .contact-cote{position:sticky;top:24px}
}