/* =====================================================
   GLOBAL RESET
===================================================== */

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

html{
scroll-behavior:smooth;
}

body{
font-family:'Cinzel Decorative', serif;
background:#E7E9F0;
color:#0A092E;
line-height:1.6;
}

img{
max-width:100%;
height:auto;
display:block;
}

a{
text-decoration:none;
color:inherit;
}

h1,h2,h3{
font-weight:700;
letter-spacing:1.5px;
}

button{
background:linear-gradient(90deg,#C6A75C,#D4AF37);
color:#fff;
border:none;
padding:12px 26px;
border-radius:30px;
cursor:pointer;
transition:0.3s;
}

button:hover{
transform:translateY(-2px);
}


/* =====================================================
   LUXURY HEADER
===================================================== */

.lux-header{
display:grid;
grid-template-columns:1fr auto 1fr;
align-items:center;
padding:25px 6%;
background:#E7E9F0;
border-bottom:1px solid #e6dfcf;
position:sticky;
top:0;
z-index:1000;
}

/* NAVIGATION */

.nav-left,
.nav-right{
display:flex;
align-items:center;
}

.nav-left{
justify-content:flex-start;
}

.nav-right{
justify-content:flex-end;
}

/* REMOVE BULLETS */

.nav-left ul,
.nav-right ul{
list-style:none;
display:flex;
gap:30px;
margin:0;
padding:0;
align-items:center;
}

/* NAV LINKS */

.nav-left a,
.nav-right a{
position:relative;
font-size:15px;
font-weight:700;
letter-spacing:2px;
text-transform:uppercase;
padding:8px 0;
}

/* GOLD HOVER LINE */

.nav-left a::after,
.nav-right a::after{
content:'';
position:absolute;
left:0;
bottom:-6px;
width:0;
height:2px;
background:#D4AF37;
transition:0.35s;
}

.nav-left a:hover::after,
.nav-right a:hover::after{
width:100%;
}

/* CENTER LOGO */

.nav-logo{
display:flex;
align-items:center;
justify-content:center;
}

.nav-logo img{
height:70px;
}

/* =====================================================
   DROPDOWN MENU
===================================================== */

.dropdown{
position:relative;
}

/* MENU CONTAINER */

.dropdown-menu{

position:absolute;

top:42px;
left:50%;

transform:translateX(-50%) translateY(12px);

background:#fff;

border-radius:10px;

padding:18px 24px;

min-width:220px;

box-shadow:0 15px 40px rgba(0,0,0,0.15);

display:flex;
flex-direction:column;

gap:12px;

opacity:0;
visibility:hidden;
pointer-events:none;

transition:all .25s ease;

z-index:999;

}

/* MENU LINKS */

.dropdown-menu a{

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

color:#0A092E;

opacity:0.85;

transition:0.3s;

}

.dropdown-menu a:hover{

color:#D4AF37;
opacity:1;

}

/* SHOW ON HOVER */

.dropdown:hover .dropdown-menu{

opacity:1;
visibility:visible;
pointer-events:auto;

transform:translateX(-50%) translateY(0);

}
/* =====================================================
   MOBILE HEADER
===================================================== */

.menu-toggle{
display:none;
}

@media(max-width:900px){

.lux-header{
grid-template-columns:1fr;
text-align:center;
gap:20px;
}

.nav-left,
.nav-right{
justify-content:center;
flex-wrap:wrap;
}

.nav-logo img{
height:60px;
}

.menu-toggle{
display:block;
font-size:26px;
cursor:pointer;
}

}
/* =====================================================
   HERO
===================================================== */

.hero{
padding:80px 6%;
text-align:center;
}

.hero h1{
font-size:40px;
margin-bottom:15px;
}

.gold-line{
width:80px;
height:2px;
background:#D4AF37;
margin:18px auto;
}


/* =====================================================
   HOME HERO IMAGE
===================================================== */

.hero-home{

height:520px;
background:url('/assets/hero-diamond.webp') center/cover no-repeat;

display:flex;
align-items:center;
justify-content:center;

position:relative;

}

.hero-overlay{

text-align:center;
color:white;

background:rgba(0,0,0,0.35);
padding:60px;
border-radius:20px;

}

.hero-overlay h1{

font-size:48px;

}

.hero-overlay p{

margin-top:10px;
font-size:18px;

}

.hero-btn{

display:inline-block;
margin-top:20px;

padding:14px 30px;

background:linear-gradient(90deg,#C6A75C,#D4AF37);
color:#fff;
border-radius:30px;

}


/* =====================================================
   SECTIONS
===================================================== */

.section{
padding:80px 6%;
}


/* =====================================================
   GRID
===================================================== */

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


/* =====================================================
   CARDS
===================================================== */

.card{

background:rgba(255,255,255,0.35);
backdrop-filter:blur(8px);

border-radius:18px;
padding:25px;

text-align:center;

border:1px solid rgba(0,0,0,0.06);

transition:0.4s;

}

.card:hover{

transform:translateY(-8px);
box-shadow:0 20px 40px rgba(0,0,0,0.12);

}

.card img{

max-width:120px;
margin:auto;
margin-bottom:15px;

filter: drop-shadow(0 8px 12px rgba(0,0,0,0.18));

}

.card h3{

font-size:18px;

}


/* =====================================================
   VIDEO WRAPPER
===================================================== */

.video-wrapper{

width:100%;
height:220px;

border-radius:16px;

background-size:cover;
background-position:center;

overflow:hidden;
position:relative;

}

.video-wrapper video{

width:100%;
height:100%;
display:none;

}


/* =====================================================
   LAYOUT PAGE
===================================================== */

.layouts-section{

max-width:1200px;
margin:auto;

}

.layouts-grid{

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

gap:60px;
margin-top:60px;

justify-items:center;

}

/* REMOVE CARD LOOK */

.layout-card{

background:none;
border:none;
box-shadow:none;
padding:0;

text-align:center;

}

/* IMAGE CONTAINER */

.layout-image{

display:flex;
justify-content:center;
align-items:center;

}

/* DIAMOND IMAGE */

.layout-image img{

width:100%;
max-width:520px;

border-radius:14px;

/* 3D ELEVATION EFFECT */

filter:drop-shadow(0 22px 40px rgba(0,0,0,0.28));

transition:transform .35s ease;

}

/* HOVER LIFT */

.layout-card:hover img{

transform:scale(1.05);

}

/* TEXT */

.layout-card h3{

margin-top:20px;
margin-bottom:14px;

font-size:20px;
letter-spacing:2px;

}

/* BUTTON */

.layout-card button{

padding:12px 30px;
font-size:14px;

}


/* =====================================================
   FORMS
===================================================== */

form{

max-width:600px;
margin:auto;

}

input,textarea,select{

width:100%;
padding:12px;

margin-bottom:15px;

border:1px solid #ddd;
border-radius:6px;

font-family:inherit;

}

textarea{
resize:vertical;
}


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

.layout-popup{

position:fixed;

top:0;
left:0;

width:100%;
height:100%;

background:rgba(0,0,0,0.6);

display:none;
align-items:center;
justify-content:center;

z-index:999;

}

.layout-box{

background:#F5EFE3;

padding:40px;

border-radius:18px;
width:360px;

text-align:center;

position:relative;

box-shadow:0 25px 60px rgba(0,0,0,0.18);

}

.layout-box select{

width:100%;
padding:10px;
margin-bottom:20px;

}

.popup-buttons button{
margin:6px;
}


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

.site-footer{

background:#091A2E;
color:#fff;

padding:70px 6%;
margin-top:80px;

}

.footer-grid{

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

gap:40px;

}

.footer-column h3{

color:#D4AF37;
margin-bottom:15px;

}

.footer-column ul{
list-style:none;
}

.footer-column li{
margin-bottom:10px;
}

.footer-column a{
opacity:0.85;
}

.footer-column a:hover{
color:#D4AF37;
opacity:1;
}

.footer-bottom{

margin-top:40px;

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

padding-top:20px;
text-align:center;

}

.footer-tagline{

color:#D4AF37;
margin-top:5px;

}


/* =====================================================
   SOCIAL SIDEBAR
===================================================== */

.social-sidebar {
    position: fixed;
    top: 40%;
    left: 8px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    z-index: 9999;
}

/* Icon container */
.social-item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    transition: transform 0.3s ease;
}

/* Icon style */
.social-item img,
.social-item lottie-player {
    width: 28px;
    height: 28px;
}

/* Hover effect */
.social-item:hover {
    transform: scale(1.25);
}
/* =====================================================
   MOBILE
===================================================== */

.menu-toggle{
display:none;
font-size:26px;
cursor:pointer;
}

@media(max-width:900px){

.lux-header{

grid-template-columns:1fr;

text-align:center;
gap:20px;

}

.nav-left,
.nav-right{

justify-content:center;
flex-wrap:wrap;

}

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

.layouts-grid{
grid-template-columns:1fr;
}

.footer-grid{
grid-template-columns:1fr;
text-align:center;
}

.social-sidebar{
display:none;
}

.hero-overlay{
padding:40px;
}

.hero-overlay h1{
font-size:32px;
}

.hero-home{
height:400px;
}

}

@media(max-width:480px){

.grid{
grid-template-columns:1fr;
}

.hero h1{
font-size:26px;
}

button{
width:100%;
}

}
/* ================= ANTIQUE SHAPES ================= */

.antique-grid{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:35px;
margin-top:40px;
}

.antique-card{

background:transparent;
border:1px solid #e6dfcf;
border-radius:20px;
padding:35px 25px;

text-align:center;

transition:0.35s;

box-shadow:0 10px 25px rgba(0,0,0,0.05);

}

.antique-card:hover{

transform:translateY(-8px);
box-shadow:0 20px 45px rgba(0,0,0,0.12);

}

.antique-card img{

width:90px;
margin:auto;
margin-bottom:15px;

filter:drop-shadow(0 6px 10px rgba(0,0,0,0.15));

}

.antique-card h3{

font-size:16px;
margin-bottom:12px;
letter-spacing:1px;

}

.antique-card button{

background:linear-gradient(90deg,#C6A75C,#D4AF37);
border:none;
border-radius:30px;
padding:10px 22px;
color:#fff;
font-size:13px;
cursor:pointer;

}
@media(max-width:1100px){
.antique-grid{
grid-template-columns:repeat(3,1fr);
}
}

@media(max-width:600px){
.antique-grid{
grid-template-columns:repeat(2,1fr);
}
}
/* =====================================================
   POPUP ICON ENQUIRY
===================================================== */

.popup-icons{

display:flex;
justify-content:center;
align-items:center;

gap:40px;
margin-top:28px;

}

/* ICON CONTAINER */

.popup-icons a{

display:flex;
align-items:center;
justify-content:center;

width:50px;
height:50px;

cursor:pointer;

transition:transform .25s ease;

}

/* HOVER EFFECT */

.popup-icons a:hover{

transform:scale(1.18);

}

/* LOTTIE ICON SIZE */

.popup-icon{

width:42px;
height:42px;

pointer-events:none;

}

/* CLOSE ICON IF USED SEPARATELY */

.popup-close{

position:absolute;

top:18px;
right:18px;

display:flex;
align-items:center;
justify-content:center;

width:32px;
height:32px;

cursor:pointer;
z-index:10;

}

.close-icon{

width:26px;
height:26px;

}
/* VISITOR POPUP */

.visitor-popup{

position:fixed;
top:0;
left:0;

width:100%;
height:100%;

background:rgba(0,0,0,0.65);

display:none;
align-items:center;
justify-content:center;

z-index:99999;

}

.visitor-popup-box{

background:#F5EFE3;

padding:40px;

border-radius:18px;

width:380px;

text-align:center;

box-shadow:0 25px 60px rgba(0,0,0,0.25);

position:relative;

}

.visitor-popup-box h2{

margin-bottom:10px;

}

.visitor-popup-box p{

margin-bottom:20px;

font-size:14px;

}

.visitor-popup-box input{

width:100%;
padding:12px;

border:1px solid #ddd;

border-radius:6px;

margin-bottom:15px;

}

.popup-close{

position:absolute;

top:12px;
right:15px;

font-size:18px;

cursor:pointer;

}
.visitor-popup-box select{

width:100%;
padding:12px;
margin-bottom:15px;

border:1px solid #ddd;
border-radius:6px;

font-family:inherit;

}