:root {
  /* Yläpalkin taustakuvan peittävyys: 0.30 = 30 %, 0.15 = 15 %, 0.50 = 50 %. */
  --topbar-banner-opacity: 0.30;
}

.topbar {
  /* Pelkkä tausta: ei muuta palkin korkeutta, leveyttä tai sisältöjen asettelua.
     Tumma kerros säätää kuvan näkyvyyttä; tekstit ja napit eivät himmene. */
  background:
    linear-gradient(100deg,
      rgba(22, 18, 15, calc(1 - var(--topbar-banner-opacity))),
      rgba(58, 37, 28, calc(1 - var(--topbar-banner-opacity)))),
    url("./assets/topbar-banner.jpg") center / cover no-repeat;
}