/* ---------- H1 : retour de ligne seulement tablette/ordi + style identique ---------- */
#page-title h1.title-split .title-break {
  display: inline !important;            /* mobile : pas de saut */
  font-size: inherit !important;         /* même style que le H1 */
  font-weight: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
  color: inherit !important;
  opacity: 1 !important;
}
@media (min-width: 768px) {
  #page-title h1.title-split .title-break {
    display: block !important;           /* tablette/ordi : saut de ligne */
  }
}

/* ---------- Kicker à gauche / Breadcrumb complètement à droite ---------- */
#page-title .container {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  row-gap: 8px;
}

/* H1 occupe la 1re ligne */
#page-title .container > h1 {
  flex: 0 0 100%;
  margin: 0 0 4px;
}

/* Kicker (span) prend l'espace restant -> pousse le breadcrumb à droite */
#page-title .container > span {
  flex: 1;
  display: inline-block;
  line-height: 1.3;
}

/* Breadcrumb à droite (tab/desktop) et centré sur mobile */
#page-title .breadcrumb {
  margin: 0;
  padding: 0;
  list-style: none;

  position: static !important;
  float: none !important;

  display: inline-flex !important;
  align-items: baseline;
  margin-left: auto;                     /* colle à droite */
}

#page-title .breadcrumb > li { display: inline; }
#page-title .breadcrumb > li + li::before {
  content: "›";
  margin: 0 8px;
  color: #666;
}

/* ---------- Mobile : empile et centre ---------- */
@media (max-width: 767px) {
  #page-title .container { display: block; text-align: center; }
  #page-title .container > span { display: block; margin-bottom: 6px; }
  #page-title .breadcrumb { justify-content: center; margin-left: 0; }
}