.site-header{
position:sticky;
top:0;
z-index:1000;
background:rgba(247,243,236,0.92);
backdrop-filter:blur(10px);
border-bottom:1px solid rgba(176,141,87,0.18);
}
.header-inner{
max-width:var(--max-width);
margin:0 auto;
padding:14px 48px;
display:flex;
align-items:center;
justify-content:space-between;
}
.logo-link{
display:flex;
align-items:center;
gap:10px;
}
.logo-emblem{
height:38px;
width:auto;
}
.logo-wordmark{
display:flex;
flex-direction:column;
line-height:1.15;
}
.logo-wordmark .title{
font-family:var(--serif);
font-size:16px;
letter-spacing:0.06em;
color:var(--charcoal);
font-weight:600;
}
.logo-wordmark .sub{
font-family:var(--sans);
font-size:8px;
letter-spacing:0.18em;
color:var(--gold);
font-weight:400;
margin-top:2px;
}
nav.main-nav{
display:flex;
align-items:center;
gap:36px;
}
nav.main-nav a{
font-size:11.5px;
letter-spacing:0.12em;
text-transform:uppercase;
color:var(--charcoal-soft);
font-weight:400;
transition:color 0.25s ease;
position:relative;
}
nav.main-nav a::after{
content:'';
position:absolute;
left:0; bottom:-6px;
width:0; height:1px;
background:var(--gold);
transition:width 0.25s ease;
}
nav.main-nav a:hover{color:var(--gold);}
nav.main-nav a:hover::after{width:100%;}
.nav-item-dropdown{position:relative;padding-bottom:18px;margin-bottom:-18px;}
.nav-item-dropdown>.nav-dropdown-toggle{
display:inline-flex;
align-items:center;
gap:5px;
cursor:pointer;
background:none;
border:none;
font:inherit;
padding:0;
}
.nav-item-dropdown .caret{
width:7px;height:7px;
border-right:1px solid currentColor;
border-bottom:1px solid currentColor;
transform:rotate(45deg);
transition:transform 0.25s ease;
margin-top:-3px;
}
.nav-item-dropdown:hover .caret,
.nav-item-dropdown.open .caret{transform:rotate(225deg);margin-top:3px;}
.nav-dropdown-menu{
position:absolute;
top:100%;
left:50%;
transform:translateX(-50%) translateY(6px);
background:var(--white);
border:1px solid rgba(176,141,87,0.25);
box-shadow:0 18px 40px rgba(38,34,29,0.14);
min-width:220px;
padding:10px 0;
opacity:0;
visibility:hidden;
pointer-events:none;
transition:opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
z-index:50;
}
.nav-item-dropdown:hover .nav-dropdown-menu,
.nav-item-dropdown.open .nav-dropdown-menu{
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translateX(-50%) translateY(0);
}
.nav-dropdown-menu .nav-dropdown-group-label{
display:block;
font-size:10px;
letter-spacing:0.16em;
text-transform:uppercase;
color:var(--gold);
padding:10px 20px 6px;
}
.nav-dropdown-menu a{
display:block;
padding:8px 20px;
font-size:13px;
letter-spacing:0.03em;
text-transform:none;
color:var(--charcoal-soft);
white-space:nowrap;
transition:background 0.2s ease, color 0.2s ease, padding-left 0.2s ease;
}
.nav-dropdown-menu a::after{display:none;}
.nav-dropdown-menu a:hover{
background:var(--ivory);
color:var(--gold);
padding-left:24px;
}
.nav-dropdown-menu .nav-dropdown-soon{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
padding:8px 20px;
font-size:13px;
letter-spacing:0.03em;
color:rgba(58,52,44,0.4);
white-space:nowrap;
cursor:default;
}
.nav-dropdown-menu .nav-dropdown-soon span.tag{
font-size:9px;
letter-spacing:0.08em;
text-transform:uppercase;
color:var(--gold-pale);
border:1px solid rgba(176,141,87,0.25);
padding:2px 6px;
white-space:nowrap;
}
.nav-dropdown-divider{
height:1px;
background:rgba(176,141,87,0.18);
margin:8px 0;
}
@media(max-width:900px){
.nav-item-dropdown .nav-dropdown-menu{
position:static;
transform:none;
opacity:1;
visibility:visible;
pointer-events:auto;
box-shadow:none;
border:none;
border-left:1px solid rgba(176,141,87,0.25);
margin:8px 0 8px 4px;
padding:4px 0;
display:none;
min-width:0;
}
.nav-item-dropdown.open .nav-dropdown-menu{display:block;}
.nav-item-dropdown .caret{transform:rotate(45deg) !important;margin-top:-3px !important;}
.nav-item-dropdown.open .caret{transform:rotate(225deg) !important;margin-top:3px !important;}
}
.btn-enquire{
font-size:11.5px;
letter-spacing:0.14em;
text-transform:uppercase;
padding:12px 24px;
border:1px solid var(--gold);
color:var(--white);
background:var(--gold);
transition:all 0.3s ease;
white-space:nowrap;
}
.btn-enquire:hover{
background:transparent;
color:var(--gold);
}
.mobile-toggle{
display:none;
flex-direction:column;
gap:5px;
width:26px;
}
.mobile-toggle span{
height:1px;
background:var(--charcoal);
width:100%;
transition:all 0.3s ease;
}
@media(max-width:900px){
nav.main-nav{
position:fixed;
top:0; right:-100%;
width:78%;
max-width:340px;
height:100vh;
background:var(--ivory);
flex-direction:column;
align-items:flex-start;
justify-content:center;
gap:32px;
padding:48px;
transition:right 0.4s ease;
box-shadow:-8px 0 30px rgba(0,0,0,0.08);
}
nav.main-nav.open{right:0;}
nav.main-nav a{font-size:15px;}
.mobile-toggle{display:flex;}
.header-inner .btn-enquire{display:none;}
nav.main-nav .btn-enquire-mobile{
display:inline-block;
margin-top:12px;
}
}
.btn-enquire-mobile{display:none;}
@media(max-width:900px){
.btn-enquire-mobile{display:inline-block;}
}
.nav-overlay{
display:none;
position:fixed;
inset:0;
background:rgba(38,34,29,0.4);
z-index:900;
}
.nav-overlay.open{display:block;}