.scroll-wrapper {
  position: relative;
  min-height: 150vh;
  overflow: hidden;
}

/* .site-header {
    position: relative;
    z-index: 3; 
    background: transparent; 
} */

/* 🖼️ BAKGRUNNSBILDET */
.background-layer {
  position: absolute;
  inset: 0;
  top: -20vh;
  height: calc(100% + 20vh);
  min-height: 250vh;
  background-image: url("/assets/background.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center -10vh;
  z-index: 1;
  will-change: transform;
}

/* 🌫️ GRADIENT OVER BAKGRUNNEN */
.gradient-layer {
  position: fixed; 
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,0.3) 0%,
    /* rgba(255,255,255,0.6) 25%, */
    /* rgba(255,255,255,0.7) 50%, */
    /* rgba(255,255,255,0.8) 75%, */
    rgba(255,255,255,1) 100%
  );
  z-index: 2;
  pointer-events: none;

  opacity: 1;
  transition: opacity 0.4s ease;
}

/* background: linear-gradient(
    to bottom,
    rgba(255,255,255,0) 25%,
    rgba(255,255,255,0.25) 50%,
    rgba(255,255,255,0.6) 65%,
    rgba(255,255,255,0.8) 85%,
    rgba(255,255,255,1) 100%
  ); */


/* ✍️ INNHOLD */
.content {
  position: relative;
  z-index: 3;
  margin: 0 auto;
  padding: 0vh 0rem 0rem; /* 0vh 2rem 10rem */
  color: #111;
}