.header{position:fixed;top:44px;left:0;right:0;height:64px;background:#fff;z-index:999;box-shadow:0 6px 16px rgba(0,0,0,.06)}
.header .container{display:flex;align-items:center;height:100%;gap:14px}
.menu-toggle{display:none;align-items:center;justify-content:center;border:none;background:#f3f4f6;color:#374151;width:36px;height:36px;border-radius:10px;cursor:pointer}
.brand{display:flex;align-items:center;gap:10px}
.brand img{height:28px;width:auto}
.nav{flex:1;display:flex;justify-content:center}
.nav ul{list-style:none;margin:0 auto;padding:0;display:flex;gap:14px;justify-content:center}
.nav a{display:inline-flex;align-items:center;color:#1f2937;text-decoration:none;font-weight:600;padding:10px 12px;border-radius:8px}
.nav a:hover{background:#f3f4f6}
.actions{display:flex;gap:10px}
.search-btn{border:none;background:#f3f4f6;color:#374151;padding:10px 12px;border-radius:10px;font-weight:600;cursor:pointer}
.user{position:relative}
.user-toggle{display:inline-flex;align-items:center;justify-content:center;border:none;background:#f3f4f6;color:#374151;padding:10px 12px;border-radius:9999px;font-weight:600;cursor:pointer}
.user-menu{position:absolute;right:0;top:calc(100% + 8px);background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 10px 24px rgba(0,0,0,.08);min-width:180px;padding:8px;display:none}
.user-menu a{display:block;padding:10px 12px;color:#374151;text-decoration:none;border-radius:8px}
.user-menu a:hover{background:#f3f4f6}
.user.open .user-menu{display:block}

.search-panel{position:fixed;inset:0;background:rgba(15,18,48,.75);display:none;align-items:center;justify-content:center}
.search-panel .box{background:#fff;border-radius:12px;box-shadow:0 12px 28px rgba(0,0,0,.18);padding:16px;min-width:280px}
.search-panel input{width:100%;padding:12px 14px;border:1px solid #e5e7eb;border-radius:12px;font-size:14px}
.search-panel.open{display:flex}

/* Tablet tune: tighten spacing */
@media (max-width:1024px){
  .nav ul{gap:10px}
  .nav a{padding:9px 11px}
}

@media (max-width:800px){
  .nav ul{gap:6px}
  .nav a{padding:8px 10px}
  .contact{display:none}
}

/* Mobile header adjustments */
@media (max-width:992px){
  .header{height:56px}
  .header .container{position:relative;justify-content:space-between}
  .menu-toggle{display:inline-flex}
  /* Center brand in header */
  .brand{position:absolute;left:50%;transform:translateX(-50%)}
  .brand img{height:24px}
  /* Hide search button on small screens */
  .search-btn{display:none}
  /* Compact user icon on right */
  .actions{margin-left:auto}
  .user-toggle{width:36px;height:36px;padding:0}
  .user-toggle svg{width:18px;height:18px}
  /* Collapse nav into dropdown */
  .nav{position:fixed;top:calc(var(--topbar-h) + 56px);left:0;right:0;display:none;background:#fff;border-top:1px solid #e5e7eb;box-shadow:0 12px 24px rgba(0,0,0,.12);z-index:998}
  .nav.open{display:block}
  .nav ul{flex-direction:column;gap:0;margin:0;padding:8px}
  .nav li{border-top:1px dashed #e5e7eb}
  .nav li:first-child{border-top:none}
  .nav a{padding:12px;border-radius:10px}
}

/* Extra small phones */
@media (max-width:640px){
  .header{height:56px}
  .header .container{position:relative;justify-content:space-between}
  .menu-toggle{display:inline-flex}
  /* Center brand in header */
  .brand{position:absolute;left:50%;transform:translateX(-50%)}
  .brand img{height:24px}
  /* Hide search button on mobile */
  .search-btn{display:none}
  /* Compact user icon on right */
  .actions{margin-left:auto}
  .user-toggle{width:36px;height:36px;padding:0}
  .user-toggle svg{width:18px;height:18px}
  /* Collapse nav into dropdown */
  .nav{position:fixed;top:calc(var(--topbar-h) + 56px);left:0;right:0;display:none;background:#fff;border-top:1px solid #e5e7eb;box-shadow:0 12px 24px rgba(0,0,0,.12);z-index:998}
  .nav.open{display:block}
  .nav ul{flex-direction:column;gap:0;margin:0;padding:8px}
  .nav li{border-top:1px dashed #e5e7eb}
  .nav li:first-child{border-top:none}
  .nav a{padding:12px;border-radius:10px}
}