.hero .photo {
  background-image: url('images/villa-hero-men.webp');
  background-position: center 42%;
}
.hero .shade {
  background: linear-gradient(90deg,rgba(8,19,16,.76),rgba(8,19,16,.34) 48%,rgba(8,19,16,.16) 78%),linear-gradient(0deg,rgba(8,19,16,.7),transparent 54%);
}
.gallery.instagram-gallery { grid-template-columns:1.25fr .75fr; grid-template-rows:1fr 1fr; gap:14px; }
.instagram-gallery figure { position:relative; margin:0; overflow:hidden; min-height:270px; }
.instagram-gallery .gallery-wide { grid-row:1/3; min-height:600px; }
.instagram-gallery figure img,.instagram-gallery figure img+img { width:100%; height:100%; margin:0; object-fit:cover; transition:transform .5s ease; }
.instagram-gallery figure:hover img { transform:scale(1.025); }
.instagram-gallery figcaption { position:absolute; left:18px; bottom:18px; padding:9px 12px; border:1px solid rgba(255,255,255,.42); border-radius:3px; background:rgba(18,35,29,.46); color:#fff; -webkit-backdrop-filter:blur(9px); backdrop-filter:blur(9px); font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
@media(max-width:700px){.gallery.instagram-gallery{grid-template-columns:1fr;grid-template-rows:auto}.instagram-gallery .gallery-wide{grid-row:auto;min-height:430px}.instagram-gallery figure{min-height:320px}}
.hero .header-cta,
.hero .cta,
.hero .actions .primary,
.bungalow-copy .button-dark {
  display: none;
}
.hero .tools { gap: 0; }
.hero .actions { min-height: 28px; }
.bungalow-photo { position: relative; overflow: hidden; }
.bungalow-photo > img { transition: opacity .2s ease; }
.bungalow-photo > img.changing { opacity: .35; }
.bungalow-slider-controls { position:absolute; left:26px; bottom:26px; display:flex; align-items:center; gap:0; border:1px solid rgba(255,255,255,.52); border-radius:99px; background:rgba(18,35,29,.55); color:#fff; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); overflow:hidden; }
.bungalow-slider-controls button { width:54px; height:48px; border:0; background:transparent; color:#fff; font-size:19px; cursor:pointer; transition:background .2s; }
.bungalow-slider-controls button:hover { background:rgba(255,255,255,.14); }
.bungalow-slider-controls span { min-width:74px; text-align:center; font-size:10px; letter-spacing:.13em; }
.bungalow-slider-controls b { font-weight:700; }
@media(max-width:600px){.bungalow-slider-controls{left:14px;bottom:14px}.bungalow-slider-controls button{width:48px;height:44px}}
.content .hero-logo-title {
  width: min(510px, 58vw);
  max-width: none;
  line-height: 1;
  margin-left: -7px;
}
.hero-logo-title img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 285px;
  object-fit: contain;
  object-position: left center;
  filter: drop-shadow(0 10px 24px rgba(5,15,12,.18));
}
.hero .brand { width: 132px; height: 78px; opacity: .92; }
.hero .content { padding-top: 7vh; padding-bottom: 4.5vh; }
.hero .content > .eyebrow { margin-bottom: 18px; }
.hero .content > p { max-width: 480px; margin: 24px 0 28px; line-height: 1.6; }
.hero .actions { gap: 24px; }
.booking-bar {
  position: relative;
  z-index: 3;
  width: min(1400px, calc(100% - 64px));
  margin: 0 auto 22px;
  display: grid;
  grid-template-columns: 1fr 1fr .65fr .85fr auto;
  align-items: end;
  gap: 1px;
  padding: 8px;
  border: 1px solid rgba(255,255,255,.52);
  border-radius: 8px;
  background: rgba(244,241,233,.78);
  color: #15201c;
  -webkit-backdrop-filter: blur(18px) saturate(115%);
  backdrop-filter: blur(18px) saturate(115%);
  box-shadow: 0 18px 50px rgba(8,19,16,.23), inset 0 1px 0 rgba(255,255,255,.45);
}
.booking-field { min-height: 62px; padding: 10px 18px; border-right: 1px solid rgba(83,87,79,.18); display:flex; flex-direction:column; justify-content:center; }
.booking-field label { display:block; margin-bottom:8px; color:#77756e; font-size:9px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.booking-field input, .booking-field select { width:100%; border:0; outline:0; background:transparent; color:#15201c; font:400 16px Arial,sans-serif; }
.booking-field:focus-within { background:rgba(255,255,255,.22); border-radius:4px; }
.booking-field input::placeholder { color:#9a978f; }
.booking-submit { min-height:62px; border:1px solid rgba(255,255,255,.16); border-radius:5px; padding:0 28px; background:rgba(21,32,28,.92); color:#fff; cursor:pointer; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; box-shadow:0 8px 22px rgba(8,19,16,.16); transition:transform .2s,background .2s; }
.booking-submit:hover { background:#294238; transform:translateY(-1px); }
.booking-error { position:absolute; right:10px; bottom:-25px; margin:0; color:#fff; font-size:11px; }
@media(max-width:900px){.booking-bar{width:calc(100% - 36px);grid-template-columns:1fr 1fr;margin-bottom:18px;background:rgba(244,241,233,.86)}.booking-field{border-bottom:1px solid rgba(83,87,79,.18)}.booking-submit{grid-column:1/-1}.booking-error{bottom:-20px}}
@media(max-width:900px){.content .hero-logo-title{width:min(480px,70vw)}.hero .content{padding-top:10vh;padding-bottom:4vh}}
@media(max-width:700px){.hero .photo{background-position:58% center}}
@media(max-width:440px){.content .hero-logo-title{width:min(360px,84vw);margin-left:-4px}.hero .brand{width:104px}.hero .content>p{margin:20px 0 24px}.booking-bar{grid-template-columns:1fr}.booking-submit{grid-column:auto}.booking-field{border-right:0}}

/* Refined boutique-resort art direction */
html body {
  background: #f4efe5;
  color: #18231f;
  font-family: "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
  font-weight: 400;
}
body h1, body h2, body h3,
.content h1, .intro h2, .bungalow-copy h2, .getting h2 {
  font-family: "Bodoni 72", Didot, "Baskerville Display PT", Baskerville, Georgia, serif;
  font-weight: 400;
  letter-spacing: -.045em;
}
.hero header {
  height: 102px;
  border-bottom-color: rgba(255,255,255,.28);
}
.hero .nav {
  gap: 34px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.hero .nav a { opacity: .76; transition: opacity .2s; }
.hero .nav a:hover { opacity: 1; }
.hero .content > .eyebrow,
.intro > .eyebrow,
.bungalow-copy > .eyebrow,
.getting .eyebrow {
  font-size: 9px;
  letter-spacing: .28em;
}
.hero .content > p {
  color: rgba(255,255,255,.78);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: .015em;
}
.hero .more {
  border: 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.hero .facts {
  font-size: 9px;
  letter-spacing: .17em;
}
.intro.intro {
  padding-top: 138px;
  padding-bottom: 138px;
  background: #f4efe5;
}
.intro.intro h2 {
  color: #17231e;
  font-size: clamp(50px,5.2vw,82px);
  line-height: .94;
}
.intro.intro p { color:#66685f; font-size:16px; }
.intro .dark, .bungalow-copy .dark { color:#8b7860; }
.bungalow-detail.bungalow-detail {
  background: #ded6c8;
  box-shadow: 0 25px 70px rgba(45,40,31,.09);
}
.bungalow-copy.bungalow-copy { padding: clamp(48px,6vw,94px); }
.bungalow-copy.bungalow-copy h2 {
  color:#18231f;
  font-size:clamp(46px,4.7vw,74px);
  line-height:.94;
}
.bungalow-copy.bungalow-copy > p { color:#4f554f; font-family:"Bodoni 72",Didot,Baskerville,Georgia,serif; font-size:clamp(20px,1.7vw,27px); line-height:1.35; letter-spacing:-.018em; }
.amenities.amenities { border-top-color:rgba(49,52,47,.25); }
.amenities.amenities span {
  border-bottom-color:rgba(49,52,47,.22);
  font-size:11px;
  font-weight:600;
  letter-spacing:.045em;
}
.instagram-gallery figcaption {
  font-size:9px;
  letter-spacing:.18em;
}
.getting.getting {
  background:#122019;
  padding-top:132px;
  padding-bottom:132px;
}
.getting.getting h2 {
  font-size:clamp(52px,5.5vw,84px);
  line-height:.92;
}
.getting-head.getting-head > p { color:#aeb8b0; font-size:15px; }
.route-grid.route-grid article { background:#122019; }
.route-grid.route-grid h3 {
  font-family:"Bodoni 72",Didot,Baskerville,Georgia,serif;
  font-size:34px;
}
.booking-bar.booking-bar {
  border-color:rgba(255,255,255,.46);
  background:rgba(235,229,217,.76);
  box-shadow:0 22px 60px rgba(7,17,13,.26),inset 0 1px 0 rgba(255,255,255,.55);
}
.booking-field label { color:#726d63; letter-spacing:.19em; }
.booking-field input,.booking-field select { color:#1b2622; font-size:15px; }
.booking-submit.booking-submit {
  background:#18261f;
  letter-spacing:.15em;
}
.whatsapp.whatsapp { background:#1c8d59; box-shadow:0 14px 38px rgba(12,39,28,.24); }
@media(max-width:600px){
  .intro.intro{padding-top:92px;padding-bottom:92px}
  .getting.getting{padding-top:92px;padding-bottom:92px}
  .bungalow-copy.bungalow-copy{padding:44px 26px}
}