:root{
  --bg:#F9F7F0;
  --ink:#4A4947;
  --accent:#B17457;
  --accent-soft:#D8D2C2;
}
*{box-sizing:border-box;}
body{
  margin:0;
  font-family:'Avenir Next', Avenir, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color:var(--ink);
  background:var(--bg);
}

/* ---------- header / nav ---------- */
header.nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:34px 5%;
  background:var(--bg);
}
.logo{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-decoration:none;
}
.logo img{
  height:64px;
  width:auto;
}
nav{
  display:flex;
  gap:44px;
}
nav a{
  text-decoration:none;
  color:var(--ink);
  font-weight:400;
  font-size:16px;
  letter-spacing:0.3px;
}
nav a.active{ color:var(--accent); }
.book-btn{
  border:1px solid var(--accent);
  color:var(--accent);
  text-decoration:none;
  font-size:13px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  padding:14px 30px;
  white-space:nowrap;
}

/* ---------- home hero ---------- */
.hero{
  position:relative;
  width:100%;
  height:100vh;
  min-height:600px;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

/* ---------- generic section layout ---------- */
section{
  padding:70px 8%;
  max-width:1100px;
  margin:0 auto;
}
.welcome{ text-align:center; }
.welcome h2{
  color:var(--ink);
  font-size:32px;
  font-weight:500;
  margin-bottom:18px;
}
.welcome p{
  font-size:18px;
  line-height:1.7;
  max-width:760px;
  margin:0 auto;
  color:var(--ink);
}
.stats{
  display:flex;
  justify-content:center;
  gap:50px;
  margin-top:34px;
  color:var(--accent);
  letter-spacing:1px;
  flex-wrap:wrap;
}

/* ---------- property slideshow (home page) ---------- */
.gallery{
  max-width:none;
  padding:70px 0;
}
.gallery h2{
  text-align:center;
  color:var(--ink);
  font-size:30px;
  font-weight:500;
  margin-bottom:36px;
}
.slideshow{
  position:relative;
  width:100%;
  height:74vh;
  min-height:420px;
  overflow:hidden;
  background:var(--accent-soft);
}
.slideshow .slide{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity 0.9s ease;
}
.slideshow .slide.active{ opacity:1; }
.slide-btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:2;
  background:rgba(74,73,71,0.45);
  color:#fff;
  border:none;
  font-size:20px;
  line-height:1;
  padding:14px 17px;
  cursor:pointer;
}
.slide-btn:hover{ background:rgba(74,73,71,0.7); }
.slide-btn.prev{ left:0; }
.slide-btn.next{ right:0; }
.slide-dots{
  position:absolute;
  bottom:16px;
  left:0; right:0;
  z-index:2;
  display:flex;
  justify-content:center;
  gap:9px;
}
.slide-dots button{
  width:9px; height:9px;
  border-radius:50%;
  border:none;
  padding:0;
  background:rgba(255,255,255,0.55);
  cursor:pointer;
}
.slide-dots button.active{ background:#fff; }

/* ---------- book your stay ---------- */
.book{
  text-align:center;
  position:relative;
  background:#ffffff;
  max-width:none;
  padding:80px 8% 90px;
}
.book::after{
  content:"";
  position:absolute;
  left:0; right:0;
  top:100%;
  height:28px;
  background:radial-gradient(circle at 50% 0, #ffffff 14px, rgba(255,255,255,0) 15px);
  background-size:56px 28px;
  background-repeat:repeat-x;
  pointer-events:none;
}
.book h2{
  color:var(--ink);
  font-size:30px;
  font-weight:500;
  margin-bottom:14px;
}
.book-pitch{
  font-size:18px;
  line-height:1.7;
  max-width:640px;
  margin:0 auto 36px;
  color:var(--ink);
}
.booking-widget{
  max-width:520px;
  margin:0 auto;
}
.book-alt{
  font-size:14px;
  color:var(--ink);
  margin-top:26px;
}
.book-alt a{ color:var(--accent); }

/* ---------- host bio ---------- */
.host{
  display:flex;
  gap:40px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:center;
  text-align:left;
}
.host-photo{
  width:150px; height:150px;
  border-radius:50%;
  object-fit:cover;
  border:4px solid var(--accent);
}
.host-text{ max-width:560px; }
.host-text h2{ color:var(--ink); font-weight:500; margin-top:0; }
.host-text p{ font-size:16px; line-height:1.7; color:var(--ink); }
.host-text .meta{
  color:var(--accent);
  font-size:14px;
  letter-spacing:0.5px;
  margin-top:12px;
}

/* ---------- activities page hero ---------- */
.page-hero{
  position:relative;
  width:100%;
  height:46vh;
  min-height:320px;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.page-hero::after{
  content:"";
  position:absolute; inset:0;
  background:rgba(20,15,12,0.35);
}
.page-hero-content{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  color:#fff; z-index:2; text-align:center;
}
.page-hero-content h1{
  font-size:44px;
  font-weight:500;
  margin:0 0 8px;
  letter-spacing:1px;
  text-shadow:0 2px 12px rgba(0,0,0,0.4);
}
.page-hero-content p{
  font-size:15px;
  letter-spacing:2px;
  text-transform:uppercase;
  margin:0;
}

/* ---------- activities categories ---------- */
main{
  max-width:1000px;
  margin:0 auto;
  padding:70px 8%;
}
.intro{
  text-align:center;
  max-width:700px;
  margin:0 auto 60px;
  font-size:18px;
  line-height:1.7;
  color:var(--ink);
}
.category{ margin-bottom:64px; }
.category-head{
  display:flex;
  align-items:baseline;
  gap:16px;
  margin-bottom:26px;
  border-bottom:2px solid var(--accent-soft);
  padding-bottom:14px;
}
.category-head h2{
  color:var(--ink);
  font-size:27px;
  font-weight:500;
  margin:0;
}
.category-head span{
  color:var(--accent);
  font-size:13px;
  letter-spacing:1px;
  text-transform:uppercase;
}
.place-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:26px;
}
.place{
  border-left:3px solid var(--accent);
  padding-left:18px;
}
.place h3{
  margin:0 0 8px;
  color:var(--ink);
  font-size:18px;
  font-weight:600;
}
.place p{
  margin:0;
  font-size:14.5px;
  line-height:1.65;
  color:var(--ink);
}
.fine-print{
  font-size:13.5px;
  color:#8a8478;
  margin-top:18px;
}
.good-to-know{
  background:var(--accent-soft);
  padding:36px 40px;
  border-radius:6px;
  text-align:center;
}
.good-to-know h2{
  color:var(--ink);
  font-weight:500;
  margin-top:0;
  font-size:24px;
}
.good-to-know p{
  font-size:15px;
  line-height:1.7;
  color:var(--ink);
  max-width:600px;
  margin:0 auto;
}

/* ---------- footer ---------- */
footer{
  background:var(--accent);
  color:var(--bg);
  text-align:center;
  padding:34px;
  font-size:13px;
  letter-spacing:1px;
}