/* Samy 23/10/2026 : refonte de bar.com, phase B4 -- pages du moteur de stages (recherche, fiche de session, inscription, retours de
   paiement). Elles chargent encore les anciennes feuilles (css/styles.css, css/style.css) pour le corps du tunnel, puis la feuille
   de la nouvelle charte (assets/style.css), puis celle-ci, qui corrige ce que les anciennes imposent au bandeau, au pied et au texte. */
body.moteur { margin: 0; background: var(--canvas); color: var(--ink); font-family: var(--body), "DM Sans", system-ui, sans-serif; font-size: 1rem; line-height: 1.6 }
body.moteur .nav:before, body.moteur .nav:after { content: none; display: none }
body.moteur .head .logo { position: static; max-width: none; width: auto }
body.moteur .head a:hover, body.moteur .foot a:hover { text-decoration: none }
body.moteur h1, body.moteur h2, body.moteur h3 { font-family: var(--disp), "Manrope", system-ui, sans-serif; color: var(--deep); text-transform: none }
.moteur-corps { padding-top: 28px; padding-bottom: 40px }
.moteur-corps > * { min-width: 0 }
/* le formulaire de choix de la page « Trouver un stage » */
.filtre { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 12px 16px; align-items: end; margin: 24px 0 28px; padding: 18px 20px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius) }
.filtre .champ { margin: 0 }
.filtre label { display: block; margin-bottom: 6px; font-weight: 700; font-size: .875rem; color: var(--deep) }
.filtre select { width: 100%; min-height: 44px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); font: inherit; color: var(--ink) }
.filtre .actions { margin: 0 }
.filtre .btn { min-height: 44px }
@media (max-width: 760px) { .filtre { grid-template-columns: minmax(0, 1fr) } .filtre .btn { width: 100% } }
.sessions-vide { padding: 18px 20px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius) }
body.moteur main p, body.moteur main li { font-size: .9375rem }
body.moteur main p.chapo { font-size: 1.0625rem }
/* les gabarits du tunnel (fiche de session, inscription) gardent la grille de l'ancienne feuille ; sur telephone, ses marges
   s'ajoutaient a celles de la page et le tableau depassait de 25 a 40 px a 320 px */
@media (max-width: 767px) {
  .moteur-corps .container { width: auto; max-width: 100%; padding-left: 0; padding-right: 0 }
  .moteur-corps .row { margin-left: 0; margin-right: 0 }
  .moteur-corps [class*="col-"] { padding-left: 0; padding-right: 0 }
  .moteur-corps table td, .moteur-corps table th { overflow-wrap: anywhere }
}
.moteur-corps img { max-width: 100%; height: auto }
/* Samy 23/10/2026 (apres-midi) : « Trouver un stage » -- onglets par formation, villes par region, page introuvable */
.onglets { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px }
.onglets a { --tc: #243B4A; --tf: #E8EEF2; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px; border-radius: 999px; background: var(--paper); border: 1px solid var(--line); color: var(--deep); font: 600 .875rem/1.2 var(--disp), sans-serif; text-decoration: none }
.onglets a.t1 { --tc: #243B4A; --tf: #E8EEF2 } .onglets a.t2 { --tc: #9D2945; --tf: #F7E8EC } .onglets a.t3 { --tc: #2F6B4F; --tf: #E6F1EB } .onglets a.t4 { --tc: #80603D; --tf: #F3ECE3 }
.onglets a .nb { min-width: 22px; padding: 1px 7px; border-radius: 999px; background: var(--tf); color: var(--tc); font-size: .8125rem; text-align: center }
.onglets a:hover { border-color: var(--tc) }
.onglets a.on { background: var(--deep); border-color: var(--deep); color: var(--paper) }
.onglets a.on .nb { background: rgba(255, 255, 255, .18); color: var(--paper) }
.moteur-recherche .sessions { margin-bottom: 30px }
.villes { margin: 0 0 34px }
.villes h2 { margin: 0 0 12px }
.villes-regions { columns: 3 260px; column-gap: 16px }
.villes .region { break-inside: avoid; margin: 0 0 10px; background: var(--paper); border: 1px solid var(--line); border-radius: 10px }
.villes summary { display: flex; justify-content: space-between; align-items: center; min-height: 44px; padding: 8px 14px; cursor: pointer; font: 600 .9375rem/1.3 var(--disp), sans-serif; color: var(--deep); list-style: none }
.villes summary::-webkit-details-marker { display: none }
.villes summary::after { content: "+"; margin-left: 10px; color: var(--accent); font-weight: 700 }
.villes details[open] summary::after { content: "–" }
.villes summary .nb { margin-left: auto; color: var(--mut); font-weight: 500; font-size: .8125rem }
.villes ul { margin: 0; padding: 0 14px 12px; list-style: none; columns: 2; column-gap: 12px }
.villes li { break-inside: avoid; padding: 0 }
.villes li a { display: inline-block; padding: 7px 0; color: var(--ink); text-decoration: none; font-size: .9375rem }
.villes li a span { color: var(--mut); font-size: .8125rem }
.villes li a:hover { color: var(--accent); text-decoration: underline }
@media (max-width: 640px) { .villes ul { columns: 1 } }
.page-404 h1 { margin-top: 10px }
.page-404 ul { padding-left: 20px }
.page-404 li { margin: 0 0 10px }
/* Samy 23/10/2026 : avec la colonne de droite, les cartes de sessions prennent toute la largeur du contenu (elles s'arretaient a 760 px) */
.moteur-recherche .sessions { max-width: none }
.moteur-recherche .villes-regions { columns: 2 240px }
/* Samy 23/10 : meme echelle de titres que les pages neuves (le H1 du tunnel venait de l'ancienne feuille : 36 px, aussi sur telephone) */
.moteur-corps h1 { font-size: 2rem; line-height: 1.2 }
.moteur-corps h2 { font-size: 1.5rem }
@media (max-width: 1023px) { .moteur-corps h1 { font-size: 1.625rem } .moteur-corps h2 { font-size: 1.3125rem } }
@media (max-width: 640px) { .moteur-corps h1 { font-size: 1.375rem; line-height: 1.25 } .moteur-corps h2 { font-size: 1.1875rem } }