/* Header uniquement. Oxanium utilisera le repli système avant son installation. */
.site-header {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding-block: 1rem;
    background: linear-gradient(180deg, var(--rs-outer-background), #091426);
    font-family: 'Oxanium', system-ui, sans-serif;
}
.site-header::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: clamp(1rem, 3vw, 2rem);
    width: 48px;
    height: 2px;
    background: var(--rs-accent);
    pointer-events: none;
}
.site-header::before {
    content: '';
    position: absolute;
    right: clamp(1rem, 3vw, 2rem);
    top: 8px;
    width: 20px;
    height: 6px;
    border-top: 1px solid var(--rs-interface);
    border-right: 1px solid var(--rs-interface);
    transform: skewX(-35deg);
    pointer-events: none;
}
.header-brand { flex: 0 0 auto; max-width: 220px; }
.header-brand .custom-logo-link { display: flex; align-items: center; }
.header-brand .custom-logo { display: block; width: auto; height: auto; max-width: 220px; max-height: 60px; object-fit: contain; }
.header-navigation { display: flex; align-items: center; gap: 1.25rem; margin-left: auto; }
.header-menu { display: flex; align-items: center; gap: 1rem; list-style: none; margin: 0; padding: 0; }
.header-menu a { position: relative; display: block; padding-block: .65rem; color: var(--rs-text); text-decoration: none; text-transform: uppercase; font-size: .875rem; font-weight: 600; letter-spacing: .045em; white-space: nowrap; transition: color 140ms ease; }
.header-menu-primary a::after { content: ''; position: absolute; bottom: .2rem; left: 0; width: 18px; height: 2px; background: var(--rs-accent); transform: scaleX(0); transform-origin: left; transition: transform 140ms ease; pointer-events: none; }
.header-menu a:hover, .header-menu a:focus-visible,
.header-menu .current-menu-item > a, .header-menu .current-menu-ancestor > a { color: var(--rs-accent); }
.header-menu-primary a:hover::after, .header-menu-primary a:focus-visible::after,
.header-menu-primary .current-menu-item > a::after, .header-menu-primary .current-menu-ancestor > a::after { transform: scaleX(1); }
.header-menu-external .current-menu-item > a { text-decoration: underline; text-underline-offset: .4em; }
.header-menu-external { border-left: 1px solid var(--rs-interface); padding-left: 1.25rem; gap: .85rem; }
.header-menu-external a { font-size: .8rem; }
.header-menu-external a::after { content: '↗'; margin-left: .3em; color: var(--rs-interface); }
.header-menu-external a:hover::after, .header-menu-external a:focus-visible::after { color: var(--rs-accent); }
.header-toggle { position: relative; display: none; align-items: center; gap: .7rem; margin-left: auto; padding: .6rem 1rem; min-height: 44px; background: #0d1b30; border: 1px solid var(--rs-interface); color: var(--rs-text); font: inherit; font-size: .85rem; letter-spacing: .06em; cursor: pointer; transition: color 140ms ease, border-color 140ms ease; }
.header-toggle::after { content: ''; position: absolute; right: 4px; top: 4px; width: 7px; height: 7px; border-top: 1px solid var(--rs-accent); border-right: 1px solid var(--rs-accent); transform: skewX(-30deg); pointer-events: none; }
.header-toggle[hidden] { display: none; }
.header-toggle:hover, .header-toggle[aria-expanded='true'] { color: var(--rs-accent); border-color: var(--rs-accent); }
@media (max-width: 1150px) {
    .site-header { flex-wrap: wrap; gap: 1rem; }
    .header-toggle:not([hidden]) { display: inline-flex; }
    .header-navigation { flex: 0 0 100%; margin-left: 0; align-items: stretch; flex-direction: column; gap: 1rem; padding-top: .75rem; border-top: 1px solid var(--rs-interface); }
    .header-navigation.is-enhanced { display: none; }
    .header-navigation.is-enhanced.is-open { display: flex; }
    .header-menu { flex-direction: column; align-items: stretch; gap: .25rem; }
    .header-menu a { padding: .65rem .25rem; min-height: 44px; white-space: normal; }
    .header-menu-external { border-left: 0; border-top: 1px solid var(--rs-interface); padding: 1rem 0 0; }
}
@media (prefers-reduced-motion: reduce) {
    .header-menu a, .header-menu-primary a::after, .header-toggle { transition: none; }
}
@media (max-width: 400px) {
    .header-brand { max-width: 155px; }
    .header-brand .custom-logo { max-width: 155px; }
    .header-brand .site-brand { font-size: 1.3rem; }
}
