/**
 * UniversBar : bandeau d'identité d'un domaine, sous le menu principal.
 *
 * Version de base (préréglage « classique ») : bande noire, nom du domaine
 * en rouge et Georgia, comme le PageTitle. Les préréglages la redessinent.
 */
.UniversBar {
  background-color: var(--u-band-bg);
  color: var(--u-band-ink);
}

.UniversBar-inner {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-top: 32px;
  padding-bottom: 32px;
}

.UniversBar-brand {
  display: inline-flex;
  flex-direction: column;
  color: inherit;
  text-decoration: none;
}

.UniversBar-logo {
  display: block;
  max-height: 72px;
  width: auto;
}

.UniversBar-house {
  font-family: var(--am-font-base);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.UniversBar-name {
  font-family: var(--u-font-title);
  font-weight: var(--u-title-weight);
  text-transform: var(--u-title-transform);
  font-size: 40px;
  line-height: 1.05;
  color: var(--u-band-title);
}

.UniversBar-tagline {
  margin-top: 8px;
  max-width: 46ch;
  font-size: 16px;
  line-height: 1.4;
}

.UniversBar-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.UniversBar-link {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid currentColor;
  border-radius: var(--u-chip-radius);
  color: inherit;
  font-size: 14px;
  text-decoration: none;
  transition: background-color 0.15s, color 0.15s;
}

.UniversBar-link:hover,
.UniversBar-link[aria-current] {
  background-color: var(--u-band-ink);
  color: var(--u-band-bg);
}

@media (min-width: 700px) {
  .UniversBar-name {
    font-size: 56px;
  }
}

@media (min-width: 1100px) {
  .UniversBar-inner {
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
  }

  .UniversBar-links {
    justify-content: flex-end;
    max-width: 60%;
  }
}

/* Image du bandeau (BO) : à droite, fondue vers la couleur du bandeau */
.UniversBar {
  position: relative;
}
.UniversBar--image::before {
  content: "";
  position: absolute;
  inset: 0 0 0 35%;
  background: var(--u-band-image) right center / cover no-repeat;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 40%);
  mask-image: linear-gradient(to right, transparent, #000 40%);
  pointer-events: none;
}
.UniversBar-inner {
  position: relative;
}

/* Raccourci éditeur, visible avec la permission « Personnaliser les univers » */
.UniversBar-edit {
  position: absolute;
  top: 12px;
  right: 20px;
  z-index: 2;
  padding: 6px 12px;
  border-radius: var(--am-radius);
  background: var(--am-black);
  color: var(--am-white);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}
.UniversBar-edit:hover,
.UniversBar-edit:focus-visible {
  background: var(--am-dark-red);
}

/* Accueil d'univers : le carrousel occupe le reste de l'écran. Hauteur
   réelle du bandeau mesurée par js/site-header.js ; estimation d'ici là. */
body:has(.UniversHero) {
  --bar-height: 240px;
}
@media (min-width: 1100px) {
  body:has(.UniversHero) {
    --bar-height: 185px;
  }
}