/* ===========================
   PAGINA STAMPA FOTOGRAFICA
   (solo layout e spaziature)
   =========================== */

/* Contenitore principale */
main {
  padding: 60px 20px;
}

section {
  max-width: 100%;
  margin: 0 auto;
}

article {
  line-height: 1.7;
  font-size: 18px;
}

/* ===========================
   SPAZIATURE TIPOGRAFICHE
   =========================== */

article h1 {
  margin-bottom: 25px;
}

article h2 {
  margin-top: 50px;
  margin-bottom: 15px;
}

article p {
  margin-bottom: 20px;
}

article ul {
  margin-bottom: 25px;
  padding-left: 20px;
}

article ul li {
  margin-bottom: 12px;
}

/* ===========================
   GALLERIA IMMAGINI
   =========================== */

.image-gallery {
  column-count: 3;
  column-gap: 20px;
  margin-top: 30px;
  overflow: auto;
}

/* Responsive colonne */
@media (max-width: 1200px) {
  .image-gallery {
    column-count: 2;
  }
}

@media (max-width: 600px) {
  .image-gallery {
    column-count: 1;
  }
}

/* Card immagini */
.card {
  break-inside: avoid;
  margin-bottom: 20px;
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
  transform: translateY(-6px);
}

.card img {
  width: 100%;
  height: auto;
  display: block;
}

.card figcaption {
  padding: 12px 15px;
  font-size: 14px;
}

/* ===========================
   CTA BUTTON (senza colori)
   =========================== */

.cta-button {
  display: inline-block;
  margin-top: 15px;
  padding: 14px 28px;
  text-decoration: none;
  border-radius: 6px;
  transition: transform 0.3s ease;
}

.cta-button:hover {
  transform: translateY(-2px);
}

/* ===========================
   RESPONSIVE MOBILE
   =========================== */

@media (max-width: 768px) {

  article h1 {
    font-size: 32px;
  }

  article h2 {
    font-size: 22px;
  }

  article {
    font-size: 16px;
  }

  main {
    padding: 40px 15px;
  }
}