:root{
  --bg:#0e1116; --fg:#e8eef7; --card:#161b22; --line:#22304a; --accent:#4da3ff; --muted:#98a6bd;
  --page-max:1100px;
  --page-pad:.9rem;
}
.enl-banner,
.header.enl-skin{
  background:var(--card); color:var(--fg);
  border-bottom:1px solid var(--line);
  box-shadow:0 0 0 1px rgba(77,163,255,.06);
  font:15px/1.3 system-ui,Segoe UI,Roboto,Arial,sans-serif
}
.enl-banner{position:sticky;top:0;z-index:1000}
.enl-banner .row{
  max-width:var(--page-max);
  margin:0 auto;
  display:flex;align-items:center;gap:.75rem;
  padding:.55rem var(--page-pad);
}
.enl-banner .logo{display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;color:var(--fg)}
.enl-banner .logo img{width:28px;height:28px;display:block}
.enl-banner .title{font-weight:600;letter-spacing:.2px}

.header.enl-skin{position:sticky;top:0;z-index:1000}
.header.enl-skin .brand,
.header.enl-skin .title,
.header.enl-skin a{color:var(--fg) !important}
.header.enl-skin .brand{display:flex;align-items:center;gap:.55rem;padding:.55rem var(--page-pad)}
.header.enl-skin .brand img{width:28px;height:28px;display:block}

/* ===== Fil d'Ariane (chips) — même grille que le bandeau ===== */
.ariane, .breadcrumb, .breadcrumbs, nav.breadcrumb, nav.breadcrumbs{
  box-sizing:border-box;
  display:flex; flex-wrap:wrap; gap:.5rem; align-items:center;
  list-style:none;
  max-width:var(--page-max);
  margin:.6rem auto .8rem;
  padding:0 var(--page-pad);
}
.ariane a, .breadcrumb a, .breadcrumbs a,
.ariane span, .breadcrumb span, .breadcrumbs span{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.22rem .55rem;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--fg); text-decoration:none; background:transparent;
  font-size:.92rem;
}
.ariane a:hover, .breadcrumb a:hover, .breadcrumbs a:hover{ border-color:var(--accent); }
.ariane .sep, .breadcrumb .sep, .breadcrumbs .sep{ opacity:.6; padding:0 .2rem; }

/* Si déjà dans un conteneur .wrap/.container, pas de double marge/padding */
.wrap .ariane, .wrap .breadcrumb, .wrap .breadcrumbs,
.container .ariane, .container .breadcrumb, .container .breadcrumbs{
  max-width:100%;
  margin-left:0; margin-right:0;
  padding-left:0; padding-right:0;
}

@media (max-width:640px){
  .enl-banner .title{font-size:.95rem}
  .ariane a, .breadcrumb a, .breadcrumbs a{font-size:.88rem}
}
