:root{ --card:200px; --gap:12px; }
  body{font-family:Arial,Helvetica,sans-serif;margin:0;background:#f4f4f4;color:#222}
  header{background:#4CAF50;color:#fff;padding:18px 0;text-align:center}
  main{max-width:1100px;margin:18px auto;padding:18px}
  h1{margin:0 0 6px}
  .lead{margin:0 0 18px;text-align:center;font-size:1.05rem}

  /* grid galerie */
  .gallery{ display:grid; grid-template-columns: repeat(auto-fit, minmax(var(--card),1fr)); gap:var(--gap); align-items:start; }
  figure{ margin:0; display:flex; flex-direction:column; align-items:center; }
  .img-card{ width:100%; max-width:var(--card); aspect-ratio:1/1; overflow:hidden; border-radius:8px; background:#e9e9e9; box-shadow:0 2px 8px rgba(0,0,0,0.14); position:relative; }
  .img-card img{ width:100%; height:100%; object-fit:cover; display:block; cursor:pointer; transition:transform .18s ease; }
  .img-card img:hover{ transform:scale(1.04); }

  figcaption.caption{ margin-top:8px; font-size:.95rem; color:#222; text-align:center; max-width:var(--card); }

  /* popisek (detail text) */
  .detail{ margin-top:16px; background:#fff; padding:14px; border-radius:8px; box-shadow:0 2px 6px rgba(0,0,0,0.06); }
  .detail h2{ margin:0 0 6px; font-size:1.05rem }
  .detail p{ margin:0 0 8px; line-height:1.45 }

  /* lightbox */
  .lightbox{ display:none; position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,0.92); align-items:center; justify-content:center; padding:20px }
  .lightbox.visible{ display:flex }
  .lightbox img{ max-width:95%; max-height:90%; box-shadow:0 8px 30px rgba(0,0,0,0.6) }
  .lightbox .close{ position:absolute; top:16px; right:20px; color:#fff; font-size:34px; cursor:pointer; }

  @media(max-width:520px){ :root{--card:140px} .lead{padding:0 8px} }
.photo-descriptions {
    max-width: 900px;
    margin: 40px auto;
    background: #fff;
    padding: 25px;
    border-radius: 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
}
.photo-descriptions h2 {
    text-align: center;
    color: #333;
    margin-bottom: 15px;
}
.photo-descriptions p {
    line-height: 1.6;
    color: #555;
}
.description-item {
    margin-top: 25px;
}
.description-item h3 {
    color: #4CAF50;
    margin-bottom: 8px;
}