/* Pagina layout */
body, html {
  margin: 0;
  padding: 0;
  height: 100%;
  position: relative;
  font-family: sans-serif;
}

.content {
  min-height: 90vh;
  padding: 2rem;
}

.tram, .tram-track {
  position: absolute;
  z-index: 10;       /* achter banner */
  pointer-events: none;
}

.tram {
  top: 3px;
  left: -1500px;
  width: 1400px;
  height: 110px;
}

.sig-tram {
  opacity: 0.72;
  filter:
    grayscale(35%)
    brightness(0.92)
    drop-shadow(0 0 8px rgba(180,220,255,0.35));
}

/* Heel subtiele "spook"-variatie */
.sig-tram.ghost {
  opacity: 0.58;
  filter:
    grayscale(55%)
    brightness(1.05)
    blur(0.3px)
    drop-shadow(0 0 12px rgba(180,220,255,0.55));
}
.tram-track {
  position: absolute;
  top: 3px;
  width: 200%;       /* langer dan scherm */
  left: -50%;
  height: 110px;
}

.overhead-line {
  position: absolute;
  top: 0;
  width: 200%;
  left: -50%;
  height: 2px;
  background: #444;
}

.rails {
  position: absolute;
  top: 109px;        /* 5px lager */
  width: 200%;
  left: -50%;
  height: 5px;
  background: #888888;
}