/* ===================================== */
/* GBNMI HEADER FINAL */
/* ===================================== */

*{
box-sizing:border-box;
}

/* ROOT */

#header{

position:fixed;

top:42px;
left:0;

width:100%;

z-index:99999;
}

/* HEADER */

.lux-header{

height:88px;

display:flex;

align-items:center;
justify-content:space-between;

padding:0 34px;

background:
rgba(5,18,36,.82);

backdrop-filter:blur(18px);

border-bottom:
1px solid rgba(255,255,255,.06);

box-shadow:
0 10px 40px rgba(0,0,0,.28);
}

/* LEFT */

.lux-left{

display:flex;
align-items:center;
gap:18px;
}

/* LOGO */

.lux-logo-group{

display:flex;
align-items:center;
gap:12px;
}

.small-logo{
height:42px;
}

.main-logo{
height:60px;
}

/* BRAND */

.lux-brand{
line-height:1.15;
}

.lux-title{

font-size:12px;

font-weight:700;

letter-spacing:2px;

color:white;
}

.lux-sub{

font-size:17px;

font-weight:800;

color:#d4af37;
}

/* NAV */

.lux-nav{

display:flex;
align-items:center;
gap:34px;
}

/* LINK */

.lux-nav a{

text-decoration:none;

color:white;

font-size:14px;
font-weight:500;

transition:.3s ease;

opacity:.9;
}

.lux-nav a:hover{

color:#d4af37;

opacity:1;

transform:translateY(-2px);
}

/* GOLD */

.gold-link{

color:#d4af37 !important;

font-weight:700 !important;
}

/* ===================================== */
/* PRIVATE BUTTON */
/* ===================================== */

.lux-btn{

height:52px;

padding:0 28px;

display:inline-flex;

align-items:center;
justify-content:center;

border-radius:16px;

background:
linear-gradient(
135deg,
#d4af37,
#ffd700
);

color:#071426 !important;

font-size:14px;
font-weight:800 !important;

letter-spacing:.3px;

white-space:nowrap;

box-shadow:
0 14px 35px rgba(212,175,55,.28);

transition:.35s ease;

margin-left:10px;
}

.lux-btn:hover{

transform:
translateY(-3px)
scale(1.02);

box-shadow:
0 22px 45px rgba(212,175,55,.38);
}

/* BURGER */

.lux-burger{

display:none;

font-size:30px;

cursor:pointer;

color:white;
}

/* OVERLAY */

.nav-overlay{

position:fixed;

inset:0;

background:
rgba(0,0,0,.6);

opacity:0;
visibility:hidden;

transition:.3s;

z-index:9990;
}

.nav-overlay.active{

opacity:1;
visibility:visible;
}

/* MOBILE */

@media(max-width:1100px){

.lux-burger{
display:block;
}

.lux-nav{

position:fixed;

top:0;
right:-100%;

width:320px;
height:100vh;

background:
linear-gradient(
180deg,
#071426,
#0b1f3a
);

padding:120px 34px;

display:flex;
flex-direction:column;
align-items:flex-start;

gap:26px;

transition:.4s ease;

z-index:9999;
}

.lux-nav.active{
right:0;
}

}

/* MOBILE SMALL */

@media(max-width:768px){

#header{
top:40px;
}

.lux-header{

height:76px;

padding:0 18px;
}

.small-logo{
height:28px;
}

.main-logo{
height:42px;
}

.lux-brand{
display:none;
}

}
/* ===================================== */
/* MENU GOLD LINE */
/* ===================================== */

.lux-nav a{

position:relative;

padding-bottom:6px;
}

/* GOLD LINE */

.lux-nav a::after{

content:'';

position:absolute;

left:0;
bottom:0;

width:0%;
height:2px;

border-radius:999px;

background:
linear-gradient(
90deg,
#d4af37,
#ffd700
);

transition:
width .35s ease;
}

/* HOVER */

.lux-nav a:hover::after{

width:100%;
}

/* PRIVATE BUTTON NO LINE */

.lux-btn::after{
display:none !important;
}

/* ================================================= */
/* PREMIUM GBNMI EMBLEM */
/* ================================================= */

.logo-gbnmi-wrap{

position:relative;

display:flex;
align-items:center;
justify-content:center;

width:74px;
height:74px;

border-radius:50%;

padding:4px;

background:
linear-gradient(
135deg,
rgba(212,175,55,.18),
rgba(255,255,255,.08)
);

border:
1px solid rgba(212,175,55,.25);

overflow:hidden;

transition:.45s ease;
}

.logo-gbnmi-wrap::before{

content:'';

position:absolute;

inset:-4px;

border-radius:50%;

background:
conic-gradient(
from 0deg,
transparent,
rgba(212,175,55,.45),
transparent,
rgba(212,175,55,.25),
transparent
);

opacity:0;

filter:blur(10px);

transition:.45s ease;
}

.logo-gbnmi-wrap::after{

content:'';

position:absolute;

width:120%;
height:120%;

border-radius:50%;

border:
1px solid rgba(255,215,0,.08);

pointer-events:none;
}

.logo-gbnmi-wrap:hover{

transform:
translateY(-3px)
scale(1.06);

border-color:
rgba(212,175,55,.50);

box-shadow:

0 0 18px rgba(212,175,55,.35),

0 0 40px rgba(212,175,55,.18),

0 0 70px rgba(212,175,55,.12);
}

.logo-gbnmi-wrap:hover::before{

opacity:1;

animation:
gbnmiGlow 3s linear infinite;
}

.logo-gbnmi-premium{

width:62px;
height:62px;

border-radius:50%;

background:white;

object-fit:cover;

position:relative;

z-index:2;

transition:.4s ease;
}

.logo-gbnmi-wrap:hover .logo-gbnmi-premium{

filter:

drop-shadow(
0 0 8px rgba(255,215,0,.55)
)

drop-shadow(
0 0 20px rgba(255,215,0,.25)
);
}

@keyframes gbnmiGlow{

from{

transform:rotate(0deg);
}

to{

transform:rotate(360deg);
}

}

/* ================================================= */
/* MOBILE */
/* ================================================= */

@media(max-width:768px){

.logo-gbnmi-wrap{

width:58px;
height:58px;
}

.logo-gbnmi-premium{

width:48px;
height:48px;
}

}

/* ===================================== */
/* HEADER SCROLL EFFECT */
/* ===================================== */

.lux-header{

transition:
all .35s ease;
}

.header-scrolled .lux-header{

height:72px;

background:
rgba(5,18,36,.96);

backdrop-filter:
blur(24px);

border-bottom:
1px solid rgba(212,175,55,.18);

box-shadow:
0 10px 35px rgba(0,0,0,.45);
}

/* LOGO SHRINK */

.header-scrolled .logo-gbnmi-wrap{

width:62px;
height:62px;
}

.header-scrolled .logo-gbnmi-premium{

width:52px;
height:52px;
}

.header-scrolled .small-logo{

height:34px;
}

.header-scrolled .lux-title{

font-size:11px;
}

.header-scrolled .lux-sub{

font-size:15px;
}

#header{

position:fixed;

top:42px;
left:0;

width:100%;

z-index:99999;

transition:
transform .35s ease;
}

/* HIDE HEADER */

/* ===================================== */
/* LUXURY HIDE */
/* ===================================== */

#header{

position:fixed;

top:42px;
left:0;

width:100%;

z-index:99999;

transition:

transform .55s cubic-bezier(.22,.61,.36,1),

opacity .45s ease,

filter .45s ease;
}

.header-hide #header{

transform:
translateY(-120px);

opacity:0;

filter:
blur(8px);
}

/* ===================================== */
/* PREMIUM GLASS */
/* ===================================== */

.lux-header{

transition:
all .45s ease;
}

body:not(.header-hide) .lux-header{

backdrop-filter:
blur(22px);

background:
rgba(5,18,36,.88);

box-shadow:
0 15px 45px rgba(0,0,0,.28);
}

.lux-header{

border-bottom:
1px solid rgba(212,175,55,.08);
}

.lux-header::after{

content:'';

position:absolute;

left:0;
bottom:0;

width:100%;
height:1px;

background:

linear-gradient(
90deg,
transparent,
rgba(212,175,55,.35),
transparent
);
}