/* QLM SITE HEADER v2 — with dropdown navigation */

.qlm-site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(253, 251, 248, 0.92);
  backdrop-filter: blur(18px) saturate(1.2);
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
  border-bottom: 1px solid var(--qlm-rule, #EDE9E2);
}
.qlm-site-inner {
  max-width: 1280px; margin: 0 auto;
  padding: 0 32px; height: 72px;
  display: flex; align-items: center; justify-content: space-between; gap: 40px;
}
.qlm-brand { display: flex; align-items: center; gap: 12px; flex-shrink: 0; transition: opacity 0.2s; text-decoration: none; }
.qlm-brand:hover { opacity: 0.7; }
.qlm-mark { width: 36px; height: 36px; flex-shrink: 0; }
.qlm-wordmark { display: flex; flex-direction: column; line-height: 1; gap: 3px; }
.qlm-wordmark-name { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 22px; letter-spacing: -0.005em; color: var(--qlm-navy, #0B1929); }
.qlm-wordmark-sub { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--qlm-ink-xlight, #B4B2A9); font-weight: 400; }

/* Nav items */
.qlm-primary { display: flex; align-items: center; gap: 4px; flex: 1; justify-content: center; }
.qlm-nav-item { position: relative; }
.qlm-primary-item { position: relative; padding: 10px 14px; font-size: 14px; font-weight: 500; color: var(--qlm-navy, #0B1929); letter-spacing: -0.003em; transition: color 0.2s; display: inline-flex; align-items: center; gap: 5px; text-decoration: none; cursor: pointer; }
.qlm-primary-item:hover { color: var(--qlm-teal, #00A896); }
.qlm-primary-item.promoted { color: #00A896; }
.qlm-primary-item.promoted:hover { color: #007A6E; }
.qlm-chev { font-size: 10px; opacity: 0.5; }

/* Dropdowns */
.qlm-dropdown {
  position: absolute; top: calc(100% + 6px); left: -16px;
  min-width: 300px; background: #FDFBF8;
  border: 1px solid #EDE9E2; box-shadow: 0 12px 32px rgba(11,25,41,0.08);
  padding: 12px 0; z-index: 200;
  opacity: 0; visibility: hidden; transition: opacity 0.15s, visibility 0.15s;
}
.qlm-nav-item:hover .qlm-dropdown { opacity: 1; visibility: visible; }
.qlm-dd-section { padding: 6px 18px; }
.qlm-dd-section + .qlm-dd-section { border-top: 1px solid #EDE9E2; margin-top: 6px; padding-top: 12px; }
.qlm-dd-eyebrow { font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: #00A896; margin-bottom: 8px; }
.qlm-dd-link { display: block; padding: 5px 0; font-size: 13px; color: #0B1929; text-decoration: none; }
.qlm-dd-link:hover { color: #00A896; }

/* CTA group */
.qlm-cta-group { display: flex; gap: 16px; align-items: center; flex-shrink: 0; }
.qlm-signin { font-size: 13px; color: #3D3D5C; text-decoration: none; }
.qlm-signin:hover { color: #00A896; }
.qlm-cta { display: inline-flex; align-items: center; gap: 8px; padding: 11px 22px; background: #00A896; color: #FDFBF8; font-family: 'DM Sans', sans-serif; font-size: 14px; font-weight: 500; border-radius: 999px; transition: all 0.2s; text-decoration: none; }
.qlm-cta:hover { background: #007A6E; gap: 12px; }
.qlm-cta-arrow { transition: transform 0.2s; }
.qlm-cta:hover .qlm-cta-arrow { transform: translateX(2px); }

/* Dark variant */
.qlm-site-header.dark { background: rgba(11, 25, 41, 0.92); border-bottom-color: rgba(253, 251, 248, 0.08); }
.qlm-site-header.dark .qlm-wordmark-name { color: #FDFBF8; }
.qlm-site-header.dark .qlm-wordmark-sub { color: rgba(253, 251, 248, 0.4); }
.qlm-site-header.dark .qlm-primary-item { color: #FDFBF8; }
.qlm-site-header.dark .qlm-primary-item:hover { color: #00A896; }
.qlm-site-header.dark .qlm-cta { background: #00A896; color: #0B1929; }

/* Responsive */
@media (max-width: 900px) {
  .qlm-site-inner { padding: 0 20px; }
  .qlm-primary { display: none; }
  .qlm-signin { display: none; }
}
