*{
margin:0;
padding:0;
box-sizing:border-box;
}


body{

background:#030913;

color:white;

font-family:'Poppins',sans-serif;

}



.header{

height:90px;

width:100%;

position:fixed;

top:0;

left:0;

z-index:1000;

display:flex;

align-items:center;

justify-content:space-between;

padding:0 4%;


background:rgba(3,9,19,0.75);

backdrop-filter:blur(15px);

border-bottom:1px solid rgba(212,175,55,.25);

}



/* LOGO */


.logo-area{

display:flex;

align-items:center;

gap:15px;

}


.logo-area img{

width:60px;

height:60px;

object-fit:contain;

}


.logo-text h2{

font-family:'Cinzel',serif;

font-size:20px;

letter-spacing:2px;

font-weight:500;

}


.logo-text p{

font-size:12px;

letter-spacing:4px;

color:#D4AF37;

}





/* MENU */


nav ul{

display:flex;

gap:35px;

list-style:none;

}


nav li{

font-size:13px;

color:#ddd;

cursor:pointer;

position:relative;

/* =====================================
   DEVELOPERS PAGE
===================================== */


.developers-page{

    padding:100px 6%;
    background:#030913;

}



.developers-page .section-title{

    text-align:center;
    margin-bottom:60px;

}


.developers-page .section-title p{

    color:#D4AF37;
    letter-spacing:3px;
    font-size:14px;
    margin-bottom:15px;

}


.developers-page .section-title h2{

    color:#ffffff;
    font-size:42px;
    font-weight:600;

}





/* DEVELOPER GRID */


.developer-container{

    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:30px;

}





/* DEVELOPER CARD */


.developer-card{

    background:#0b1525;
    padding:35px 25px;
    text-align:center;
    border:1px solid rgba(212,175,55,0.25);
    min-height:360px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    transition:0.4s;

}



.developer-card:hover{

    transform:translateY(-12px);
    border-color:#D4AF37;
    box-shadow:0 15px 40px rgba(0,0,0,0.5);

}




.developer-card img{

    width:150px;
    height:90px;
    object-fit:contain;
    margin:0 auto 25px;

}




.developer-card h3{

    color:#D4AF37;
    font-size:24px;
    margin-bottom:15px;

}




.developer-card p{

    color:#c8c8c8;
    font-size:15px;
    line-height:1.7;
    min-height:70px;

}




.developer-card a{

    display:inline-block;
    margin-top:25px;
    padding:12px 28px;
    background:#D4AF37;
    color:#000;
    text-decoration:none;
    font-weight:600;
    transition:0.3s;

}



.developer-card a:hover{

    background:#ffffff;

}







/* CONTACT SECTION */


.developer-contact{

    padding:90px 10%;
    text-align:center;
    background:#080f1c;

}



.developer-contact h2{

    color:#ffffff;
    font-size:40px;
    margin-bottom:20px;

}



.developer-contact p{

    color:#cccccc;
    font-size:18px;

}



.developer-contact a{

    display:inline-block;
    margin-top:30px;
    padding:15px 45px;
    background:#D4AF37;
    color:#000;
    text-decoration:none;
    font-weight:bold;

}



.developer-contact a:hover{

    background:white;

}







/* RESPONSIVE TABLET */


@media(max-width:1200px){


.developer-container{

    grid-template-columns:repeat(3,1fr);

}


}







/* RESPONSIVE MOBILE */


@media(max-width:768px){


.developers-page{

    padding:70px 5%;

}



.developers-page .section-title h2{

    font-size:32px;

}



.developer-container{

    grid-template-columns:1fr;

}



.developer-card{

    min-height:auto;

}



.developer-contact h2{

    font-size:30px;

}


}

}


nav li.active{

color:#D4AF37;

}


nav li.active:after{

content:"";

position:absolute;

height:2px;

width:40px;

background:#D4AF37;

bottom:-15px;

left:0;

}






/* RIGHT */


.header-right{

display:flex;

align-items:center;

gap:18px;

}


.consult-btn{

padding:12px 22px;

border:1px solid #D4AF37;

border-radius:4px;

font-size:12px;

color:#D4AF37;

}





.menu-icon{

width:40px;

height:40px;

border:1px solid rgba(255,255,255,.4);

border-radius:50%;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

gap:5px;

}


.menu-icon span{

width:15px;

height:1px;

background:white;

}

/* =====================
   HERO SECTION
===================== */


.hero{

height:100vh;

width:100%;

position:relative;

background-image:url("../images/hero/dubai.jpg");

background-size:cover;

background-position:center;

display:flex;

align-items:center;

padding:0 6%;

overflow:hidden;

}



.hero-overlay{

position:absolute;

top:0;

left:0;

width:100%;

height:100%;

background:

linear-gradient(

90deg,

rgba(3,9,19,.95),

rgba(3,9,19,.55),

rgba(3,9,19,.85)

);

}



.hero-content{

position:relative;

z-index:2;

max-width:650px;

margin-top:70px;

}



.hero-small{

color:#D4AF37;

font-size:13px;

letter-spacing:4px;

margin-bottom:25px;

}



.hero h1{

font-family:'Cinzel',serif;

font-size:70px;

line-height:1.15;

font-weight:600;

letter-spacing:3px;

}



.hero h1 span{

color:#D4AF37;

}



.hero-desc{

margin-top:25px;

font-size:17px;

color:#ddd;

line-height:1.8;

max-width:500px;

}





.hero-buttons{

display:flex;

gap:20px;

margin-top:40px;

}



.gold-btn{

padding:16px 35px;

background:#D4AF37;

color:#050505;

font-size:13px;

letter-spacing:1px;

}



.video-btn{

padding:16px 35px;

border:1px solid rgba(255,255,255,.4);

color:white;

font-size:13px;

}





/* SEARCH BOX */


.search-box{

position:absolute;

right:7%;

bottom:12%;

width:350px;

padding:35px;

background:

rgba(255,255,255,.08);

backdrop-filter:blur(20px);

border:

1px solid rgba(212,175,55,.35);

z-index:3;

border-radius:10px;

}



.search-box h3{

font-family:'Cinzel',serif;

margin-bottom:25px;

font-size:22px;

}



.search-item{

margin-bottom:15px;

}



.search-item select{

width:100%;

padding:14px;

background:#07101f;

border:1px solid rgba(255,255,255,.2);

color:white;

}



.search-box button{

width:100%;

padding:15px;

background:#D4AF37;

border:none;

font-weight:600;

letter-spacing:1px;

}






@media(max-width:900px){


.hero h1{

font-size:45px;

}


.search-box{

display:none;

}


nav{

display:none;

}


}

/* =====================
FEATURE SECTION
===================== */


.features{

padding:100px 6%;

background:#030913;

}



.section-title{

text-align:center;

margin-bottom:60px;

}



.section-title p{

color:#D4AF37;

letter-spacing:4px;

font-size:13px;

}



.section-title h2{

font-family:'Cinzel',serif;

font-size:42px;

margin-top:15px;

}





.feature-container{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

}




.feature-card{

padding:40px 30px;

text-align:center;


background:

rgba(255,255,255,.05);


border:1px solid rgba(212,175,55,.25);


backdrop-filter:blur(15px);


transition:.4s;


}



.feature-card:hover{


transform:translateY(-10px);


border-color:#D4AF37;


}





.feature-icon{


width:70px;

height:70px;

margin:auto;

margin-bottom:25px;


border-radius:50%;


border:1px solid #D4AF37;


display:flex;

align-items:center;

justify-content:center;


font-size:28px;


color:#D4AF37;


}





.feature-card h3{


font-family:'Cinzel',serif;


font-size:22px;


margin-bottom:15px;


}



.feature-card p{


color:#aaa;


line-height:1.7;


font-size:14px;


}





@media(max-width:1000px){


.feature-container{

grid-template-columns:repeat(2,1fr);

}


}



@media(max-width:600px){


.feature-container{

grid-template-columns:1fr;

}


.section-title h2{

font-size:30px;

}


}

/* ==========================
   LUXURY PROPERTY CARDS FINAL
   ========================== */


.property-container{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}





.property-card{

height:480px;

position:relative;

overflow:hidden;

border-radius:20px;

border:1px solid rgba(212,175,55,.35);

background:#050b16;

}





.property-card img{

width:100%;

height:100%;

object-fit:cover;

transition:.6s;

}





.property-card:hover img{

transform:scale(1.08);

}





/* Luxury dark overlay */

.property-card:after{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(

to top,

rgba(3,9,19,0.95),

rgba(3,9,19,0.20)

);

z-index:1;

}





/* Price badge */

.property-price{

position:absolute;

top:25px;

right:25px;

background:#D4AF37;

color:#050505;

padding:10px 22px;

font-size:14px;

font-weight:600;

border-radius:30px;

z-index:2;

}





/* Content directly on image */

.property-glass{

position:absolute;

bottom:30px;

left:30px;

right:30px;

z-index:2;

}





.property-glass h3{

font-family:'Cinzel',serif;

font-size:30px;

font-weight:600;

margin-bottom:10px;

color:white;

}





.property-glass p{

font-size:14px;

color:#ddd;

margin-bottom:25px;

}





/* Buttons */

.property-buttons{

display:flex;

gap:12px;

}





.property-buttons a{

flex:1;

padding:13px 20px;

border-radius:30px;

text-align:center;

font-size:13px;

font-weight:500;

cursor:pointer;

transition:.3s;

}





.call-btn{

background:white;

color:#111;

}





.whatsapp-btn{

background:#25D366;

color:white;

}





.property-buttons a:hover{

transform:translateY(-5px);

}





/* Mobile */

@media(max-width:1000px){


.property-container{

grid-template-columns:1fr;

}


.property-card{

height:450px;

}


}

/* ==========================
   LUXURY STATISTICS SECTION
========================== */


.stats-section{

padding:100px 6%;

background:

linear-gradient(

135deg,

#030913,

#081525

);

border-top:1px solid rgba(212,175,55,.15);

border-bottom:1px solid rgba(212,175,55,.15);

}




.stats-container{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

}





.stat-card{

text-align:center;

padding:40px 20px;


background:

rgba(255,255,255,.04);


border:

1px solid rgba(212,175,55,.25);


border-radius:15px;


transition:.4s;


}




.stat-card:hover{


transform:translateY(-8px);


border-color:#D4AF37;


}





.stat-card h2{


font-family:'Cinzel',serif;


font-size:55px;


color:#D4AF37;


margin-bottom:15px;


}




.stat-card p{


color:#ddd;


font-size:14px;


letter-spacing:2px;


text-transform:uppercase;


}





@media(max-width:1000px){


.stats-container{

grid-template-columns:repeat(2,1fr);

}


}



@media(max-width:600px){


.stats-container{

grid-template-columns:1fr;

}


.stat-card h2{

font-size:42px;

}


}

/* ==========================
   DEVELOPERS SECTION
========================== */


.developers{

padding:100px 6%;

background:#050b16;

}





.developer-container{


display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;


}




.developer-card{


height:180px;


display:flex;

flex-direction:column;

align-items:center;

justify-content:center;


background:

rgba(255,255,255,.05);


border:

1px solid rgba(212,175,55,.25);


border-radius:15px;


backdrop-filter:blur(15px);


transition:.4s;


}





.developer-card:hover{


transform:translateY(-10px);


border-color:#D4AF37;


}




.developer-card img{


max-width:150px;


max-height:70px;


object-fit:contain;


margin-bottom:20px;


filter:brightness(0) invert(1);


}




.developer-card h3{


font-family:'Cinzel',serif;


font-size:18px;


color:#D4AF37;


}





@media(max-width:900px){


.developer-container{


grid-template-columns:repeat(2,1fr);


}


}




@media(max-width:600px){


.developer-container{


grid-template-columns:1fr;


}


}

/* ==========================
   COMMUNITIES SECTION
========================== */


.communities{

padding:100px 6%;

background:#030913;

}





.community-container{


display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;


}





.community-card{


height:350px;

position:relative;

overflow:hidden;

border-radius:20px;

border:1px solid rgba(212,175,55,.3);


}





.community-card img{


width:100%;

height:100%;

object-fit:cover;

transition:.6s;


}





.community-card:hover img{


transform:scale(1.1);


}





.community-card:after{


content:"";

position:absolute;

inset:0;


background:

linear-gradient(

transparent,

rgba(3,9,19,.95)

);


}





.community-content{


position:absolute;


bottom:30px;

left:30px;


z-index:2;


}





.community-content h3{


font-family:'Cinzel',serif;


font-size:28px;


color:white;


margin-bottom:10px;


}





.community-content p{


color:#D4AF37;


font-size:14px;


}





@media(max-width:1000px){


.community-container{

grid-template-columns:repeat(2,1fr);

}


}




@media(max-width:600px){


.community-container{

grid-template-columns:1fr;

}


}

/* ==========================
ABOUT PAGE FINAL
========================== */


.about-page-hero{

height:60vh;

background:url("../images/about/about.jpg");

background-size:cover;

background-position:center;

position:relative;

display:flex;

align-items:center;

justify-content:center;

text-align:center;

}


.about-page-overlay{

position:absolute;

inset:0;

background:rgba(3,9,19,.75);

}


.about-page-hero-text{

position:relative;

z-index:2;

}


.about-page-hero-text h1{

font-family:'Cinzel',serif;

font-size:65px;

color:#D4AF37;

}


.about-page-hero-text p{

color:white;

font-size:18px;

}





.about-company{

padding:120px 6%;

background:#050b16;

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}



.about-company-image img{

width:100%;

height:520px;

object-fit:cover;

border-radius:20px;

}





.about-company-content span{

color:#D4AF37;

letter-spacing:3px;

font-size:13px;

}



.about-company-content h2{

font-family:'Cinzel',serif;

font-size:45px;

margin:20px 0;

}



.about-company-content p{

color:#aaa;

line-height:1.8;

margin-bottom:20px;

}





.about-box-section{

padding:100px 6%;

background:#030913;

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}




.about-box{

padding:40px;

background:rgba(255,255,255,.05);

border:1px solid rgba(212,175,55,.25);

border-radius:20px;

text-align:center;

}



.about-box h3{

font-family:'Cinzel',serif;

color:#D4AF37;

font-size:25px;

margin-bottom:15px;

}



.about-box p{

color:#aaa;

line-height:1.7;

}



@media(max-width:900px){


.about-company{

grid-template-columns:1fr;

}


.about-box-section{

grid-template-columns:1fr;

}


.about-page-hero-text h1{

font-size:40px;

}


}

/* Remove default link style */

a{

text-decoration:none;

}


/* Gold buttons */

.gold-btn{

display:inline-block;

background:#D4AF37;

color:#050505 !important;

padding:16px 35px;

font-size:13px;

letter-spacing:1px;

font-weight:500;

border-radius:3px;

text-decoration:none !important;

transition:.3s;

}



.gold-btn:hover{

background:white;

color:#050505 !important;

}

nav a{

color:inherit;

text-decoration:none;

}

/* ==========================
CONTACT SECTION
========================== */


.contact-section{

padding:120px 6%;

background:

linear-gradient(

135deg,

#050b16,

#030913

);

}





.contact-container{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}





.contact-title{

color:#D4AF37;

letter-spacing:4px;

font-size:13px;

}



.contact-info h2{

font-family:'Cinzel',serif;

font-size:45px;

margin:20px 0;

}




.contact-info>p{

color:#aaa;

line-height:1.8;

margin-bottom:35px;

}





.contact-item{

margin-bottom:25px;

padding-left:20px;

border-left:2px solid #D4AF37;

}





.contact-item h4{

color:#D4AF37;

margin-bottom:8px;

}



.contact-item p{

color:white;

}





.contact-form{


padding:40px;


background:

rgba(255,255,255,.06);


border:

1px solid rgba(212,175,55,.3);


backdrop-filter:blur(15px);


border-radius:20px;


}




.contact-form h3{


font-family:'Cinzel',serif;


font-size:28px;


margin-bottom:25px;


}





.contact-form input,

.contact-form select,

.contact-form textarea{


width:100%;

padding:15px;

margin-bottom:15px;


background:#07101f;


border:

1px solid rgba(255,255,255,.2);


color:white;


border-radius:5px;


}





.contact-form textarea{

height:120px;

resize:none;

}





.contact-form button{


width:100%;


padding:16px;


background:#D4AF37;


border:none;


font-weight:600;


cursor:pointer;


letter-spacing:1px;


}




.contact-form button:hover{


background:white;


}





@media(max-width:900px){


.contact-container{


grid-template-columns:1fr;


}


.contact-info h2{


font-size:35px;


}


}

/* ==========================
FOOTER
========================== */


.footer{

background:#020711;

padding:80px 6% 20px;

border-top:1px solid rgba(212,175,55,.2);

}





.footer-container{

display:grid;

grid-template-columns:2fr 1fr 1fr 1fr;

gap:40px;

}





.footer-brand h2{

font-family:'Cinzel',serif;

font-size:28px;

letter-spacing:2px;

color:white;

}



.footer-brand p{

color:#D4AF37;

letter-spacing:4px;

font-size:12px;

margin-bottom:20px;

}




.footer-brand span{

color:#aaa;

line-height:1.8;

font-size:14px;

}





.footer-column h3{

font-family:'Cinzel',serif;

color:#D4AF37;

margin-bottom:25px;

font-size:20px;

}





.footer-column a{

display:block;

color:#aaa;

text-decoration:none;

margin-bottom:12px;

font-size:14px;

}



.footer-column a:hover{

color:#D4AF37;

}




.footer-column p{

color:#aaa;

margin-bottom:15px;

font-size:14px;

}





.footer-bottom{

margin-top:60px;

padding-top:20px;

border-top:1px solid rgba(255,255,255,.1);

text-align:center;

}





.footer-bottom p{

color:#777;

font-size:13px;

}






/* ==========================
WHATSAPP FLOAT BUTTON
========================== */


.whatsapp-float{


position:fixed;

right:30px;

bottom:30px;


width:60px;

height:60px;


border-radius:50%;


background:#25D366;


color:white;


display:flex;


align-items:center;


justify-content:center;


font-size:28px;


text-decoration:none;


z-index:999;


box-shadow:0 10px 30px rgba(0,0,0,.4);


transition:.3s;


}



.whatsapp-float:hover{


transform:scale(1.1);


}






@media(max-width:900px){


.footer-container{

grid-template-columns:1fr 1fr;

}


}




@media(max-width:600px){


.footer-container{

grid-template-columns:1fr;

}


.whatsapp-float{

right:20px;

bottom:20px;

}


}

/* ==========================
MOBILE MENU
========================== */


@media(max-width:900px){


nav{

position:absolute;

top:90px;

left:0;

width:100%;

background:#030913;

display:none;

padding:30px;

}



nav ul{

flex-direction:column;

gap:25px;

}



nav.mobile-active{

display:block;

}



.header{

padding:0 20px;

}



.logo-text h2{

font-size:15px;

}


}

/* ==========================
SCROLL ANIMATION
========================== */


section{

opacity:0;

transform:translateY(40px);

transition:1s ease;

}



section.show-section{

opacity:1;

transform:translateY(0);

}


/* Keep hero visible */

.hero{

opacity:1;

transform:none;

}

/* ==========================
PROPERTIES PAGE
========================== */


.properties-page{

padding:100px 6%;

background:#030913;

}

/* =====================================
   LUXURY DEVELOPER CARDS
===================================== */


.developer-container{

    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:35px;

}





.developer-card{

    background:
    linear-gradient(
    145deg,
    #111c2d,
    #050b14
    );

    border:1px solid rgba(212,175,55,0.35);

    padding:50px 30px;

    text-align:center;

    min-height:380px;

    position:relative;

    overflow:hidden;

    transition:0.5s;

}





.developer-card:before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:3px;

    background:#D4AF37;

    transform:scaleX(0);

    transition:.5s;

}



.developer-card:hover:before{

    transform:scaleX(1);

}




.developer-card:hover{

    transform:translateY(-15px);

    border-color:#D4AF37;

}





/* LOGO */


.developer-card img{

    width:180px;

    height:110px;

    object-fit:contain;

    margin-bottom:45px;

}







/* NAME */


.developer-card h3{

    color:#ffffff;

    font-size:24px;

    letter-spacing:1px;

    margin-bottom:20px;

}






.developer-card h3::after{

    content:"";

    display:block;

    width:45px;

    height:2px;

    background:#D4AF37;

    margin:15px auto;

}





/* DESCRIPTION */


.developer-card p{

    color:#b8b8b8;

    font-size:14px;

    line-height:1.8;

    padding:0 10px;

}





/* BUTTON */


.developer-card a{

    margin-top:30px;

    display:inline-block;

    padding:12px 35px;

    border:1px solid #D4AF37;

    color:#D4AF37;

    text-decoration:none;

    font-size:14px;

    letter-spacing:1px;

    transition:.3s;

}



.developer-card a:hover{

    background:#D4AF37;

    color:#000;

}






@media(max-width:1200px){

.developer-container{

grid-template-columns:repeat(3,1fr);

}

}




@media(max-width:768px){

.developer-container{

grid-template-columns:1fr;

}

}

/* =====================================
   DEVELOPER CONTACT SECTION
===================================== */


.developer-contact{

    width:100%;

    padding:100px 8%;

    background:#080f1c;

    text-align:center;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

}



.developer-contact h2{

    color:#ffffff;

    font-size:42px;

    font-weight:600;

    margin:0 0 20px;

    line-height:1.3;

}



.developer-contact p{

    color:#c8c8c8;

    font-size:18px;

    max-width:700px;

    line-height:1.8;

    margin:0 auto;

}



.developer-contact a{

    margin-top:35px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:15px 45px;

    background:#D4AF37;

    color:#000;

    text-decoration:none;

    font-weight:600;

    min-width:170px;

    transition:.3s;

}



.developer-contact a:hover{

    background:#ffffff;

}


/* =====================================
   SERVICES PAGE
===================================== */


.services-page{

    padding:100px 6%;

    background:#030913;

}





.services-page .section-title{

    text-align:center;

    margin-bottom:70px;

}



.services-page .section-title p{

    color:#D4AF37;

    font-size:14px;

    letter-spacing:3px;

    margin-bottom:15px;

}



.services-page .section-title h2{

    color:#ffffff;

    font-size:42px;

    font-weight:600;

}






/* SERVICES GRID */


.services-container{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:35px;

}







/* SERVICE CARD */


.service-card{

    background:

    linear-gradient(
    145deg,
    #111c2d,
    #050b14
    );


    border:1px solid rgba(212,175,55,0.25);


    padding:45px 30px;


    text-align:center;


    min-height:390px;


    display:flex;

    flex-direction:column;

    align-items:center;


    transition:.4s;


}




.service-card:hover{


    transform:translateY(-12px);


    border-color:#D4AF37;


    box-shadow:

    0 20px 45px rgba(0,0,0,.5);


}





/* ICON */


.service-icon{


    width:80px;

    height:80px;


    display:flex;

    align-items:center;

    justify-content:center;


    font-size:38px;


    margin-bottom:30px;


    border:1px solid #D4AF37;


    border-radius:50%;


}







.service-card h3{


    color:#ffffff;


    font-size:24px;


    margin-bottom:18px;


}





.service-card p{


    color:#c5c5c5;


    font-size:15px;


    line-height:1.8;


    margin-bottom:auto;


}






/* BUTTON */


.service-card a{


    margin-top:30px;


    padding:12px 30px;


    border:1px solid #D4AF37;


    color:#D4AF37;


    text-decoration:none;


    font-size:14px;


    transition:.3s;


}





.service-card a:hover{


    background:#D4AF37;


    color:#000;


}









/* CONTACT CTA */


.service-contact{


    padding:100px 8%;


    text-align:center;


    background:#080f1c;


    display:flex;


    flex-direction:column;


    align-items:center;


}





.service-contact h2{


    color:white;


    font-size:42px;


    margin-bottom:20px;


}




.service-contact p{


    color:#cccccc;


    font-size:18px;


    max-width:700px;


    line-height:1.8;


}




.service-contact a{


    margin-top:35px;


    padding:15px 45px;


    background:#D4AF37;


    color:#000;


    text-decoration:none;


    font-weight:600;


    transition:.3s;


}



.service-contact a:hover{


    background:white;


}









/* TABLET */


@media(max-width:1200px){


.services-container{


grid-template-columns:repeat(3,1fr);


}


}









/* MOBILE */


@media(max-width:768px){


.services-page{


padding:70px 5%;


}



.services-page .section-title h2{


font-size:32px;


}



.services-container{


grid-template-columns:1fr;


}



.service-contact h2{


font-size:30px;


}


}

/* =====================================
   CONTACT PAGE
===================================== */


.contact-page{

padding:100px 6%;

background:#030913;

}





.contact-page .section-title{

text-align:center;

margin-bottom:60px;

}




.contact-page .section-title p{

color:#D4AF37;

letter-spacing:3px;

font-size:14px;

}




.contact-page .section-title h2{

color:white;

font-size:42px;

}





.contact-container{

display:grid;

grid-template-columns:1fr 1fr;

gap:50px;

}







/* CONTACT INFO */


.contact-info{

background:#0b1525;

padding:45px;

border:1px solid rgba(212,175,55,.25);

}



.contact-info h3,
.contact-form h3{

color:#D4AF37;

font-size:28px;

margin-bottom:35px;

}





.contact-item{

display:flex;

gap:20px;

margin-bottom:25px;

align-items:center;

}



.contact-item span{

font-size:25px;

}



.contact-item p{

color:#ccc;

}



.contact-item a{

color:#ccc;

text-decoration:none;

}





.contact-whatsapp{

display:inline-block;

margin-top:25px;

padding:14px 35px;

background:#D4AF37;

color:#000;

text-decoration:none;

font-weight:bold;

}







/* FORM */


.contact-form{

background:#0b1525;

padding:45px;

border:1px solid rgba(212,175,55,.25);

}



.contact-form input,
.contact-form select,
.contact-form textarea{


width:100%;

padding:15px;

margin-bottom:20px;

background:#050b14;

border:1px solid #333;

color:white;

font-size:15px;

}



.contact-form textarea{

height:130px;

resize:none;

}




.contact-form button{

width:100%;

padding:16px;

background:#D4AF37;

border:none;

font-weight:bold;

cursor:pointer;

}






/* MAP */


.map-section iframe{

width:100%;

height:450px;

border:0;

}







@media(max-width:768px){


.contact-container{

grid-template-columns:1fr;

}


.contact-page{

padding:70px 5%;

}


.contact-page .section-title h2{

font-size:32px;

}


}

/* ===================================
 MODERN LUXURY PROPERTY PAGE
=================================== */


.property-cover{

height:75vh;
position:relative;
overflow:hidden;

}


.property-cover img{

width:100%;
height:100%;
object-fit:cover;

}


.cover-overlay{

position:absolute;
inset:0;

background:linear-gradient(
to top,
rgba(3,9,19,.9),
transparent
);

}



.cover-content{

position:absolute;

bottom:70px;

left:7%;

color:white;

}



.cover-content h1{

font-size:55px;
font-weight:600;

}



.cover-content p{

font-size:20px;
color:#ddd;

}





.property-details-modern{

background:#030913;

padding:80px 7%;

}




.property-main-card,
.property-box,
.property-contact-box{

background:#0b1525;

border-radius:25px;

padding:45px;

margin-bottom:35px;

border:1px solid rgba(212,175,55,.2);

}





.property-title-box{

display:flex;

justify-content:space-between;

align-items:center;

}



.property-title-box span{

color:#D4AF37;

letter-spacing:3px;

font-size:13px;

}



.property-title-box h2{

color:white;

font-size:38px;

margin:20px 0;

}



.property-title-box p{

color:#aaa;

}





.price-box{

background:#D4AF37;

color:#000;

padding:25px 45px;

border-radius:15px;

font-size:35px;

font-weight:bold;

}






.property-stats{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

margin-top:40px;

}



.property-stats div{

background:#050b14;

padding:30px;

text-align:center;

border-radius:15px;

}



.property-stats h3{

color:#D4AF37;

font-size:35px;

}



.property-stats p{

color:#ccc;

}






.property-box h2,
.property-contact-box h2{

color:white;

font-size:32px;

}



.property-box p{

color:#ccc;

line-height:1.9;

font-size:17px;

}






.amenity-cards{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:20px;

}



.amenity-cards div{

background:#050b14;

padding:30px;

text-align:center;

color:white;

border-radius:15px;

line-height:2;

}






.property-images{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:20px;

}



.property-images img{

width:100%;

height:250px;

object-fit:cover;

border-radius:15px;

}





.property-contact-box{

text-align:center;

}



.property-contact-box p{

color:#aaa;

}



.property-contact-box a{

display:inline-block;

margin:20px 10px 0;

padding:15px 40px;

background:#D4AF37;

color:#000;

text-decoration:none;

border-radius:30px;

font-weight:bold;

}





@media(max-width:900px){


.property-title-box{

flex-direction:column;

align-items:flex-start;

gap:30px;

}


.property-stats{

grid-template-columns:repeat(2,1fr);

}


.amenity-cards,
.property-images{

grid-template-columns:1fr;

}


.cover-content h1{

font-size:35px;

}

}

/* ================================
CONSULTATION POPUP
================================ */


.consult-popup{

display:none;

position:fixed;

top:0;
left:0;

width:100%;
height:100%;

background:rgba(0,0,0,.75);

z-index:99999;

align-items:center;

justify-content:center;

}




.consult-box{

width:420px;

background:#0b1525;

padding:40px;

border-radius:20px;

border:1px solid #D4AF37;

position:relative;

}



.consult-box h2{

color:white;

text-align:center;

font-size:28px;

}



.consult-box p{

color:#ccc;

text-align:center;

margin-bottom:25px;

}




.consult-box input,
.consult-box select{


width:100%;

padding:15px;

margin-bottom:15px;

background:#050b14;

border:1px solid #333;

border-radius:8px;

color:white;

}



.consult-box button{


width:100%;

padding:16px;

background:#D4AF37;

border:none;

border-radius:30px;

font-weight:bold;

cursor:pointer;

}



.close-popup{

position:absolute;

right:20px;

top:10px;

font-size:30px;

color:white;

cursor:pointer;

}



@media(max-width:500px){

.consult-box{

width:90%;

}

}

/* ==================================
DYNAMIC PROPERTY CARDS
================================== */


.property-container{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:35px;

}



.property-card{

position:relative;

height:480px;

overflow:hidden;

border-radius:25px;

background:#0b1525;

border:1px solid rgba(212,175,55,.2);

}



.property-card img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}



.property-card:hover img{

transform:scale(1.08);

}





.property-glass{


position:absolute;

bottom:0;

left:0;

width:100%;

padding:30px;


background:linear-gradient(
transparent,
rgba(0,0,0,.9)
);


color:white;

}




.property-glass h3{

font-size:28px;

}



.property-glass p{

color:#ddd;

}





.property-price{

position:absolute;

top:25px;

right:25px;

background:#D4AF37;

color:#000;

padding:12px 20px;

border-radius:30px;

font-weight:bold;

z-index:2;

}





.property-glass a{


display:inline-block;

margin-top:15px;

background:#D4AF37;

color:#000;

padding:12px 25px;

border-radius:30px;

text-decoration:none;

font-weight:bold;


}





@media(max-width:900px){


.property-container{

grid-template-columns:1fr;

}


}