
body{font-family:'Inter',sans-serif;background:#0f0f14;color:#fff;margin:0}

header{
position:fixed;
width:100%;
padding:25px 8%;
display:flex;
justify-content:space-between;
align-items:center;
z-index:1000;
background:rgba(15,15,20,0.6);
backdrop-filter:blur(12px)
}

header h1{font-family:'Playfair Display',serif;letter-spacing:2px}

nav a{color:#ddd;text-decoration:none;margin-left:30px}
nav a:hover{color:#c6a55c}

.hero{
height:100vh;
background:
linear-gradient(to right, rgba(0,0,0,.75) 0%, rgba(0,0,0,.55) 40%, rgba(0,0,0,.35) 70%, rgba(0,0,0,.25) 100%),
url('../estela.jpg');
background-size:cover;
background-position:70% center;
background-repeat:no-repeat;
display:flex;
flex-direction:column;
justify-content:center;
align-items:flex-start;
text-align:left;
padding:0 10%;
}

.hero h2{font-family:'Playfair Display',serif;font-size:64px}

.hero p{max-width:700px;font-size:20px;color:#ddd;margin:20px 0 40px}

.btn-gold{
background:#c6a55c;
color:#000;
border:none;
padding:14px 40px;
border-radius:40px;
font-weight:600;
display:inline-block
}

.section{padding:120px 8%}

.section h3{
text-align:center;
font-family:'Playfair Display',serif;
font-size:42px;
margin-bottom:70px;
color:#c6a55c
}

.property-card{
background:#1a1a22;
border:none;
border-radius:20px;
overflow:hidden;
transition:.4s;
cursor:pointer
}

.property-card:hover{
transform:translateY(-10px);
box-shadow:0 20px 50px rgba(0,0,0,.6)
}

.property-card img{
height:240px;
object-fit:cover
}

.card .p-4{
background:linear-gradient(to top, rgba(0,0,0,.85), rgba(0,0,0,.4));
position:relative;
margin-top:-90px;
color:#fff
}

.price{color:#c6a55c;font-weight:600}

.modal-content{
background:#14141b;
color:#fff;
border-radius:0
}

.modal-header{border-bottom:1px solid #333}

footer{
background:#0a0a0f;
text-align:center;
padding:25px;
color:#777
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
    background-color: black;
}