/* ------ RESET ------ */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: Arial, sans-serif; line-height: 1.5; color: #333; background: #f9fafc; }

/* GALLERIA */
#gallery {
  padding: 3em 1em;
  background: #f5f5f5;
  max-width: 1200px;
  margin: 0 auto 2em auto;
  border-radius: 15px;
  box-shadow: 0 4px 16px rgba(98,165,111,0.09);
}
#gallery h2     { color:#206140; text-align:center; font-size:2rem; margin-bottom:1.2em; }
.carousel       { position: relative; overflow: hidden; border-radius: 13px; box-shadow: 0 4px 14px rgba(0,0,0,.13); margin-bottom: 1em; }
#mainPhoto      { width: 100%; max-height: 65vh; object-fit: cover; transition: opacity .6s; border-radius: 8px;} /* qui modificato vh da 48 a 65*/
.thumbs         { margin-top: 1.5rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(90px,1fr)); gap: 10px; }
.thumbs img     { width: 100%; height: 70px; object-fit: cover; border-radius: 5px; cursor: pointer; opacity: .8; border: 2px solid #dbeedb; transition: .3s; }
.thumbs img:hover,
.thumbs img.active { opacity: 1; border-color: #62a56f; box-shadow: 0 0 5px #62a56f55; }

/* BOXED SECTIONS */
.boxed {
  background: #fff;
  border-radius: 12px;
  border: 1.5px solid #e2e8ef;
  box-shadow: 0 2px 10px rgba(98,165,111,0.05);
  padding: 1.5em;
  margin-bottom: 1.5em;
}

section {
  padding: 2.3em 1.2em 1em 1.2em;
  max-width: 820px;
  margin: 0 auto;
}

h2 {
  margin-bottom: .6em;
  color: #206140;
  font-size: 1.5rem;
  letter-spacing: 0.02em;
}

/* LISTE */
ul   { list-style: disc inside; margin-bottom: 1em; }
li   { margin-bottom: .5em; }

/* FOOTER */
footer {
  background: #206140;
  color: #e8ffe8;
  padding: 1em;
  text-align: center;
  font-size: .9em;
  margin-top: 2em;
  border-radius: 15px 15px 0 0;
}

/* RESPONSIVE */
@media (max-width: 768px) {
  #hero { height: 35vh; font-size: 1.1rem;}
  #hero h1 { font-size: 2rem; }
  #gallery, section { max-width: 98vw; padding:1em 0.6em; }
  .carousel { max-height: 36vh; }
  #mainPhoto { max-height: 38vh;} /* qui modificato vh da 27 a 38*/
}
@media (max-width: 480px) {
  #hero { height: 28vh; font-size: 1rem;}
  #gallery, section { max-width: 99vw; padding:0.7em 0.3em; }
  .boxed { padding: 0.7em;}
  #gallery h2, h2 { font-size: 1.15rem;}
  #mainPhoto { max-height: 55vw; }
}

/* --- Extra accenti scientifici --- */
.boxed, .carousel { border-radius: 13px; border-width: 2px; }
.sci-name { color: #4eb378; }

#scrollToTopBtn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 48px;
  height: 48px;
  background-color: #185b18;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 24px;
  cursor: pointer;
  z-index: 999;
  box-shadow: 0 4px 8px rgba(0,0,0,0.3);
  transition: opacity 0.3s ease;
}

#scrollToTopBtn:hover {
  background-color: #138313;
}