/* =========================
   NAVBAR (UNCHANGED)
========================= */
.navbar{
position:sticky;
top:0;
z-index:1000;
isolation:isolate;
backdrop-filter:blur(10px);
-webkit-backdrop-filter:blur(10px);
background:
linear-gradient(to bottom,rgba(15,23,42,.96),rgba(15,23,42,.88));
border-bottom:1px solid rgba(148,163,184,.2);
}

.nav-flex{
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
gap:1.5rem;
min-height:var(--nav-height);
}

/* ===== NAV GROUPS ===== */

.nav-group {
    width: 100%;
}

.nav-group-title {
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    color: rgba(255,255,255,.7);
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .6rem 0;
    cursor: pointer;
    position: relative;
}

.nav-group-title::after {
    content: "›";
    position: absolute;
    right: 0;
    transition: transform .2s ease;
    color: rgba(255,255,255,.5);
}

.nav-group.open .nav-group-title::after {
    transform: rotate(90deg);
    color: var(--accent);
}

.nav-sub {
    display: none;
    flex-direction: column;
    gap: .5rem;
    padding-left: .5rem;
}

.nav-group.open .nav-sub {
    display: flex;
}

.nav-sub a {
    font-size: .92rem;
    padding-left: .5rem;
    color: #fff;
    opacity: .9;
}

.nav-sub a:hover {
    color: var(--accent);
    opacity: 1;
}
.nav-cta {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255,255,255,.12);
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.nav-cta p {
    font-size: .85rem;
    color: #ffffff;
    text-transform: none;
    letter-spacing: normal;
}

.nav-cta-btn {
    display: inline-flex;
    justify-content: center;
    padding: .6rem 1rem;
    border-radius: 999px;
    background: linear-gradient(90deg, #facc15, #f97316);
    color: #0f172a;
    font-weight: 800;
    font-size: .8rem;
    text-transform: uppercase;
}

.logo-wrap{
position:relative;
z-index:1102;
display:flex;
flex-direction:column;
justify-content:center;
flex-shrink:0;
}

.logo{
display:inline-flex;
align-items:center;
gap:.15rem;
font-size:2.1rem;
font-weight:900;
line-height:1;
letter-spacing:-.5px;
color:#fff;
white-space:nowrap;
}

.logo span{
display:inline-block;
font-weight:900;
transform:scale(1.18);
background:linear-gradient(145deg,#fde68a 0%,#facc15 35%,#d97706 100%);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}

.logo-tag{
margin-top:4px;
font-size:1rem;
font-weight:800;
letter-spacing:1.5px;
text-transform:uppercase;
color:#fff;
white-space:nowrap;
}

/* =========================
   NEW NAV MENU SYSTEM
========================= */

.nav-links{
display:none; /* replaced system */
}

/* Dropdown container */
#mobileMenu{
position:absolute;
top:calc(100% + 12px);
right:0;
width:min(420px, calc(100vw - 2rem));
z-index:1101;

display:flex;
flex-direction:column;
gap:1rem;

padding:1.25rem;

border:1px solid rgba(148,163,184,.18);
border-radius:1.25rem;

background:rgba(15,23,42,.98);
box-shadow:0 25px 60px rgba(0,0,0,.45);

opacity:0;
pointer-events:none;
transform:translateY(-10px) scale(.98);
transform-origin:top right;

transition:.2s ease;
}

#mobileMenu.open{
opacity:1;
pointer-events:auto;
transform:translateY(0) scale(1);
}

/* Sections */
.nav-section{
display:flex;
flex-direction:column;
gap:.25rem;
}

.nav-section-title{
font-size:.75rem;
font-weight:800;
letter-spacing:.14em;
text-transform:uppercase;
color:#94a3b8;
margin-bottom:.4rem;
}

/* Links */
#mobileMenu a{
display:flex;
align-items:center;

min-height:44px;
padding:.75rem .9rem;

border-radius:.85rem;

font-size:.95rem;
font-weight:600;

color:#fff;

transition:.2s ease;
}

#mobileMenu a:hover{
background:rgba(255,255,255,.06);
color:var(--accent);
transform:translateX(3px);
}

/* Divider */
.nav-divider{
height:1px;
background:rgba(148,163,184,.15);
margin:.25rem 0;
}

/* Hamburger always active */
.hamburger{
position:relative;
z-index:1102;
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
gap:5px;
width:44px;
height:44px;
padding:0;
cursor:pointer;
border-radius:12px;
transition:background .2s ease;
}

.hamburger:hover{background:rgba(255,255,255,.05)}

.hamburger span{
width:28px;
height:4px;
border-radius:999px;
background:#f7ef8a;
transition:transform .25s ease,opacity .25s ease;
}

.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ===== MOBILE ===== */
@media (max-width:768px){

.container{
    padding-inline:1rem;
}

.logo{
    font-size:1.95rem;
}

.logo-tag{
    font-size:.55rem;
}

}

@media (max-width:480px){

.logo{
    font-size:1.75rem;
}

.logo-wrap{
    text-decoration:none;
    color:inherit;
}

}


/* =========================
   DESKTOP FIX (CRITICAL)
========================= */

@media (min-width: 769px) {

    /* turn dropdown into real nav container */
    #mobileMenu {
        position: static;
        width: auto;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 1.5rem;

        opacity: 1 !important;
        pointer-events: auto !important;
        transform: none !important;

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

    /* groups become inline blocks */
    .nav-group {
        position: relative;
        width: auto;
    }

    /* titles behave like nav labels */
    .nav-group-title {
        padding: .4rem .6rem;
        color: rgba(255,255,255,.85);
        cursor: default;
    }

    .nav-group-title::after {
        display: none;
    }

    /* hover dropdowns on desktop */
    .nav-sub {
        position: absolute;
        top: calc(100% + 10px);
        left: 0;

        display: none !important;
        min-width: 200px;

        background: rgba(15,23,42,.98);
        border: 1px solid rgba(148,163,184,.18);
        border-radius: .9rem;
        padding: .6rem;

        flex-direction: column;
        gap: .25rem;
        z-index: 2000;
    }

    .nav-group {
  position: relative;
}

.nav-sub {
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: .15s ease;
  display: flex !important;
}

.nav-group:hover .nav-sub {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

    /* CTA aligns right like proper desktop nav */
    .nav-cta {
        margin-top: 0;
        margin-left: auto;
        padding-top: 0;
        border-top: none;
        align-items: flex-end;
    }

    /* hamburger hidden on desktop */
    .hamburger {
        display: none;
    }
}
.nav-flex {
    min-height: 72px;
    align-items: center;
}
.logo{
margin:0;
font-family:"Bricolage Grotesque",sans-serif;
}
