/* Berlin Lite permits static title artwork, but not font-file redistribution.
   These SVGs contain the four title artworks. See fonts/berlin-titles.md. */
.cv-hero-name.cv-title-berlin,
.cv-page-title.cv-title-berlin {
  display: flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  font-size: clamp(38px, 8vw, 92px);
  line-height: clamp(28px, 5vw, 52px);
  font-style: normal;
  text-transform: uppercase;
  transform: none;
}

.cv-title-berlin-art {
  display: block;
  flex: 0 1 auto;
  width: calc(var(--cv-berlin-width) * 1em);
  height: auto;
  max-width: 100%;
}

.cv-title-berlin--white .cv-title-berlin-art {
  filter: brightness(0) invert(1);
}

.cv-page-title.cv-title-berlin--bio,
.cv-page-title.cv-title-berlin--music {
  height: clamp(28px, 5vw, 52px);
  align-items: flex-end;
}

.cv-title-berlin--bio .cv-title-berlin-art {
  /* Rest the artwork on the existing title-bar rule without moving the body. */
  transform: translateY(.75rem);
}

.cv-hero-name.cv-title-berlin--home {
  width: min(100%, var(--cv-home-title-width, 6.35449219em));
  font-size: clamp(44px, 9vw, 112px);
  line-height: 1;
  margin-top: calc(clamp(1.8rem, 3.3vw, 2.8rem) + clamp(.75rem, 1.4vw, 1.25rem));
  margin-left: auto;
  margin-right: var(--cv-home-title-right, 0px);
}

.cv-title-berlin--home .cv-title-berlin-art {
  width: 100%;
}

.cv-page-title.cv-title-berlin--bio {
  font-size: clamp(44px, 9vw, 100px);
}

.cv-page-title.cv-title-berlin--music {
  /* Start within the viewport so the gallery's existing width fit is exact. */
  font-size: clamp(22px, 8vw, 92px);
  max-width: none;
  gap: .2em;
}

.cv-title-berlin--music .cv-title-berlin-art {
  flex-shrink: 0;
  max-width: none;
}

.cv-music-ampersand {
  display: block;
  flex: 0 0 auto;
  font-family: Arial, 'Liberation Sans', sans-serif;
  font-size: 1.43em;
  font-weight: 700;
  font-style: normal;
  letter-spacing: normal;
  line-height: .75;
  /* Real system text has no image viewport to crop its top or bottom. */
  overflow: visible;
}

.cv-page-title.cv-title-berlin--contact {
  position: relative;
  top: .05em;
  font-size: clamp(60px, 12vw, 156px);
}