/* ==========================================================================
   Site header — one component, every template.

   Reproduces the homepage's dark glass bar in plain CSS rather than Tailwind
   utilities. landing.css is 186 KB and its preflight is a global reset that
   would restyle every page (functions.php:396 records it "stripped the hero of
   its container" when mixed with the theme's sheets), so the header carries its
   own rules instead. Every selector is scoped under #ibo-header and cannot
   affect anything else.

   Colour values are the Tailwind tokens the v2 markup used, resolved to hex:
   zinc-950 #09090b · zinc-900 #18181b · zinc-300 #d4d4d8 · zinc-200 #e4e4e7
   and the brand gradient #007CEB → #005bb5.
   ========================================================================== */

#ibo-header {
    --h-bg:      rgb(9 9 11 / .78);
    --h-bg-sm:   rgb(24 24 27 / .68);
    --h-line:    rgb(255 255 255 / .10);
    --h-line-2:  rgb(255 255 255 / .16);
    --h-text:    #d4d4d8;
    --h-text-hi: #ffffff;
    --h-hover:   rgb(255 255 255 / .10);
    --h-blue:    #007CEB;
    --h-blue-2:  #005bb5;
    --h-height:  3.5rem;

    /* Sticky, not fixed.
       Fixed took the header out of flow, so every template had to reserve space
       for it by hand — and any that did not had its first ~68px of content
       sitting underneath the bar. Sticky occupies its own height in normal flow,
       so content is pushed down automatically on every template, then the bar
       pins to the top on scroll. No per-template clearance, nothing to keep in
       sync, and nothing to slide under. */
    position: sticky;
    top: 0;
    z-index: 200;
    max-width: 80rem;
    margin: 0.75rem auto 0;
    padding-inline: 0.75rem;
    box-sizing: border-box;
    font-family: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* Belt and braces: the landing template dequeues Tailwind's preflight, so
   border-box cannot be assumed from the surrounding stylesheet. */
#ibo-header,
#ibo-header *,
#ibo-header *::before,
#ibo-header *::after {
    box-sizing: border-box;
}

/* --------------------------------------------------------------- the bar --- */

#ibo-header .ibo-hdr__bar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    height: var(--h-height);
    padding-inline: 0.75rem;
    border-radius: 1rem;
    background: var(--h-bg);
    border: 1px solid var(--h-line);
    box-shadow: 0 18px 40px -12px rgb(0 0 0 / .6);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    transition: background .2s ease, border-color .2s ease;
}

#ibo-header.is-scrolled .ibo-hdr__bar {
    background: rgb(9 9 11 / .92);
    border-color: var(--h-line-2);
}

/* ------------------------------------------------------------------ logo --- */

#ibo-header .ibo-hdr__logo {
    display: flex;
    align-items: center;
    flex: none;
    text-decoration: none;
}

#ibo-header .ibo-hdr__logo img {
    height: 1.5rem;
    width: auto;
    max-width: 150px;
    object-fit: contain;
    transition: transform .2s ease;
}

#ibo-header .ibo-hdr__logo:hover img { transform: scale(1.02); }

/* ----------------------------------------------------------- desktop nav --- */

#ibo-header .ibo-hdr__nav {
    display: none;
    align-items: center;
    gap: 0.125rem;
}

#ibo-header .ibo-hdr__nav a {
    padding: 0.4375rem 0.75rem;
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1;
    color: var(--h-text);
    text-decoration: none;
    white-space: nowrap;
    transition: color .18s ease, background .18s ease;
}

#ibo-header .ibo-hdr__nav a:hover,
#ibo-header .ibo-hdr__nav a:focus-visible {
    color: var(--h-text-hi);
    background: var(--h-hover);
}

/* --------------------------------------------------------------- actions --- */

#ibo-header .ibo-hdr__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: none;
}

/* Language switcher */

#ibo-header .ibo-hdr__lang { position: relative; }

#ibo-header .ibo-hdr__lang-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3125rem;
    min-height: 44px;
    min-width: 44px;
    padding: 0 0.625rem;
    border-radius: 0.75rem;
    border: 1px solid var(--h-line);
    background: rgb(255 255 255 / .05);
    color: #e4e4e7;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: .04em;
    cursor: pointer;
    transition: background .18s ease, color .18s ease;
}

#ibo-header .ibo-hdr__lang-btn:hover { background: var(--h-hover); color: var(--h-text-hi); }

#ibo-header .ibo-hdr__lang-menu {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    min-width: 11rem;
    padding: 0.375rem;
    border-radius: 0.875rem;
    background: rgb(9 9 11 / .97);
    border: 1px solid var(--h-line);
    box-shadow: 0 20px 40px -12px rgb(0 0 0 / .7);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    z-index: 10;
}

#ibo-header .ibo-hdr__lang-menu[hidden] { display: none; }

#ibo-header .ibo-hdr__lang-menu a {
    display: block;
    padding: 0.625rem 0.75rem;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    color: var(--h-text);
    text-decoration: none;
    transition: background .16s ease, color .16s ease;
}

#ibo-header .ibo-hdr__lang-menu a:hover { background: var(--h-hover); color: var(--h-text-hi); }
#ibo-header .ibo-hdr__lang-menu a[aria-current] { color: var(--h-text-hi); background: rgb(0 124 235 / .18); }

/* Primary call to action */

#ibo-header .ibo-hdr__cta {
    display: none;
    align-items: center;
    gap: 0.4375rem;
    min-height: 44px;
    padding: 0 1.125rem;
    border-radius: 999px;
    background: linear-gradient(to right, var(--h-blue), var(--h-blue-2));
    border: 1px solid rgb(96 165 250 / .3);
    box-shadow: 0 8px 20px -6px rgb(0 124 235 / .45);
    color: #fff;
    font-size: 0.8125rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: transform .18s ease, box-shadow .18s ease;
}

#ibo-header .ibo-hdr__cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 26px -8px rgb(0 124 235 / .6);
}

/* Hamburger */

#ibo-header .ibo-hdr__burger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 44px;
    padding: 0;
    border-radius: 0.75rem;
    border: 1px solid var(--h-line);
    background: rgb(255 255 255 / .05);
    color: #e4e4e7;
    cursor: pointer;
    transition: background .18s ease, color .18s ease;
}

#ibo-header .ibo-hdr__burger:hover { background: var(--h-hover); color: var(--h-text-hi); }

/* ---------------------------------------------------------- mobile panel --- */

#ibo-header .ibo-hdr__panel {
    position: absolute;
    top: calc(100% + 0.5rem);
    left: 0.75rem;
    right: 0.75rem;
    padding: 0.75rem;
    border-radius: 1rem;
    background: rgb(9 9 11 / .97);
    border: 1px solid var(--h-line);
    box-shadow: 0 24px 48px -12px rgb(0 0 0 / .7);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    max-height: calc(100vh - var(--h-height) - 3rem);
    overflow-y: auto;
    overscroll-behavior: contain;
}

#ibo-header .ibo-hdr__panel[hidden] { display: none; }

#ibo-header .ibo-hdr__panel nav {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

#ibo-header .ibo-hdr__panel nav a {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 0 0.875rem;
    border-radius: 0.625rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--h-text);
    text-decoration: none;
    transition: background .16s ease, color .16s ease;
}

#ibo-header .ibo-hdr__panel nav a:hover,
#ibo-header .ibo-hdr__panel nav a:focus-visible {
    background: var(--h-hover);
    color: var(--h-text-hi);
}

#ibo-header .ibo-hdr__panel-langs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--h-line);
}

#ibo-header .ibo-hdr__panel-langs a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 48px;
    padding: 0 0.625rem;
    border-radius: 0.625rem;
    border: 1px solid var(--h-line);
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--h-text);
    text-decoration: none;
    transition: background .16s ease, color .16s ease;
}

#ibo-header .ibo-hdr__panel-langs a:hover { background: var(--h-hover); color: var(--h-text-hi); }
#ibo-header .ibo-hdr__panel-langs a.is-current { background: rgb(0 124 235 / .22); color: #fff; border-color: rgb(0 124 235 / .5); }

#ibo-header .ibo-hdr__panel-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    margin-top: 0.75rem;
    border-radius: 0.75rem;
    background: linear-gradient(to right, var(--h-blue), var(--h-blue-2));
    color: #fff;
    font-size: 0.9375rem;
    font-weight: 700;
    text-decoration: none;
}

/* -------------------------------------------------------------- md and up -- */

@media (min-width: 640px) {
    #ibo-header {
        top: 1.25rem;
        padding-inline: 1.5rem;
        --h-height: 4rem;
    }
    #ibo-header .ibo-hdr__bar { background: var(--h-bg-sm); padding-inline: 1.25rem; }
    #ibo-header .ibo-hdr__logo img { height: 2rem; max-width: 190px; }
    #ibo-header .ibo-hdr__cta { display: inline-flex; }
    #ibo-header .ibo-hdr__panel { left: 1.5rem; right: 1.5rem; }
}

@media (min-width: 1024px) {
    #ibo-header { padding-inline: 2rem; }
    #ibo-header .ibo-hdr__nav { display: flex; }
    #ibo-header .ibo-hdr__burger { display: none; }
    #ibo-header .ibo-hdr__panel { display: none !important; }
}

@media (min-width: 1280px) {
    #ibo-header .ibo-hdr__nav { gap: 0.25rem; }
    #ibo-header .ibo-hdr__nav a { font-size: 0.875rem; }
}

@media (prefers-reduced-motion: reduce) {
    #ibo-header * { transition-duration: .01ms !important; }
}