/* docs/assets/style.css
   Forest theme overrides for Florel
   - Uses external hero image so you don't need to upload a local file.
*/
:root{
  --primary-color: #2f4f37;    /* deep forest green */
  --accent-color:  #c49b13;    /* warm yellow/gold */
  --neutral-color: #EDE6DA;    /* light neutral for text */
  --muted:         #6B8B57;
  --btn-text:      #1d2b21;
}

/* Basic page layout helpers (keeps existing layout intact) */
body{
  font-family: "Helvetica Neue", Arial, sans-serif;
  color: #1f2b24;
  margin:0;
  line-height:1.5;
  background: #f7f7f6;
}

/* Header */
.site-header{
  background: linear-gradient(180deg, rgba(47,79,55,0.95), rgba(47,79,55,0.95));
  color: var(--neutral-color);
  padding: 1rem 0;
}
.site-header .logo{ color: var(--neutral-color); font-weight:700; }
.language-switcher a{ color: var(--neutral-color); margin-left:0.6rem; text-decoration:none; }

/* Hero — use an external forest/woodland image + overlay */
.hero{
  background: linear-gradient(180deg, rgba(47,79,55,0.55), rgba(47,79,55,0.35)), 
              url('https://images.pexels.com/photos/1261728/pexels-photo-1261728.jpeg?auto=compress&cs=tinysrgb&w=1920') center/cover no-repeat;
  color: var(--neutral-color);
  padding: 6rem 0;
  text-align:center;
}
.hero h2{ font-size:2.4rem; margin:0 0 0.6rem; color: #203022; font-weight:800; }
.hero .tagline{ color: var(--neutral-color); font-size:1.05rem; max-width:900px; margin:0 auto 1rem; }

/* CTA buttons */
.btn{
  display:inline-block;
  padding:0.75rem 1.2rem;
  border-radius:10px;
  background: rgba(255,255,255,0.08);
  text-decoration:none;
  color:var(--neutral-color);
  border: 2px solid rgba(255,255,255,0.06);
  font-weight:700;
}
.btn.btn-primary{
  background: var(--accent-color);
  color: var(--btn-text);
  border-color: rgba(0,0,0,0.08);
  box-shadow: 0 3px 0 rgba(0,0,0,0.06);
}
.btn:hover{ opacity:0.95; transform: translateY(-1px); transition: all .12s ease; }

/* Sections */
.section{ padding:3rem 0; }
.section h2{ color: #223327; font-size:1.6rem; margin-bottom:0.6rem; }
.section p, .section li{ color:#243029; }

/* Booking */
.section.booking{
  background: linear-gradient(90deg, rgba(107,139,87,0.12), rgba(47,79,55,0.06));
  border-top: 6px solid rgba(47,79,55,0.04);
  text-align:center;
  padding:2.5rem 0;
}
.section.booking h2{ color:#203022; }
.section.booking .btn-primary{ background: var(--accent-color); color: var(--btn-text); }

/* Footer */
.site-footer{ padding:1.2rem 0; background:#f2efe9; color:#203022; text-align:center; }

/* Small responsive tweaks */
@media (max-width:768px){
  .hero{ padding:3.5rem 1rem; }
  .hero h2{ font-size:1.6rem; }
}
/* ===== Gallery styles (appended) ===== */
.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}
.gallery img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(16,24,20,0.06);
  transition: transform 0.28s cubic-bezier(.2,.8,.2,1), box-shadow 0.28s;
  cursor: pointer;
  object-fit: cover;
}
.gallery img:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow: 0 14px 30px rgba(8,12,8,0.12);
}

/* Lightbox fallback style */
#galleryLightbox { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.86); align-items:center; justify-content:center; z-index:9999; padding:2rem; }
#galleryLightbox img { max-width:92%; max-height:84%; border-radius:8px; }
#galleryLightbox .lb-caption { color:#fff; margin-top:0.6rem; text-align:center; font-size:.95rem; }