
.villa-hero{
	min-height:760px;
	display:flex;
	align-items:flex-end;
	color:white;
	background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.58)),url("../images/hero-one-bedroom-villa.webp") center/cover
}
.villa-hero-content{
	padding:0 0 95px;max-width:820px
}
.villa-hero h1{
	font-size:clamp(50px,6vw,82px)
}
.villa-hero p{
	font-size:18px;max-width:650px;color:rgba(255,255,255,.9);margin:22px 0 28px
}
.villa-facts{
	background:var(--green);color:white
}
.facts-grid{
	display:grid;grid-template-columns:repeat(4,1fr)
}
.fact{
	text-align:center;padding:28px 15px;border-right:1px solid rgba(255,255,255,.15)
}
.fact:last-child{
	border:0
}
.fact strong{
	display:block;font:26px Georgia,serif
}
.fact span{
	font-size:10px;letter-spacing:.12em;text-transform:uppercase;opacity:.78
}
.villa-intro{
	background:var(--ivory)
}
.villa-intro-grid{
	display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:center
}
.villa-intro h2{
	font-size:clamp(38px,4vw,58px)
}
.villa-intro p{
	color:var(--muted);font-size:16px
}
.highlight-box{
	background:white;padding:35px;border:1px solid var(--line)
}
.highlight-box h3{
	font-size:28px;margin-bottom:18px
}
.highlight-list{
	display:grid;grid-template-columns:1fr 1fr;gap:13px 20px;margin:0;padding:0;list-style:none
}
.highlight-list li{
	font-size:13px;color:var(--muted);border-top:1px solid var(--line);padding-top:10px
}
.gallery-feature{
	display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:300px 300px;gap:8px
}
.gallery-feature div{
	background-size:cover;background-position:center}.gf-main{grid-row:span 2;background-image:url("../images/one-bedroom-villa-gallery.webp")}
.gf-2{
	background-image:url("../images/one-bedroom-villa-gallery2.webp")
}
.gf-3{
	background-image:url("../images/one-bedroom-villa-gallery3.webp")
}
.experience{
	display:grid;grid-template-columns:1fr 1fr;min-height:650px
}.experience-img{
	background:url("../images/one-bedroom-villa-fac.webp") center/cover
}
.experience-copy{
	background:var(--green);color:white;padding:80px max(7vw,50px);display:flex;flex-direction:column;justify-content:center
}.experience-copy p{
	max-width:530px;color:rgba(255,255,255,.78)
}
.experience-copy .eyebrow{
	color:#d7b39f
}
.benefits{
	display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:35px
}
.benefit{
	border-top:1px solid rgba(255,255,255,.18);padding-top:14px
}.benefit strong{
	display:block;font:20px Georgia,serif
}
.benefit span{
	font-size:12px;color:rgba(255,255,255,.68)
}
.amenities-grid{
	display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:45px
}
.amenity{
	padding:22px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)
}.amenity strong{
	font:20px Georgia,serif
}
.amenity p{
	font-size:12px;color:var(--muted);margin:7px 0 0
}
.villa-cta{
	padding:110px 20px;text-align:center;background:var(--ivory)
}.villa-cta p{
	max-width:600px;margin:20px auto 28px;color:var(--muted)
}

@media(max-width:900px){
.facts-grid{
	grid-template-columns:repeat(2,1fr)
	}
.fact:nth-child(2){
	border-right:0
	}
.villa-intro-grid,.experience{
	grid-template-columns:1fr
	}
.experience-img{
	min-height:480px
	}
.amenities-grid{
	grid-template-columns:repeat(2,1fr)
	}
}

@media(max-width:560px){
.villa-hero{
	min-height:680px
	}
.villa-hero-content{
	padding-bottom:70px
	}
.fact{
	padding:20px 8px
	}
.fact strong{
	font-size:23px
	}
.villa-intro-grid{
	gap:35px
	}
.gallery-feature{
	grid-template-columns:1fr;grid-template-rows:300px 240px 240px
	}
.gf-main{
	grid-row:auto
	}
.experience-copy{
	padding:65px 30px
	}
.benefits{
	grid-template-columns:1fr
	}
.amenities-grid{
	grid-template-columns:1fr
	}
}
