/* simple, clean */
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;margin:0;line-height:1.6}
header{padding:3rem 1rem;text-align:center}
main{max-width:1000px;margin:0 auto;padding:0 1rem 4rem}
.grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{border:1px solid #ddd;border-radius:12px;padding:1rem}
.card img{width:100%;height:160px;object-fit:cover;border-radius:8px}
footer{text-align:center;padding:2rem;color:#666}
nav a{margin:0 .5rem}
a{color:inherit}
h1,h2,h3{line-height:1.2}
figure img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

figure.plakat img {
  max-width: 800px;   /* Poster nie breiter als 800 Pixel */
  border: 1px solid #ddd;
  border-radius: 8px;
}
/* Centered PDF preview at 75% of text width */
.pdf-wrap {
  width: 75%;
  margin: 1rem auto;     /* centers the block */
}

.pdf-viewer {
  display: block;
  width: 100%;
  height: min(80vh, 900px);
  border: 1px solid #ddd;
  border-radius: 8px;
}

/* On small screens, let it span full width */
@media (max-width: 800px) {
  .pdf-wrap { width: 100%; }
}/* --- PDF preview robust centering --- */
.pdf-wrap {           /* center the viewer as a flex child */
  display: flex;
  justify-content: center;
  margin: 1rem auto;
  width: 100%;        /* let it use the full text width */
  max-width: 1000px;  /* same as main's max-width */
}

.pdf-viewer {
  width: 75%;         /* 3/4 of the text width */
  height: min(80vh, 900px);
  border: 1px solid #ddd;
  border-radius: 8px;
  display: block;
}

@media (max-width: 800px) {
  .pdf-viewer { width: 100%; }  /* full width on phones */
}
/* --- Unscharf gallery adjustments --- */
.unscharf-slider {
  max-width: 1000px;
  margin: 2rem auto;
  position: relative;
}

.unscharf-slide video,
.unscharf-slide img {
  width: 75%;        /* occupy 3/4 of the text width */
  max-width: 100%;
  display: block;
  margin: 0 auto;
  border-radius: 8px;
  border: 1px solid #ddd;
}

.unscharf-slider .prev,
.unscharf-slider .next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.5);
  color: #fff;
  border: none;
  padding: 0.5rem 0.75rem;
  cursor: pointer;
  font-size: 1.5rem;
  border-radius: 4px;
}

.unscharf-slider .prev { left: 1rem; }
.unscharf-slider .next { right: 1rem; }

/* On narrow screens, make the media take full width */
@media (max-width: 800px) {
  .unscharf-slide video,
  .unscharf-slide img {
    width: 100%;
  }
}