/* EVE canonical header v8 — product box + resources dropdown */

/* Base header — lifted slate tone, subtle entrance + static accent line */
.hdr { position: sticky; top: 0; z-index: 100; display: flex; align-items: center; gap: 20px; padding: 14px 36px; background: #0a0d14 !important; border-bottom: 1px solid rgba(255,255,255,0.08) !important; font-family: 'IBM Plex Sans', system-ui, sans-serif; color: #e2e6ef !important; animation: hdrSlideDown 0.5s cubic-bezier(0.16,1,0.3,1) both; }
.hdr::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: linear-gradient(90deg, transparent 0%, rgba(79,142,247,0.55) 25%, rgba(6,182,212,0.75) 50%, rgba(79,142,247,0.55) 75%, transparent 100%); pointer-events: none; }
@keyframes hdrSlideDown { from { transform: translateY(-100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .hdr { animation: none; } }

/* Logo */
.hdr-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; color: #e2e6ef; font-weight: 600; letter-spacing: 0.05em; flex-shrink: 0; }
.hdr-logo:hover { color: #fff; }
.hdr-logo-img { width: 36px; height: 36px; display: block; border-radius: 6px; }
.hdr-logo-wordmark { font-size: 18px; text-transform: uppercase; letter-spacing: 0.1em; }
.hdr-logo-em { color: #4a90e2; }
.hdr-logo:hover .hdr-logo-em { color: #6aaef5; }

/* Nav container */
.hdr-nav { display: flex; gap: 8px; flex: 1; justify-content: center; align-items: center; }

/* ── Products box: labeled group with subtle border ── */
.hdr-product-group { display: flex; align-items: center; gap: 2px; padding: 3px 4px 3px 10px; border: 1px solid rgba(255,255,255,0.1); border-radius: 5px; position: relative; }
.hdr-product-label { font-size: 9px; text-transform: uppercase; letter-spacing: 0.1em; color: #556; font-weight: 600; margin-right: 6px; user-select: none; }
.hdr-product-group a { color: #b0b8c8; text-decoration: none; font-size: 12px; font-weight: 500; letter-spacing: 0.02em; padding: 4px 8px; border-radius: 3px; transition: color 0.12s, background 0.12s; white-space: nowrap; }
.hdr-product-group a:hover { color: #fff; background: rgba(255,255,255,0.08); }
.hdr-product-group a[aria-current="page"] { color: #4a90e2; }

/* ── Resources dropdown ── */
.hdr-nav-group { position: relative; }
.hdr-nav-trigger { display: flex; align-items: center; gap: 5px; color: #b0b8c8; font-size: 14px; font-weight: 500; letter-spacing: 0.02em; padding: 6px 12px; border-radius: 4px; cursor: default; background: none; border: none; font-family: inherit; transition: color 0.12s, background 0.12s; }
.hdr-nav-trigger:hover { color: #fff; background: rgba(255,255,255,0.06); }
.hdr-chevron { font-size: 9px; opacity: 0.4; transition: transform 0.25s ease, opacity 0.2s; }
.hdr-nav-group:hover .hdr-chevron { transform: rotate(180deg); opacity: 0.7; }

/* Dropdown panel — smooth opacity/transform, invisible bridge */
.hdr-dropdown {
    position: absolute;
    top: calc(100% + 2px);
    left: 50%;
    transform: translateX(-50%) translateY(-4px);
    min-width: 190px;
    padding: 6px 0;
    background: rgba(14,18,30,0.98);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 8px;
    box-shadow: 0 8px 28px rgba(0,0,0,0.5);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}
.hdr-nav-group::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 8px;
}
.hdr-nav-group:hover .hdr-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}
.hdr-dropdown a {
    display: block;
    padding: 8px 16px;
    color: #b0b8c8;
    text-decoration: none;
    font-size: 14px;
    font-weight: 400;
    transition: color 0.12s, background 0.12s, padding-left 0.12s;
    margin: 0 4px;
    border-radius: 4px;
}
.hdr-dropdown a:hover { color: #fff; background: rgba(74,144,226,0.12); padding-left: 18px; }
.hdr-dropdown .hdr-dd-divider { height: 1px; background: rgba(255,255,255,0.06); margin: 3px 8px; }

/* ── Flat nav links (License, etc.) ── */
.hdr-nav > a { color: #b0b8c8; text-decoration: none; font-size: 14px; font-weight: 500; letter-spacing: 0.02em; padding: 6px 12px; border-radius: 4px; transition: color 0.12s, background 0.12s; white-space: nowrap; }
.hdr-nav > a:hover { color: #fff; background: rgba(255,255,255,0.06); }

/* Separator */
.hdr-sep { width: 3px; height: 3px; border-radius: 50%; background: rgba(255,255,255,0.12); margin: 0 2px; flex-shrink: 0; }

/* CTAs */
.hdr-cta { display: flex; gap: 8px; align-items: center; flex-shrink: 0; }
.hdr-btn { padding: 8px 20px; border-radius: 4px; font-size: 13px; font-weight: 600; text-decoration: none; letter-spacing: 0.03em; transition: all 0.12s; white-space: nowrap; }
.hdr-btn-ghost { color: #a0a8b8; border: 1px solid rgba(255,255,255,0.1); }
.hdr-btn-ghost:hover { color: #fff; border-color: rgba(255,255,255,0.3); }
.hdr-btn-primary { color: #fff; background: #1d4ed8; border: 1px solid #1d4ed8; }
.hdr-btn-primary:hover { background: #1e40af; }

/* Mobile */
.hdr-menu-btn { display: none; background: transparent; border: 1px solid rgba(255,255,255,0.2); color: #e2e6ef; font-size: 22px; line-height: 1; padding: 6px 12px; border-radius: 4px; cursor: pointer; font-family: inherit; margin-left: auto; }
.hdr-mob-overlay { display: none; position: fixed; inset: 0; background: rgba(10,13,20,0.99); z-index: 200; padding: 70px 20px 40px; overflow-y: auto; }
.hdr-mob-overlay.active { display: block; animation: hdr-mob-fade 0.2s ease; }
@keyframes hdr-mob-fade { from { opacity: 0; } to { opacity: 1; } }
.hdr-mob-close { position: absolute; top: 16px; right: 16px; background: rgba(74,144,226,0.15); border: 1px solid rgba(74,144,226,0.4); color: #fff; font-size: 20px; line-height: 1; padding: 5px 12px; border-radius: 3px; cursor: pointer; }
.hdr-mob-nav { display: flex; flex-direction: column; gap: 4px; max-width: 400px; margin: 0 auto; }
.hdr-mob-nav .hdr-mob-section { font-size: 10px; text-transform: uppercase; letter-spacing: 0.12em; color: #4a90e2; padding: 14px 16px 4px; font-weight: 600; }
.hdr-mob-nav a { display: block; padding: 11px 16px; color: #e2e6ef; text-decoration: none; font-size: 14px; font-weight: 500; background: rgba(30,35,50,0.4); border: 1px solid rgba(255,255,255,0.04); border-radius: 4px; transition: all 0.15s; }
.hdr-mob-nav a:hover { background: rgba(74,144,226,0.15); border-color: rgba(74,144,226,0.3); color: #fff; transform: translateX(4px); }
.hdr-mob-btn { text-align: center; margin-top: 3px; }
.hdr-mob-btn-primary { background: #1d4ed8 !important; border-color: #1d4ed8 !important; color: #fff !important; }

@media (max-width: 960px) {
  .hdr-nav, .hdr-cta { display: none; }
  .hdr-menu-btn { display: block; }
  .hdr { padding: 12px 20px; }
}

/* Iframe auto-hide */
html.is-embedded .hdr, html.is-embedded .hdr-mob-overlay,
body.is-embedded .hdr, body.is-embedded .hdr-mob-overlay,
html.is-embedded header.header, body.is-embedded header.header,
html.is-embedded .mobile-menu-overlay, body.is-embedded .mobile-menu-overlay {
  display: none !important;
}
html.is-embedded body, body.is-embedded { padding-top: 0 !important; }

/* ── Light-mode shield: force all .hdr content to stay visible on dark bg ── */
[data-theme="light"] .hdr,
html[data-theme="light"] .hdr {
    background: rgba(10,13,20,0.97) !important;
    border-bottom-color: rgba(255,255,255,0.08) !important;
    color: #e2e6ef !important;
}
[data-theme="light"] .hdr-logo,
html[data-theme="light"] .hdr-logo { color: #e2e6ef !important; }
[data-theme="light"] .hdr-logo:hover,
html[data-theme="light"] .hdr-logo:hover { color: #ffffff !important; }
[data-theme="light"] .hdr-logo-em,
html[data-theme="light"] .hdr-logo-em { color: #4a90e2 !important; }
[data-theme="light"] .hdr-product-label,
html[data-theme="light"] .hdr-product-label { color: #667 !important; }
[data-theme="light"] .hdr-product-group a,
html[data-theme="light"] .hdr-product-group a { color: #b0b8c8 !important; }
[data-theme="light"] .hdr-product-group a:hover,
html[data-theme="light"] .hdr-product-group a:hover { color: #ffffff !important; }
[data-theme="light"] .hdr-nav-trigger,
html[data-theme="light"] .hdr-nav-trigger { color: #b0b8c8 !important; }
[data-theme="light"] .hdr-nav-trigger:hover,
html[data-theme="light"] .hdr-nav-trigger:hover { color: #ffffff !important; }
[data-theme="light"] .hdr-dropdown,
html[data-theme="light"] .hdr-dropdown { background: rgba(14,18,30,0.98) !important; border-color: rgba(255,255,255,0.1) !important; }
[data-theme="light"] .hdr-dropdown a,
html[data-theme="light"] .hdr-dropdown a { color: #b0b8c8 !important; }
[data-theme="light"] .hdr-dropdown a:hover,
html[data-theme="light"] .hdr-dropdown a:hover { color: #ffffff !important; }
[data-theme="light"] .hdr-nav > a,
html[data-theme="light"] .hdr-nav > a { color: #b0b8c8 !important; }
[data-theme="light"] .hdr-nav > a:hover,
html[data-theme="light"] .hdr-nav > a:hover { color: #ffffff !important; }
[data-theme="light"] .hdr-btn-ghost,
html[data-theme="light"] .hdr-btn-ghost { color: #a0a8b8 !important; border-color: rgba(255,255,255,0.1) !important; }
[data-theme="light"] .hdr-btn-ghost:hover,
html[data-theme="light"] .hdr-btn-ghost:hover { color: #ffffff !important; border-color: rgba(255,255,255,0.3) !important; }
[data-theme="light"] .hdr-btn-primary,
html[data-theme="light"] .hdr-btn-primary { color: #ffffff !important; background: #1d4ed8 !important; }
[data-theme="light"] .hdr-menu-btn,
html[data-theme="light"] .hdr-menu-btn { color: #e2e6ef !important; border-color: rgba(255,255,255,0.2) !important; }
[data-theme="light"] .hdr-mob-overlay,
html[data-theme="light"] .hdr-mob-overlay { background: rgba(10,13,20,0.99) !important; }
[data-theme="light"] .hdr-mob-nav a,
html[data-theme="light"] .hdr-mob-nav a { color: #e2e6ef !important; }
[data-theme="light"] .hdr-sep,
html[data-theme="light"] .hdr-sep { background: rgba(255,255,255,0.12) !important; }

/* ────────────────────────────────────────────────────────────────────
   eveaicore.com only — larger header.
   Gated by `host-eveaicore` on <html> (set in eve-header.js from the
   hostname). These selectors are more specific than the base rules, so
   they win without !important and leave every other domain untouched.
   ──────────────────────────────────────────────────────────────────── */
/* Taller bar */
html.host-eveaicore .hdr { padding: 20px 36px; gap: 24px; }
/* Bigger logo + wordmark */
html.host-eveaicore .hdr-logo-img { width: 44px; height: 44px; }
html.host-eveaicore .hdr-logo-wordmark { font-size: 22px; }
/* Bigger nav text */
html.host-eveaicore .hdr-product-label { font-size: 10px; }
html.host-eveaicore .hdr-product-group a { font-size: 13px; }
html.host-eveaicore .hdr-nav-trigger { font-size: 15px; }
html.host-eveaicore .hdr-nav > a { font-size: 15px; }
html.host-eveaicore .hdr-dropdown a { font-size: 15px; }
/* CTAs scaled to match */
html.host-eveaicore .hdr-btn { padding: 9px 22px; font-size: 14px; }

@media (max-width: 960px) {
  html.host-eveaicore .hdr { padding: 14px 20px; }
}