/* ============================
   FILM 1890 EFFECT
   ============================ */

@keyframes filmShake {
  0%,100% { transform: translate(0,0) scale(1); }
  50% { transform: translate(-0.5px,0.8px) scale(1.01); }
}

@keyframes filmFlicker {
  0%,100% { opacity:1; }
  10% { opacity:0.97; }
  30% { opacity:0.9; }
  40% { opacity:1; }
  70% { opacity:0.95; }
}

.film1890 {
  position: relative;
  overflow: hidden;
  padding: 60px;
  color: #222;
  font-family: "Georgia", serif;

  background:
    radial-gradient(
      circle at 40% 40%,
      rgba(255,255,255,0.8),
      rgba(235,235,240,0.9) 40%,
      rgba(210,210,220,0.8) 100%
    );

  background-blend-mode: screen;
  filter: contrast(1.2) brightness(1.1);
  animation: filmShake 3s infinite ease-in-out,
             filmFlicker 0.25s infinite;
}

/* Glanslaag */
.film1890::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      125deg,
      rgba(255,255,255,0.3) 0%,
      rgba(255,255,255,0.05) 50%,
      rgba(255,255,255,0.2) 100%
    );
  background-size: 200% 200%;
  opacity: 0.35;
  mix-blend-mode: soft-light;
  z-index: 0;
}

/* Stof, krassen, vignette */
.film1890::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    url("https://www.transparenttextures.com/patterns/asfalt-light.png"),
    radial-gradient(circle at center, transparent 70%, rgba(0,0,0,0.35) 100%);
  background-blend-mode: multiply;
  opacity: 0.4;
  pointer-events: none;
  mix-blend-mode: multiply;
  z-index: 1;
  animation: filmFlicker 0.5s infinite;
}

/* Content boven alles */
.film1890 h1,
.film1890 h2,
.film1890 h3,
.film1890 p,
.film1890 * {
  position: relative;
  z-index: 2;
}
