/* Carvan Shared UI (Nav + Theme + Mobile) */
:root{
  --navy:#0A1628;
  --gold:#C9A84C;
  --white:#F5F1E6;
  --gray: rgba(245,241,230,0.72);
  --muted: rgba(245,241,230,0.55);
  --card: rgba(255,255,255,0.03);
  --border: rgba(201,168,76,0.18);
  --shadow: rgba(0,0,0,0.35);
}
body.light-mode{
  --navy:#0A1628;
  --gold:#B7922F;
  --white:#0A1628;
  --gray: rgba(10,22,40,0.72);
  --muted: rgba(10,22,40,0.55);
  --card: rgba(0,0,0,0.02);
  --border: rgba(10,22,40,0.10);
  --shadow: rgba(0,0,0,0.12);
}
body{ padding-top:110px; }

nav#carvanNav{
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 92%;
  max-width: 1280px;
  height: 70px;
  padding: 0 1.4rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background: rgba(10, 22, 40, 0.65);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(201,168,76,0.20);
  border-radius: 14px;
  z-index: 1000;
  transition: all 0.35s ease;
}
body.light-mode nav#carvanNav{
  background: rgba(248, 246, 240, 0.72);
  border-color: rgba(10,22,40,0.10);
}
nav#carvanNav.scrolled{
  top: 10px;
  background: rgba(10, 22, 40, 0.92);
  border-color: rgba(201,168,76,0.35);
  box-shadow: 0 10px 40px var(--shadow);
}
body.light-mode nav#carvanNav.scrolled{
  background: rgba(248, 246, 240, 0.94);
  border-color: rgba(10,22,40,0.18);
  box-shadow: 0 10px 35px var(--shadow);
}

.carvan-nav-left{display:flex;align-items:center;gap:1rem;min-width:240px;}
a.carvan-logo{display:flex;flex-direction:column;text-decoration:none;letter-spacing:0.02em;line-height:1.05;font-weight:800;font-size:1.05rem;}
a.carvan-logo span{font-weight:600;color: var(--muted);font-size:0.72rem;letter-spacing:0.12em;text-transform: uppercase;margin-top:4px;}

.carvan-links{display:flex;gap:1.7rem;align-items:center;list-style:none;margin:0;padding:0;}
.carvan-links a{color: var(--gray);text-decoration:none;font-size:0.82rem;font-weight:800;letter-spacing:0.08em;text-transform: uppercase;transition: all 0.25s ease;position:relative;}
.carvan-links a::after{content:"";position:absolute;left:0;bottom:-10px;width:0%;height:2px;background: var(--gold);transition: width 0.25s ease;opacity:0.9;}
.carvan-links a:hover{color: var(--gold);transform: translateY(-1px);}
.carvan-links a:hover::after{width:100%;}
a.carvan-cta{background: var(--gold);color: var(--navy) !important;padding: 0.75rem 1.15rem;border-radius: 10px;font-weight:900;letter-spacing:0.08em;box-shadow: 0 12px 30px rgba(201,168,76,0.18);}
a.carvan-cta::after{display:none}

.carvan-nav-right{display:flex;align-items:center;gap:0.65rem;min-width:240px;justify-content:flex-end;}
.carvan-btn{border: 1px solid var(--border);background: rgba(255,255,255,0.03);color: var(--white);border-radius: 10px;height: 40px;padding: 0 0.7rem;display:inline-flex;align-items:center;gap: 0.5rem;cursor:pointer;transition: all 0.25s ease;font-weight:800;}
body.light-mode .carvan-btn{background: rgba(0,0,0,0.02);}
.carvan-btn:hover{border-color: rgba(201,168,76,0.35);transform: translateY(-1px);}
.carvan-select{border: 1px solid var(--border);background: rgba(255,255,255,0.03);color: var(--white);border-radius: 10px;height: 40px;padding: 0 0.65rem;cursor:pointer;font-weight:800;}
body.light-mode .carvan-select{background: rgba(0,0,0,0.02);}
.carvan-select option{color:#0A1628}
.carvan-icon{width:16px;height:16px;display:inline-block;}

.carvan-hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;border: 1px solid var(--border);background: rgba(255,255,255,0.03);border-radius: 10px;padding: 10px 10px;}
body.light-mode .carvan-hamburger{background: rgba(0,0,0,0.02);}
.carvan-hamburger span{width:22px;height:2px;background: var(--gold);transition: all 0.3s ease;}

#carvanMobileMenu{position: fixed; top: 100px; left: 50%; transform: translateX(-50%);width: 92%; max-width: 520px; background: rgba(10,22,40,0.96);border: 1px solid rgba(201,168,76,0.25); border-radius: 14px; padding: 1.4rem;display: none; flex-direction: column; gap: 0.9rem; z-index: 999; backdrop-filter: blur(20px);}
body.light-mode #carvanMobileMenu{background: rgba(248,246,240,0.96);border-color: rgba(10,22,40,0.18);}
#carvanMobileMenu a{color: var(--white); text-decoration:none; font-size:0.9rem; letter-spacing:0.08em;text-transform: uppercase; font-weight:900; padding: 0.65rem 0.75rem;border-radius: 10px; border: 1px solid transparent;}
#carvanMobileMenu a:hover{color: var(--gold); border-color: rgba(201,168,76,0.25); background: rgba(201,168,76,0.08);}
#carvanMobileMenu a.mobile-cta{background: var(--gold); color: var(--navy) !important; text-align:center;border-radius: 10px; padding: 0.85rem 0.9rem !important; border: none !important;}

@media (max-width:1024px){
  .carvan-links{display:none}
  .carvan-hamburger{display:flex}
  nav#carvanNav{padding:0 1rem}
  .carvan-nav-left,.carvan-nav-right{min-width:auto}
}