/* ══════════════════════════════════════════
   GAS Site Header — Frontend
   Tokens: gas-design-tokens.css
   ══════════════════════════════════════════ */

.gas-site-header {
    /* ── Header global ── */
    --_header-panel-bg: var(--gas-color-surface-card, var(--gas-bg-surface, #fff));
    --_header-control-bg: var(--gas-color-surface-card, var(--gas-bg-surface, #fff));
    --_header-bg: var(--gas-site-header-bg, rgba(255, 255, 255, 0.97));
    --_header-border: var(--gas-color-border-default, var(--gas-border-color));
    --_header-text: var(--gas-color-text-default, var(--gas-text-color));
    --_header-muted: var(--gas-color-text-muted, var(--gas-text-color-muted));
    --_header-hover-bg: var(--gas-color-surface-muted, var(--gas-neutral-100));
    --_header-shadow: var(--gas-shadow-s);
    --_logo-w: var(--gas-site-logo-width, 220px);
    --_logo-h: var(--gas-site-logo-height, 72px);

    /* ── Nav links (surchargeables via inline style) ── */
    --_nav-color: var(--_header-text);
    --_nav-hover-color: var(--gas-primary);
    --_nav-hover-bg: var(--_header-hover-bg);
    --_nav-active-color: var(--gas-primary);
    --_nav-active-bg: var(--gas-primary-ultra-light);

    /* ── Member mega ── */
    --_member-color: var(--_header-text);
    --_member-hover-color: var(--gas-primary);
    --_member-hover-bg: var(--_header-hover-bg);
    --_member-active-color: var(--gas-primary);
    --_member-active-bg: var(--gas-primary-ultra-light);

    /* ── CTA primary ── */
    --_cta-primary-bg: var(--gas-button-primary-bg);
    --_cta-primary-color: var(--gas-button-primary-color);
    --_cta-primary-hover-bg: var(--gas-button-primary-bg-hover);

    /* ── CTA secondary ── */
    --_cta-secondary-bg: transparent;
    --_cta-secondary-color: var(--gas-primary);
    --_cta-secondary-hover-bg: var(--gas-primary-ultra-light);

    position: sticky;
    top: 0;
    width: 100%;
    z-index: 100;
    color: var(--_header-text);
    font-family: var(--gas-font-family);
    box-sizing: border-box;
}

:root[data-theme="dark"] .gas-site-header {
    --_header-bg: var(--gas-site-header-bg-dark, var(--_header-panel-bg));
    --_nav-hover-color:       var(--gas-primary-light);
    --_nav-active-color:      var(--gas-primary-light);
    --_member-hover-color:    var(--gas-primary-light);
    --_member-active-color:   var(--gas-primary-light);
    --_cta-primary-bg:        var(--gas-primary-light);
    --_cta-primary-hover-bg:  var(--gas-primary-light);
    --_cta-primary-color:     var(--gas-color-on-primary);
    --_cta-secondary-color:   var(--gas-text-color-link);
    --_cta-secondary-hover-bg: var(--_header-hover-bg);
}

.gas-site-header *,
.gas-site-header *::before,
.gas-site-header *::after {
    box-sizing: border-box;
}

.gas-site-header--static {
    position: relative;
}

.gas-site-header--overlay-content {
    margin-bottom: calc(var(--gas-site-header-height, 0px) * -1);
    z-index: 120;
}

/* ── Admin bar offset ── */

body.admin-bar .gas-site-header:not(.gas-site-header--static) {
    top: var(--wp-admin--admin-bar--height, 32px);
}

@media screen and (max-width: 782px) {
    body.admin-bar .gas-site-header:not(.gas-site-header--static) {
        top: var(--wp-admin--admin-bar--height, 46px);
    }
}

.gas-site-header a {
    text-decoration: none;
    transition: color var(--gas-transition-fast);
}

.gas-site-header select {
    background: var(--gas-input-bg);
    border: var(--gas-border-width) solid var(--gas-input-border);
    border-radius: var(--gas-input-radius);
    color: var(--gas-input-color);
}

/* ── Announcement bar ── */

.gas-site-header__announcement {
    width: 100%;
    padding: var(--gas-space-s) var(--gas-space-m);
    font-size: var(--gas-text-xs);
    line-height: var(--gas-leading-tight);
}

.gas-site-header__announcement--info    { background: var(--gas-info);    color: var(--gas-white); }
.gas-site-header__announcement--warning { background: var(--gas-warning); color: var(--gas-neutral-900); }
.gas-site-header__announcement--success { background: var(--gas-success); color: var(--gas-white); }
.gas-site-header__announcement--primary { background: var(--gas-primary); color: var(--gas-white); }
.gas-site-header__announcement--accent  { background: var(--gas-accent);  color: var(--gas-white); }

.gas-site-header__announcement--highlight {
    background: linear-gradient(90deg, var(--gas-primary), var(--gas-secondary));
    color: var(--gas-white);
}

.gas-site-header__announcement + .gas-site-header__announcement {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.gas-site-header__announcement--full-width {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
}

.gas-site-header__announcement-inner {
    display: block;
    max-width: var(--gas-site-max-width);
    margin: 0 auto;
    color: inherit;
    text-align: center;
    font-weight: var(--gas-weight-semi);
}

a.gas-site-header__announcement-inner:hover { opacity: 0.85; }

/* ── Row-based layout ── */

.gas-site-header__row {
    display: grid;
    align-items: center;
    gap: 0 var(--gas-space-l);
    padding: var(--gas-space-xs) var(--gas-space-l);
    background: var(--_header-bg);
    position: relative;
    z-index: var(--_row-z, 20);
    width: 100%;
}
/* Rangée à colonne UNIQUE (logo + nav + réseaux) : le fond reste pleine largeur,
   mais le contenu s'aligne sur la largeur de contenu du site (--gas-wide-max-width),
   centré — le logo tombe sur le bord gauche du contenu, les réseaux sur le droit. */
.gas-site-header__col--first.gas-site-header__col--last {
    width: min(100%, var(--gas-wide-max-width, 1120px));
    margin-inline: auto;
}

/* The main row (with branding) gets the visual weight */
.gas-site-header__row--has-branding {
    padding: var(--_header-padding-top, var(--gas-space-xs)) var(--gas-space-l) var(--_header-padding-bottom, var(--gas-space-xs));
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    /* Pas de bord bas : sur fond sombre, le 1px `--_header-border` (#3a3a3a) lit
       comme un mini-espace/couture entre le header et le contenu. L'ombre douce
       suffit à séparer le header quand il est sticky. */
    box-shadow: var(--_header-shadow);
}

/* Non-branding rows: subtle separator */
.gas-site-header__row:not(.gas-site-header__row--has-branding) {
    border-bottom: 1px solid var(--_header-border);
    padding-top: 2px;
    padding-bottom: 2px;
}

/* Announcement-only rows: zero padding (announcements handle their own) */
.gas-site-header__row--announcements-only {
    padding: 0;
    border-bottom: 0;
    gap: 0;
}

/* ── Row layout variants (grid-template-columns) ── */
.gas-site-header__row--1-1       { grid-template-columns: 1fr; }
.gas-site-header__row--1-2--1-2  { grid-template-columns: 1fr 1fr; }
.gas-site-header__row--1-3--2-3  { grid-template-columns: 1fr 2fr; }
.gas-site-header__row--2-3--1-3  { grid-template-columns: 2fr 1fr; }
.gas-site-header__row--1-4--3-4  { grid-template-columns: 1fr 3fr; }
.gas-site-header__row--3-4--1-4  { grid-template-columns: 3fr 1fr; }

.gas-site-header--compact .gas-site-header__row--has-branding,
.gas-site-header--menu-only .gas-site-header__row--has-branding {
    padding-top: 2px;
    padding-bottom: 2px;
}

/* ── Column ── */

.gas-site-header__col {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--gas-space-xs) var(--gas-space-m);
    min-width: 0;
}

/* Second+ columns: align content to the right */
.gas-site-header__col:not(:first-child) {
    justify-content: flex-end;
}

/* ── Generic element wrappers ── */

.gas-site-header__element {
    display: flex;
    align-items: center;
    min-width: 0;
}

.gas-site-header__element > * {
    min-width: 0;
}

.gas-site-header__element--announcements,
.gas-site-header__element--school-promo {
    width: 100%;
}

.gas-site-header__element--branding,
.gas-site-header__element--member-mega,
.gas-site-header__element--cta {
    flex-shrink: 0;
}

.gas-site-header__element--primary-nav,
.gas-site-header__element--gas-menu {
    flex: 1 1 auto;
}

/* ── Branding ── */

.gas-site-header__branding {
    flex-shrink: 0;
    min-width: 0;
}

.gas-site-header__brand-link {
    display: flex;
    align-items: center;
    gap: var(--gas-space-m);
    min-width: 0;
    color: inherit;
}

/* Branding layout: inline (logo + name + slogan all in a row) */
.gas-site-header__branding--inline .gas-site-header__brand-link {
    flex-direction: row;
    align-items: center;
}

.gas-site-header__branding--inline .gas-site-header__brand-copy {
    flex-direction: row;
    gap: var(--gas-space-s);
    align-items: baseline;
}

/* Branding layout: logo-left-stacked (logo left, name + slogan stacked right) — default */
.gas-site-header__branding--logo-left-stacked .gas-site-header__brand-link {
    flex-direction: row;
    align-items: center;
    gap: var(--gas-space-s);
}

/* Branding layout: stacked (everything vertical) */
.gas-site-header__branding--stacked .gas-site-header__brand-link {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--gas-space-xs);
}

/* Branding layout: logo-top (logo above, texts below in a row) */
.gas-site-header__branding--logo-top .gas-site-header__brand-link {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--gas-space-xs);
}

.gas-site-header__branding--logo-top .gas-site-header__brand-copy {
    flex-direction: row;
    gap: var(--gas-space-s);
    align-items: baseline;
}

/* Branding text vertical alignment */
.gas-site-header__branding--valign-top .gas-site-header__brand-link {
    align-items: flex-start;
}

.gas-site-header__branding--valign-bottom .gas-site-header__brand-link {
    align-items: flex-end;
}

.gas-site-header__brand-link:hover .gas-site-header__site-name {
    color: var(--gas-primary);
}

.gas-site-header__logo img {
    display: block;
    width: auto;
    max-width: var(--_logo-w);
    height: auto;
    max-height: var(--_logo-h);
    object-fit: contain;
}

.gas-site-header__brand-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.gas-site-header__site-name {
    font-size: clamp(14px, 12px + 0.5vw, 18px);
    font-weight: var(--gas-weight-bold);
    line-height: var(--gas-leading-tight);
    transition: color var(--gas-transition-fast);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gas-site-header__site-description {
    color: var(--_header-muted);
    font-size: var(--gas-text-xs);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Element alignment within columns ── */

/* Primary nav pushes rest right (default = left) */
.gas-site-header__element--primary-nav,
.gas-site-header__element--gas-menu {
    margin-right: auto;
}

/* Nav align: center — nav centered, le reste (logo à gauche, réseaux à droite)
   poussé sur les bords par les marges auto. `flex: 0 1 auto` est requis : si l'élément
   nav grandit (flex-grow:1), il remplit la rangée et les marges auto n'ont plus d'effet
   (nav collé à gauche). */
.gas-site-header--nav-center .gas-site-header__element--primary-nav,
.gas-site-header--nav-center .gas-site-header__element--gas-menu {
    margin-right: auto;
    margin-left: auto;
    flex: 0 1 auto;
}

/* Nav align: right — nav pushed to the right */
.gas-site-header--nav-right .gas-site-header__element--primary-nav,
.gas-site-header--nav-right .gas-site-header__element--gas-menu {
    margin-right: 0;
    margin-left: auto;
}

/* Member mega inline with nav, not full column */
.gas-site-header__element--member-mega {
    flex-shrink: 0;
}

/* Element separator bars (configurable left/right) */
.gas-site-header__element-wrap--sep-left,
.gas-site-header__element-wrap--sep-right {
    display: flex;
    align-items: center;
}

.gas-site-header__element-wrap--sep-left {
    border-left: 1px solid var(--_header-border);
    padding-left: var(--gas-space-s);
}

.gas-site-header__element-wrap--sep-right {
    border-right: 1px solid var(--_header-border);
    padding-right: var(--gas-space-s);
}

/* ── Hamburger toggle ── */

.gas-site-header__toggle {
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    width: 44px;
    height: 44px;
    border: 1px solid var(--_header-border);
    border-radius: var(--gas-radius-m);
    background: var(--_header-control-bg);
    cursor: pointer;
    transition: background var(--gas-transition-fast);
    padding: 0;
    flex-shrink: 0;
    margin-left: auto;
}

.gas-site-header__toggle:hover {
    background: var(--_header-hover-bg);
}

.gas-site-header__collapsed-bar {
    align-items: center;
    display: flex;
    gap: var(--gas-space-4, 10px);
    justify-content: space-between;
    margin-inline: auto;
    max-width: var(--gas-header-max-width, var(--gas-container-xl, 1200px));
    min-height: 64px;
    padding: var(--gas-space-2, 5px) var(--gas-space-4, 10px);
    width: 100%;
}

.gas-site-header__collapsed-brand {
    min-width: 0;
}

.gas-site-header--display-collapsed .gas-site-header__collapsed-toggle {
    display: flex;
    margin-left: 0;
}

.gas-site-header__toggle span:not(.screen-reader-text) {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--_header-text);
    border-radius: var(--gas-radius-full);
    transition: transform 0.25s ease, opacity 0.25s ease;
    transform-origin: center;
}

.gas-site-header.is-drawer-open .gas-site-header__toggle span:not(.screen-reader-text):nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.gas-site-header.is-drawer-open .gas-site-header__toggle span:not(.screen-reader-text):nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
}

.gas-site-header.is-drawer-open .gas-site-header__toggle span:not(.screen-reader-text):nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* ── Shared nav elements ── */

.gas-site-header__primary-nav,
.gas-site-header__action-nav,
.gas-site-header__member-mega {
    position: relative;
    min-width: 0;
    max-width: 100%;
}

.gas-site-menu,
.gas-site-action-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.gas-site-menu--primary,
.gas-site-menu--gas {
    display: flex;
    align-items: center;
    gap: var(--_nav-menu-gap, var(--_global-menu-gap, 2px));
    flex-wrap: wrap;
}

.gas-site-menu__item {
    position: relative;
}

/* ── Nav links / triggers ── */

.gas-site-menu__link,
.gas-site-menu__trigger,
.gas-site-action-list__item a {
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-xs);
    min-height: 34px;
    padding: 2px var(--gas-space-s);
    border: 0;
    border-radius: var(--gas-radius-s);
    background: transparent;
    color: var(--_nav-color);
    font-size: var(--_nav-font-size, var(--_global-font-size, var(--gas-text-s)));
    font-weight: var(--gas-weight-semi);
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--gas-transition-fast), color var(--gas-transition-fast);
}

.gas-site-header__member-trigger {
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-xs);
    min-height: 34px;
    padding: 2px var(--gas-space-s);
    border: 0;
    border-radius: var(--gas-radius-s);
    background: transparent;
    color: var(--_member-color);
    font-size: var(--_member-font-size, var(--_global-font-size, var(--gas-text-xs)));
    font-weight: var(--gas-weight-semi);
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--gas-transition-fast), color var(--gas-transition-fast);
}

.gas-site-menu__item-head {
    display: inline-flex;
    align-items: center;
    gap: 1px;
}

.gas-site-menu__trigger--icon {
    min-width: 32px;
    padding-left: var(--gas-space-xs);
    padding-right: var(--gas-space-xs);
    justify-content: center;
}

.gas-site-menu__link--label { cursor: default; }

.gas-site-menu__link:hover,
.gas-site-menu__trigger:hover,
.gas-site-action-list__item a:hover {
    background: var(--_nav-hover-bg);
    color: var(--_nav-hover-color);
}

.gas-site-header__member-trigger:hover {
    background: var(--_member-hover-bg);
    color: var(--_member-hover-color);
}

.gas-site-menu__item.is-current > .gas-site-menu__link,
.gas-site-menu__item.is-current > .gas-site-menu__item-head > .gas-site-menu__link,
.gas-site-menu__item.is-current-ancestor > .gas-site-menu__item-head > .gas-site-menu__link,
.gas-site-menu__item.is-current-ancestor > .gas-site-menu__link--parent,
.gas-site-action-list__item.is-current a {
    background: var(--_nav-active-bg);
    color: var(--_nav-active-color);
}

.gas-site-menu__item.is-highlight > .gas-site-menu__link,
.gas-site-menu__item.is-highlight > .gas-site-menu__item-head > .gas-site-menu__link,
.gas-site-menu__item.is-highlight > .gas-site-menu__link--parent {
    background: var(--gas-menu-highlight-bg, var(--gas-primary-ultra-light));
    color: var(--gas-menu-highlight-text, var(--gas-primary));
    box-shadow: inset 0 0 0 1px var(--gas-menu-highlight-border, transparent);
    font-weight: var(--gas-weight-bold);
}

/* Item de menu poussé à droite (CTA en bout de barre). Sur la barre horizontale
   (flex), margin-inline-start:auto repousse l'item et la suite vers la droite. */
.gas-site-menu__item.gas-nav-cta-end {
    margin-inline-start: auto;
}
/* Allure bouton pour un item CTA mis en avant (highlight) en bout de barre :
   coins arrondis + padding horizontal. Scopé à l'item CTA-end (pas tous les highlight). */
.gas-site-menu__item.gas-nav-cta-end.is-highlight > .gas-site-menu__link,
.gas-site-menu__item.gas-nav-cta-end.is-highlight > .gas-site-menu__item-head > .gas-site-menu__link,
.gas-site-menu__item.gas-nav-cta-end.is-highlight > .gas-site-menu__link--parent {
    border-radius: var(--gas-radius-full, 999px);
    padding-inline: var(--gas-space-m, 16px);
}

.gas-site-menu__emoji {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.gas-site-menu__label-text {
    display: inline-block;
}

/* ── Action lists ── */

.gas-site-action-list {
    display: flex;
    align-items: center;
    gap: var(--_global-menu-gap, 2px);
    flex-wrap: wrap;
    max-width: 100%;
}

.gas-site-header__action-nav--application .gas-site-action-list {
    gap: var(--_app-menu-gap, var(--_global-menu-gap, 2px));
}

.gas-site-header__action-nav--application .gas-site-action-list__item a {
    font-size: var(--_app-font-size, var(--_global-font-size, var(--gas-text-xs)));
    background: var(--gas-neutral-100);
}

.gas-site-header__action-nav--application .gas-site-action-list__item a:hover {
    background: var(--gas-primary-ultra-light);
}

.gas-site-header__action-nav--account .gas-site-action-list {
    justify-content: flex-end;
    gap: var(--_account-menu-gap, var(--_global-menu-gap, 0));
}

.gas-site-header__action-nav--account {
    flex: 1 1 auto;
    width: 100%;
}

.gas-site-header__action-nav--account .gas-site-action-list__item a {
    font-size: var(--_account-font-size, var(--_global-font-size, var(--gas-text-xs)));
}

.gas-site-header__action-nav--account .gas-site-action-list__item.is-emphasis a {
    max-width: min(100%, 180px);
    white-space: normal;
    text-align: center;
}

.gas-site-action-list--language {
    gap: 2px;
}

.gas-site-header__action-nav--language .gas-site-action-list__item a {
    min-width: 32px;
    justify-content: center;
    padding-left: var(--gas-space-xs);
    padding-right: var(--gas-space-xs);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.gas-site-action-list__item.is-emphasis a {
    background: var(--_account-greeting-bg, var(--gas-primary-ultra-light));
    color: var(--_account-greeting-text, inherit);
    font-weight: var(--gas-weight-bold);
}

.gas-site-header--action-emphasis-soft-primary .gas-site-action-list__item.is-emphasis a {
    background: var(--gas-primary-ultra-light);
    color: var(--gas-primary);
    font-weight: var(--gas-weight-bold);
}

.gas-site-header--action-emphasis-outline-primary .gas-site-action-list__item.is-emphasis a {
    background: transparent;
    color: var(--gas-primary);
    border: 1px solid var(--gas-primary-light);
    font-weight: var(--gas-weight-bold);
}

.gas-site-header--action-emphasis-solid-primary .gas-site-action-list__item.is-emphasis a {
    background: var(--gas-primary);
    color: var(--gas-white);
    font-weight: var(--gas-weight-bold);
}

.gas-site-header--action-emphasis-neutral-pill .gas-site-action-list__item.is-emphasis a {
    background: var(--gas-neutral-100);
    color: var(--gas-neutral-800);
    border: 1px solid var(--gas-neutral-300);
    font-weight: var(--gas-weight-semi);
}

.gas-site-header--action-emphasis-accent-pill .gas-site-action-list__item.is-emphasis a {
    background: var(--gas-accent-ultra-light);
    color: var(--gas-accent-dark);
    border: 1px solid var(--gas-accent-light);
    font-weight: var(--gas-weight-bold);
}

.gas-site-header--action-emphasis-underline .gas-site-action-list__item.is-emphasis a {
    background: transparent;
    color: var(--gas-primary);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.18em;
    font-weight: var(--gas-weight-bold);
}

/* ── CTA group ── */

.gas-site-header__cta-group {
    display: flex;
    align-items: center;
    gap: var(--gas-space-s);
    flex-wrap: wrap;
    flex-shrink: 0;
}

.gas-site-header__cta-group .gas-button--primary {
    background: var(--_cta-primary-bg);
    color: var(--_cta-primary-color);
    border-color: var(--_cta-primary-bg);
}

.gas-site-header__cta-group .gas-button--primary:hover {
    background: var(--_cta-primary-hover-bg);
    border-color: var(--_cta-primary-hover-bg);
}

.gas-site-header__cta-group .gas-button--primary-outline,
.gas-site-header__cta-group .gas-button--primary-ghost,
.gas-site-header__cta-group .gas-button--ghost {
    background: var(--_cta-secondary-bg);
    color: var(--_cta-secondary-color);
    border-color: var(--_cta-secondary-color);
}

.gas-site-header__custom-link.gas-button--primary-outline,
.gas-site-header__custom-link.gas-button--primary-ghost,
.gas-site-header__custom-link.gas-button--ghost {
    background: var(--_cta-secondary-bg);
    color: var(--_cta-secondary-color);
    border-color: var(--_cta-secondary-color);
}

.gas-site-header__cta-group .gas-button--primary-outline:hover,
.gas-site-header__cta-group .gas-button--primary-ghost:hover,
.gas-site-header__cta-group .gas-button--ghost:hover {
    background: var(--_cta-secondary-hover-bg);
}

.gas-site-header__custom-link.gas-button--primary-outline:hover,
.gas-site-header__custom-link.gas-button--primary-ghost:hover,
.gas-site-header__custom-link.gas-button--ghost:hover {
    background: var(--_cta-secondary-hover-bg);
}

/* ── Dropdowns ── */

.gas-site-menu__dropdown,
.gas-site-header__mega-panel {
    position: absolute;
    top: calc(100% + var(--gas-space-xs));
    right: 0;
    min-width: 240px;
    padding: var(--gas-space-s);
    background: var(--_header-panel-bg);
    border: 1px solid var(--_header-border);
    border-radius: var(--gas-radius-l);
    box-shadow: var(--gas-shadow-m);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(6px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
    z-index: 40;
}

.gas-site-menu__item.is-open > .gas-site-menu__dropdown,
.gas-site-header__member-mega.is-open > .gas-site-header__mega-panel {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.gas-site-menu--sub {
    display: grid;
    gap: 2px;
}

.gas-site-menu--sub .gas-site-menu__dropdown {
    left: calc(100% + var(--gas-space-s));
    right: auto;
    top: 0;
}

.gas-site-menu--sub .gas-site-menu__link,
.gas-site-menu--sub .gas-site-menu__trigger {
    width: 100%;
    justify-content: space-between;
}

/* ── Mega menu ── */

.gas-site-header__mega-panel {
    width: min(480px, calc(100vw - 20px));
    padding: var(--gas-space-l);
    right: auto;
    left: 50%;
    transform: translateX(-50%) translateY(6px);
}

.gas-site-header__member-mega.is-open > .gas-site-header__mega-panel {
    transform: translateX(-50%) translateY(0);
}

.gas-site-header__mega-message {
    margin-bottom: var(--gas-space-m);
    padding: var(--gas-space-s) var(--gas-space-m);
    border-radius: var(--gas-radius-s);
    border: 1px solid var(--_header-border);
    background: var(--gas-neutral-50);
    color: var(--_header-text);
    font-size: var(--gas-text-xs);
    line-height: 1.45;
}

.gas-site-header__mega-message > *:first-child {
    margin-top: 0;
}

.gas-site-header__mega-message > *:last-child {
    margin-bottom: 0;
}

.gas-site-header__mega-columns {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--gas-space-m);
    max-height: 60vh;
    overflow-y: auto;
}

.gas-site-header__mega-title {
    margin: 0 0 var(--gas-space-xs);
    font-size: var(--gas-text-s);
    font-weight: var(--gas-weight-bold);
    color: var(--_member-color);
}

.gas-site-header__mega-title a { color: inherit; }
.gas-site-header__mega-title a:hover { color: var(--_member-hover-color); }

.gas-site-header__mega-description {
    margin: 0 0 var(--gas-space-s);
    color: var(--_header-muted);
    font-size: var(--gas-text-xs);
}

.gas-site-header__mega-links,
.gas-site-header__mega-sub-links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.gas-site-header__mega-links { display: grid; gap: var(--_member-menu-gap, var(--_global-menu-gap, var(--gas-space-xs))); }

.gas-site-header__mega-link-item > a,
.gas-site-header__mega-sub-links a {
    display: block;
    padding: var(--gas-space-xs) var(--gas-space-s);
    border-radius: var(--gas-radius-s);
    color: var(--_member-color);
    font-size: var(--_member-font-size, var(--_global-font-size, var(--gas-text-xs)));
    transition: background var(--gas-transition-fast), color var(--gas-transition-fast);
}

.gas-site-header__mega-link-item > a:hover,
.gas-site-header__mega-sub-links a:hover {
    background: var(--_member-hover-bg);
    color: var(--_member-hover-color);
}

.gas-site-header__mega-link-item > a.is-current {
    background: var(--_member-active-bg);
    color: var(--_member-active-color);
}

.gas-site-header__mega-link-item > a.is-highlight,
.gas-site-header__mega-sub-links a.is-highlight {
    background: var(--gas-menu-highlight-bg, var(--gas-primary-ultra-light));
    color: var(--gas-menu-highlight-text, var(--gas-primary));
    box-shadow: inset 0 0 0 1px var(--gas-menu-highlight-border, transparent);
    font-weight: var(--gas-weight-bold);
}

.gas-site-header__mega-sub-links {
    display: grid;
    gap: 2px;
    margin-top: var(--gas-space-xs);
    padding-left: var(--gas-space-s);
}

/* ── School promo ── */

.gas-site-header__school-promo {
    position: relative;
    z-index: 10;
}

.gas-site-header__school-promo-inner {
    display: flex;
    align-items: center;
    gap: var(--gas-space-m);
    padding: var(--gas-space-s) var(--gas-space-l);
    background: var(--gas-neutral-50);
    border-bottom: 1px solid var(--_header-border);
    max-width: 1440px;
    margin: 0 auto;
}

.gas-site-header__school-promo--card .gas-site-header__school-promo-inner {
    margin: var(--gas-space-s) var(--gas-space-l) 0;
    padding: var(--gas-space-m);
    border: 1px solid var(--_header-border);
    border-radius: var(--gas-radius-l);
    box-shadow: var(--gas-shadow-xs);
    background: var(--_header-panel-bg);
}

.gas-site-header__school-logo img {
    display: block;
    width: 42px;
    height: 42px;
    object-fit: cover;
    border-radius: var(--gas-radius-m);
}

.gas-site-header__school-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1;
}

.gas-site-header__school-label,
.gas-site-header__school-meta,
.gas-site-header__school-description {
    margin: 0;
    font-size: var(--gas-text-xs);
}

.gas-site-header__school-label,
.gas-site-header__school-meta {
    color: var(--_header-muted);
}

.gas-site-header__school-title {
    color: var(--_header-text);
    font-weight: var(--gas-weight-bold);
    font-size: var(--gas-text-s);
}

.gas-site-header__school-title:hover { color: var(--gas-primary); }

.gas-site-header__school-cta {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: var(--gas-space-xs) var(--gas-space-m);
    border-radius: var(--gas-radius-s);
    background: var(--gas-primary);
    color: var(--gas-white);
    font-size: var(--gas-text-xs);
    font-weight: var(--gas-weight-bold);
    transition: background var(--gas-transition-fast);
    flex-shrink: 0;
}

.gas-site-header__school-cta:hover {
    background: var(--gas-primary-dark);
    color: var(--gas-white);
}

.gas-site-header__school-promo--inline .gas-site-header__school-promo-inner {
    padding-top: var(--gas-space-xs);
    padding-bottom: var(--gas-space-xs);
}

.gas-site-header__school-promo--inline .gas-site-header__school-logo,
.gas-site-header__school-promo--inline .gas-site-header__school-meta,
.gas-site-header__school-promo--inline .gas-site-header__school-description,
.gas-site-header__school-promo--inline .gas-site-header__school-cta {
    display: none;
}

/* CTA texte inline apres le titre (layouts inline + pill) */
.gas-site-header__school-cta-inline {
    font-weight: var(--gas-weight-regular);
    opacity: 0.7;
    font-size: 0.9em;
}

/* ── Drawer + Overlay (hidden by default) ── */

.gas-site-header__drawer,
.gas-site-header__overlay {
    display: none;
}

/* ── Drawer close button ── */

.gas-site-header__drawer-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-left: auto;
    border: 1px solid var(--_header-border);
    border-radius: var(--gas-radius-m);
    background: var(--_header-control-bg);
    color: var(--_header-text);
    font-size: 14px;
    font-weight: var(--gas-weight-bold);
    line-height: 1;
    cursor: pointer;
    transition: background var(--gas-transition-fast);
    flex-shrink: 0;
    padding: 0;
}

.gas-site-header__drawer-close:hover {
    background: var(--_header-hover-bg);
}

/* ══════════════════════════════════════════
   Submenu styles: Hover
   ══════════════════════════════════════════ */

.gas-site-header--submenu-hover .gas-site-menu__item--has-children > .gas-site-menu__dropdown {
    top: 100%;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

.gas-site-header--submenu-hover .gas-site-menu__item--has-children:hover > .gas-site-menu__dropdown,
.gas-site-header--submenu-hover .gas-site-menu__item--has-children:focus-within > .gas-site-menu__dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.gas-site-header--submenu-hover .gas-site-menu__link--parent {
    gap: var(--gas-space-xs);
}

.gas-site-header--submenu-hover .gas-site-menu--sub .gas-site-menu__dropdown {
    left: 100%;
}

/* ══════════════════════════════════════════
   Submenu styles: Underline (click-on-link)
   ══════════════════════════════════════════ */

.gas-site-header--submenu-underline .gas-site-menu__link--parent {
    border: 0;
    background: transparent;
    font-family: inherit;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    padding-bottom: var(--gas-space-xs);
    transition: border-color var(--gas-transition-fast), color var(--gas-transition-fast);
    gap: var(--gas-space-xs);
    cursor: pointer;
}

.gas-site-header--submenu-underline .gas-site-menu__link--parent:hover {
    color: var(--gas-primary);
}

.gas-site-header--submenu-underline .gas-site-menu__item.is-open > .gas-site-menu__link--parent {
    border-bottom-color: var(--gas-primary);
    color: var(--gas-primary);
}

/* ══════════════════════════════════════════
   Submenu styles: Fullwidth (mega-style)
   ══════════════════════════════════════════ */

.gas-site-header--submenu-fullwidth .gas-site-menu__link--parent {
    gap: var(--gas-space-xs);
    cursor: pointer;
}

.gas-site-header--submenu-fullwidth .gas-site-header__col,
.gas-site-header--submenu-fullwidth .gas-site-header__primary-nav,
.gas-site-header--submenu-fullwidth .gas-site-header__gas-menu,
.gas-site-header--submenu-fullwidth .gas-site-menu--primary,
.gas-site-header--submenu-fullwidth .gas-site-menu--gas {
    position: static;
}

.gas-site-header--submenu-fullwidth .gas-site-menu__item--has-children {
    position: static;
}

.gas-site-menu__dropdown--fullwidth {
    left: 0 !important;
    right: 0 !important;
    width: 100%;
    min-width: 0;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
    padding: 0;
    box-shadow: var(--gas-shadow-l);
    transform: translateY(6px);
}

.gas-site-menu__item.is-open > .gas-site-menu__dropdown--fullwidth {
    transform: translateY(0);
}

.gas-site-menu__dropdown-inner {
    max-width: var(--gas-max-width, 1280px);
    margin: 0 auto;
    padding: var(--gas-space-l) var(--gas-space-xl);
}

.gas-site-menu--columns {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: var(--gas-space-xs);
}

.gas-site-menu--columns .gas-site-menu__item {
    break-inside: avoid;
}

.gas-site-menu--columns .gas-site-menu__link {
    padding: var(--gas-space-xs) var(--gas-space-s);
    border-radius: var(--gas-radius-s);
    font-size: var(--_nav-font-size, var(--_global-font-size, var(--gas-text-s)));
}

.gas-site-menu--columns .gas-site-menu__link:hover {
    background: var(--_nav-hover-bg);
    color: var(--_nav-hover-color);
}

/* ── Fullwidth: nested sub-dropdowns as inline groups ── */

.gas-site-header--submenu-fullwidth .gas-site-menu--columns .gas-site-menu__item--has-children {
    grid-column: 1 / -1;
    position: relative;
}

.gas-site-header--submenu-fullwidth .gas-site-menu--columns .gas-site-menu__dropdown {
    position: static;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
    border: 0;
    box-shadow: none;
    padding: 0;
    padding-left: var(--gas-space-m);
    background: transparent;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: var(--gas-space-xs);
}

/* ══════════════════════════════════════════
   Submenu styles: Minimal (modern/clean)
   ══════════════════════════════════════════ */

.gas-site-header--submenu-minimal .gas-site-menu__link--parent {
    border: 0;
    background: transparent;
    font-family: inherit;
    cursor: pointer;
    gap: var(--gas-space-xs);
    padding: var(--gas-space-xs) var(--gas-space-s);
    border-radius: 0;
    transition: color var(--gas-transition-fast);
    position: relative;
}

.gas-site-header--submenu-minimal .gas-site-menu__link--parent:hover {
    color: var(--_nav-hover-color);
}

.gas-site-header--submenu-minimal .gas-site-menu__item.is-open > .gas-site-menu__link--parent {
    color: var(--_nav-active-color);
}

/* Active indicator bar below the trigger */
.gas-site-header--submenu-minimal .gas-site-menu__item.is-open > .gas-site-menu__link--parent::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: var(--gas-space-s);
    right: var(--gas-space-s);
    height: 2px;
    background: var(--gas-primary);
    border-radius: 1px;
}

/* Flush dropdown: no gap, no border-radius, top accent bar */
.gas-site-header--submenu-minimal .gas-site-menu__dropdown {
    top: 100%;
    border-radius: 0;
    border-top: 2px solid var(--gas-primary);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    padding: var(--gas-space-xs) 0;
    min-width: 220px;
    transform: none;
    opacity: 0;
    transition: opacity 0.15s ease, visibility 0.15s ease;
}

.gas-site-header--submenu-minimal .gas-site-menu__item.is-open > .gas-site-menu__dropdown {
    opacity: 1;
    transform: none;
}

/* Sub-items: clean left border on hover */
.gas-site-header--submenu-minimal .gas-site-menu--sub .gas-site-menu__link {
    padding: var(--gas-space-xs) var(--gas-space-m);
    border-radius: 0;
    border-left: 2px solid transparent;
    transition: border-color var(--gas-transition-fast), color var(--gas-transition-fast), background var(--gas-transition-fast);
    font-size: var(--_nav-font-size, var(--_global-font-size, var(--gas-text-s)));
}

.gas-site-header--submenu-minimal .gas-site-menu--sub .gas-site-menu__link:hover {
    border-left-color: var(--gas-primary);
    color: var(--_nav-hover-color);
    background: var(--gas-neutral-50, var(--_nav-hover-bg));
}

/* Nested dropdowns in minimal: appear to the right, flush */
.gas-site-header--submenu-minimal .gas-site-menu--sub .gas-site-menu__dropdown {
    left: 100%;
    right: auto;
    top: 0;
    border-top: 0;
    border-left: 2px solid var(--gas-primary);
}

/* ── Chevron indicator ── */

.gas-site-menu__chevron {
    font-size: 0.8em;
    line-height: 1;
    transition: transform var(--gas-transition-fast);
}

.gas-site-menu__item.is-open > .gas-site-menu__link--parent .gas-site-menu__chevron,
.gas-site-menu__item--has-children:hover > .gas-site-menu__link--parent .gas-site-menu__chevron {
    transform: rotate(180deg);
}

/* ══════════════════════════════════════════
   Mega menu: Content card
   ══════════════════════════════════════════ */

.gas-site-header__mega-panel--with-content {
    display: grid;
    grid-template-columns: 180px 1fr;
    align-items: start;
    gap: var(--gas-space-l);
    width: min(580px, calc(100vw - 20px));
}

.gas-site-header__mega-content {
    min-width: 0;
}

.gas-site-header__mega-content-card {
    display: flex;
    flex-direction: column;
    gap: 0;
    color: var(--_header-text);
    border: 1px solid var(--_header-border);
    border-radius: var(--gas-radius-m);
    overflow: hidden;
    transition: box-shadow var(--gas-transition-fast), border-color var(--gas-transition-fast);
}

.gas-site-header__mega-content-card:hover {
    border-color: var(--gas-primary-light);
    box-shadow: var(--gas-shadow-s);
}

.gas-site-header__mega-content-img {
    display: block;
    width: 100%;
    height: 100px;
    object-fit: cover;
    flex-shrink: 0;
}

.gas-site-header__mega-content-body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: var(--gas-space-s);
}

.gas-site-header__mega-content-date {
    font-size: 10px;
    color: var(--gas-primary);
    font-weight: var(--gas-weight-semi);
}

.gas-site-header__mega-content-title {
    font-size: var(--gas-text-xs);
    font-weight: var(--gas-weight-bold);
    line-height: var(--gas-leading-tight);
}

.gas-site-header__mega-content-meta {
    font-size: 10px;
    color: var(--_header-muted);
}

.gas-site-header__mega-content-price {
    font-size: var(--gas-text-xs);
    font-weight: var(--gas-weight-bold);
    color: var(--gas-primary);
    margin-top: var(--gas-space-xs);
}

.gas-site-header__mega-editorial-links {
    min-width: 0;
}

.gas-site-header__mega-editorial-links-title {
    margin: 0 0 var(--gas-space-s);
    font-size: var(--gas-text-xs);
    font-weight: var(--gas-weight-bold);
    color: var(--_header-text);
}

.gas-site-header__mega-editorial-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--gas-space-xs);
}

.gas-site-header__mega-editorial-link {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--gas-space-xs);
    align-items: center;
    text-decoration: none;
    color: inherit;
}

.gas-site-header__mega-editorial-thumb-wrap {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    overflow: hidden;
    background: var(--gas-neutral-100);
    border: 1px solid var(--_header-border);
}

.gas-site-header__mega-editorial-thumb {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.gas-site-header__mega-editorial-link-title {
    font-size: var(--gas-text-xs);
    line-height: 1.3;
    color: var(--_header-text);
}

.gas-site-header__mega-editorial-link-cat {
    display: block;
    font-size: var(--gas-text-xxs);
    color: var(--_header-muted);
}

/* Note: The old "centered" layout is replaced by the row-based builder.
   Users achieve centered layouts by placing branding alone in a 1/1 row
   and nav in a separate 1/1 row below it. No special layout mode needed. */

/* ══════════════════════════════════════════
   RESPONSIVE — Tablet / Mobile (< 1100px)
   ══════════════════════════════════════════ */

@media (max-width: 1100px) {

    /* Hide all rows except the one with branding */
    .gas-site-header__row:not(.gas-site-header__row--has-branding) {
        display: none;
    }

    /* In the branding row: single column on mobile */
    .gas-site-header__row--has-branding {
        grid-template-columns: 1fr;
    }

    /* Hide non-first columns on mobile */
    .gas-site-header__row--has-branding .gas-site-header__col:not(:first-child) {
        display: none;
    }

    /* First column: only show branding and hamburger */
    .gas-site-header__row--has-branding .gas-site-header__col:first-child > *:not(.gas-site-header__element--branding):not(.gas-site-header__toggle) {
        display: none;
    }

    /* Fallback: when no branding row exists, show the first row (with hamburger) */
    .gas-site-header--no-branding .gas-site-header__row:first-child {
        display: grid;
        grid-template-columns: 1fr;
    }

    .gas-site-header--no-branding .gas-site-header__row:first-child .gas-site-header__col:not(:first-child) {
        display: none;
    }

    .gas-site-header--no-branding .gas-site-header__row:first-child .gas-site-header__col:first-child > *:not(.gas-site-header__toggle) {
        display: none;
    }

    /* Mobile logo width override */
    .gas-site-header__logo img {
        max-width: var(--_logo-w-mobile, var(--_logo-w));
    }

    /* Hamburger visible on mobile */
    .gas-site-header__toggle {
        display: inline-flex;
        margin-left: auto;
    }

    .gas-site-header__element-wrap--sep-left,
    .gas-site-header__element-wrap--sep-right {
        border-left: 0;
        border-right: 0;
        padding-left: 0;
        padding-right: 0;
    }

    /* ── Responsive size overrides (mobile variants) ── */
    /* When --_xxx-mobile is set via inline style, override the desktop value on mobile */
    .gas-site-header[style*="--_global-font-size-mobile"] {
        --_global-font-size: var(--_global-font-size-mobile);
    }
    .gas-site-header[style*="--_nav-font-size-mobile"] {
        --_nav-font-size: var(--_nav-font-size-mobile);
    }
    .gas-site-header[style*="--_member-font-size-mobile"] {
        --_member-font-size: var(--_member-font-size-mobile);
    }
    .gas-site-header[style*="--_app-font-size-mobile"] {
        --_app-font-size: var(--_app-font-size-mobile);
    }
    .gas-site-header[style*="--_account-font-size-mobile"] {
        --_account-font-size: var(--_account-font-size-mobile);
    }
    .gas-site-header[style*="--_global-menu-gap-mobile"] {
        --_global-menu-gap: var(--_global-menu-gap-mobile);
    }
    .gas-site-header[style*="--_nav-menu-gap-mobile"] {
        --_nav-menu-gap: var(--_nav-menu-gap-mobile);
    }
    .gas-site-header[style*="--_member-menu-gap-mobile"] {
        --_member-menu-gap: var(--_member-menu-gap-mobile);
    }
    .gas-site-header[style*="--_app-menu-gap-mobile"] {
        --_app-menu-gap: var(--_app-menu-gap-mobile);
    }
    .gas-site-header[style*="--_account-menu-gap-mobile"] {
        --_account-menu-gap: var(--_account-menu-gap-mobile);
    }

    /* ── Drawer ── */

    .gas-site-header__drawer {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: min(380px, 85vw);
        max-height: 100dvh;
        overflow-y: auto;
        overscroll-behavior: contain;
        background: var(--_header-panel-bg);
        border-left: 1px solid var(--_header-border);
        box-shadow: var(--gas-shadow-l);
        z-index: 200;
        transform: translateX(100%);
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .gas-site-header.is-drawer-open .gas-site-header__drawer {
        display: block;
        transform: translateX(0);
    }

    .gas-site-header__drawer.is-visible {
        display: block;
    }

    .gas-site-header__drawer-inner {
        display: grid;
        gap: var(--gas-space-l);
        padding: var(--gas-space-l);
    }

    /* Drawer head (logo + close) */
    .gas-site-header__drawer-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: var(--gas-space-m);
        padding-bottom: var(--gas-space-s);
        border-bottom: 1px solid var(--_header-border);
    }

    .gas-site-header__drawer-head .gas-site-header__branding {
        flex: 1;
        min-width: 0;
    }

    .gas-site-header__drawer-head .gas-site-header__logo img {
        max-height: 40px;
    }

    /* Sections */
    .gas-site-header__drawer-section {
        display: grid;
        gap: var(--gas-space-s);
    }

    .gas-site-header__drawer-title {
        margin: 0;
        padding: 0 2px;
        font-size: 10px;
        color: var(--_header-muted);
        text-transform: uppercase;
        letter-spacing: 0.08em;
        font-weight: var(--gas-weight-bold);
    }

    .gas-site-header__drawer-links,
    .gas-site-header__drawer-menu {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        gap: var(--gas-space-xs);
    }

    /* Links in drawer */
    .gas-site-header__drawer-links a,
    .gas-site-header__drawer-menu a,
    .gas-site-header__drawer-toggle {
        display: flex;
        justify-content: space-between;
        align-items: center;
        min-height: 46px;
        padding: var(--gas-space-s) var(--gas-space-m);
        border: 1px solid var(--_header-border);
        border-radius: var(--gas-radius-m);
        background: var(--_header-control-bg);
        color: var(--_header-text);
        font-size: var(--gas-text-xs);
        font-weight: var(--gas-weight-semi);
        transition: background var(--gas-transition-fast);
    }

    .gas-site-header__drawer-links a:hover,
    .gas-site-header__drawer-menu a:hover {
        background: var(--_header-hover-bg);
    }

    .gas-site-header__drawer-links .is-current a,
    .gas-site-header__drawer-menu .is-current > a,
    .gas-site-header__drawer-menu .is-current > .gas-site-header__drawer-row > a {
        background: var(--_nav-active-bg);
        color: var(--_nav-active-color);
        border-color: var(--_nav-active-color);
    }

    .gas-site-header__drawer-menu .is-current-ancestor > .gas-site-header__drawer-row > a,
    .gas-site-header__drawer-menu .is-current-ancestor > .gas-site-header__drawer-row > .gas-site-header__drawer-label {
        color: var(--_nav-active-color);
        font-weight: var(--gas-weight-bold);
    }

    .gas-site-header__drawer-links .is-highlight a,
    .gas-site-header__drawer-menu .is-highlight > a,
    .gas-site-header__drawer-menu .is-highlight > .gas-site-header__drawer-row > a,
    .gas-site-header__drawer-menu .is-highlight > .gas-site-header__drawer-label,
    .gas-site-header__drawer-menu .is-highlight > .gas-site-header__drawer-row > .gas-site-header__drawer-label {
        background: var(--gas-menu-highlight-bg, var(--gas-primary-ultra-light));
        color: var(--gas-menu-highlight-text, var(--gas-primary));
        border-color: var(--gas-menu-highlight-border, var(--gas-primary-light));
        font-weight: var(--gas-weight-bold);
    }


    .gas-site-header__drawer-toggle {
        cursor: pointer;
        border: 1px solid var(--_header-border);
    }

    .gas-site-header__drawer-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: var(--gas-space-xs);
    }

    .gas-site-header__drawer-row > a,
    .gas-site-header__drawer-label {
        min-width: 0;
        display: flex;
        align-items: center;
        min-height: 46px;
        padding: var(--gas-space-s) var(--gas-space-m);
        border: 1px solid var(--_header-border);
        border-radius: var(--gas-radius-m);
        background: var(--_header-control-bg);
        color: var(--_header-text);
        font-size: var(--gas-text-xs);
        font-weight: var(--gas-weight-semi);
    }

    .gas-site-header__drawer-toggle {
        width: 46px;
        justify-content: center;
    }

    .gas-site-header__drawer-submenu {
        margin-top: var(--gas-space-xs);
        padding-left: var(--gas-space-m);
    }

    /* ── Overlay ── */

    .gas-site-header.is-drawer-open .gas-site-header__overlay {
        display: block;
    }

    .gas-site-header__overlay {
        position: fixed;
        inset: 0;
        background: var(--gas-bg-overlay);
        z-index: 190;
    }

    /* School promo in mobile */
    .gas-site-header__school-promo-inner {
        padding-left: var(--gas-space-m);
        padding-right: var(--gas-space-m);
    }

    .gas-site-header__school-cta { margin-left: 0; }

    /* CTA in drawer */
    .gas-site-header__drawer .gas-site-header__cta-group {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: var(--gas-space-s);
    }

    .gas-site-header__drawer .gas-site-header__cta-group .gas-button {
        justify-content: center;
        text-align: center;
    }
}

/* ══════════════════════════════════════════
   RESPONSIVE — Small mobile (< 600px)
   ══════════════════════════════════════════ */

@media (max-width: 600px) {
    .gas-site-header__row--has-branding {
        padding: var(--gas-space-xs) var(--gas-space-m);
        gap: var(--gas-space-s);
        min-height: 52px;
    }

    .gas-site-header__brand-link {
        gap: var(--gas-space-s);
    }

    .gas-site-header__logo img {
        max-height: 42px;
    }

    .gas-site-header__site-name {
        font-size: var(--gas-text-s);
    }

    .gas-site-header__site-description {
        display: none;
    }

    .gas-site-header__school-promo-inner {
        flex-wrap: wrap;
        gap: var(--gas-space-s);
    }

    .gas-site-header__school-cta {
        width: 100%;
        justify-content: center;
    }

    .gas-site-header__drawer {
        width: 100vw;
    }

    .gas-site-header__drawer .gas-site-header__cta-group {
        grid-template-columns: 1fr;
    }
}

/* ────────────────────────────────────────────────────────────
 * Blocs « contenu libre » du header builder
 * ──────────────────────────────────────────────────────────── */

/* Texte libre */
.gas-site-header__text {
    color: inherit;
    line-height: 1.4;
}
.gas-site-header__text p { margin: 0; }
.gas-site-header__text p + p { margin-top: 0.4em; }
.gas-site-header__text--size-s { font-size: 8.5px; }
.gas-site-header__text--size-m { font-size: 10px; }
.gas-site-header__text--size-l { font-size: 12px; }
.gas-site-header__text--left   { text-align: left; }
.gas-site-header__text--center { text-align: center; }
.gas-site-header__text--right  { text-align: right; }
.gas-site-header__text a {
    color: inherit;
    text-decoration: underline;
}

/* Spacer */
.gas-site-header__spacer {
    align-self: stretch;
    min-width: 4px;
}
.gas-site-header__spacer--grow {
    flex: 1 1 auto;
}

/* Divider */
.gas-site-header__divider {
    flex: 0 0 auto;
}
.gas-site-header__divider--horizontal {
    align-self: stretch;
}

/* Mobile : si data-mobile-width est posé, surcharger la largeur dans le drawer */
@media (max-width: 768px) {
    .gas-site-header__spacer[data-mobile-width] {
        width: attr(data-mobile-width);
    }
}

/* Image custom */
.gas-site-header__image { display: inline-flex; align-items: center; }
.gas-site-header__image-img { display: block; max-width: 100%; height: auto; }

/* Recherche */
.gas-site-header__search { align-items: center; display: inline-flex; gap: 4px; }
.gas-site-header__search-input {
    background: var(--gas-bg-surface-alt, #f7f9fc);
    border: 1px solid var(--gas-border-color, #d7dde5);
    border-radius: var(--gas-radius-s, 4px);
    color: inherit;
    font-size: 9px;
    height: 32px;
    min-width: 160px;
    padding: 4px 10px;
}
.gas-site-header__search-btn {
    align-items: center;
    background: transparent;
    border: 1px solid var(--gas-border-color, #d7dde5);
    border-radius: var(--gas-radius-s, 4px);
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    gap: 4px;
    height: 32px;
    padding: 0 10px;
}
.gas-site-header__search-btn:hover { color: var(--gas-primary, #2d6cdf); }
.gas-site-header__search--icon { position: relative; }
.gas-site-header__search--icon .gas-site-header__search-input { display: none; min-width: 200px; }
.gas-site-header__search--icon:focus-within .gas-site-header__search-input { display: inline-block; }
.gas-site-header__search-icon-btn {
    background: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
    padding: 4px;
}

/* Icon link */
.gas-site-header__icon-link {
    align-items: center;
    background: var(--gas-site-header-icon-link-bg, transparent);
    border: 1px solid transparent;
    color: var(--gas-site-header-icon-link-color, inherit);
    display: inline-flex;
    justify-content: center;
    text-decoration: none;
    transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease, transform 120ms ease;
}
.gas-site-header__icon-link:hover,
.gas-site-header__icon-link:focus-visible {
    color: var(--gas-site-header-icon-link-hover-color, var(--gas-primary));
    transform: translateY(-1px);
}
.gas-site-header__icon-link--s {
    height: 28px;
    width: 28px;
}
.gas-site-header__icon-link--m {
    height: 36px;
    width: 36px;
}
.gas-site-header__icon-link--l {
    height: 44px;
    width: 44px;
}
.gas-site-header__icon-link--s svg {
    height: 18px;
    width: 18px;
}
.gas-site-header__icon-link--m svg {
    height: 22px;
    width: 22px;
}
.gas-site-header__icon-link--l svg {
    height: 26px;
    width: 26px;
}
.gas-site-header__icon-link--plain {
    height: auto;
    width: auto;
}
.gas-site-header__icon-link--circle {
    border-radius: 999px;
}
.gas-site-header__icon-link--square {
    border-radius: var(--gas-radius-s, 4px);
}
.gas-site-header__icon-link--outline {
    border-color: currentColor;
    border-radius: 999px;
}

/* Social icons */
.gas-site-header__social { align-items: center; display: inline-flex; gap: 8px; }
.gas-site-header__social--s svg { width: 18px; height: 18px; }
.gas-site-header__social--m svg { width: 22px; height: 22px; }
.gas-site-header__social--l svg { width: 28px; height: 28px; }
.gas-site-header__social-link {
    align-items: center;
    color: inherit;
    display: inline-flex;
    justify-content: center;
    text-decoration: none;
    transition: opacity 120ms, transform 120ms;
}
.gas-site-header__social-link:hover { opacity: 0.7; }
.gas-site-header__social--rounded .gas-site-header__social-link,
.gas-site-header__social--square .gas-site-header__social-link {
    background: var(--gas-bg-surface-alt, #f7f9fc);
    border-radius: var(--gas-radius-s, 4px);
    padding: 6px;
}
.gas-site-header__social--rounded .gas-site-header__social-link { border-radius: 50%; }

/* Newsletter */
.gas-site-header__newsletter { align-items: center; display: inline-flex; flex-wrap: wrap; gap: 6px; }
.gas-site-header__newsletter--stacked { flex-direction: column; align-items: stretch; }
.gas-site-header__newsletter-title {
    color: inherit;
    font-size: 8.5px;
    font-weight: 600;
    margin-right: 6px;
}
.gas-site-header__newsletter-input {
    background: var(--gas-bg-surface-alt, #f7f9fc);
    border: 1px solid var(--gas-border-color, #d7dde5);
    border-radius: var(--gas-radius-s, 4px);
    color: inherit;
    font-size: 9px;
    height: 32px;
    min-width: 180px;
    padding: 4px 10px;
}

/* Next activity / Last article : laisser le shortcode définir son rendu */
.gas-site-header__next-activity,
.gas-site-header__last-article {
    display: inline-block;
    max-width: 360px;
    font-size: 8.5px;
}
.gas-site-header__next-activity > *,
.gas-site-header__last-article > * {
    margin: 0;
}

/* Contact */
.gas-site-header__contact { align-items: center; display: inline-flex; gap: 12px; }
.gas-site-header__contact--stacked { flex-direction: column; align-items: flex-start; gap: 4px; }
.gas-site-header__contact-item {
    align-items: center;
    color: inherit;
    display: inline-flex;
    font-size: 8.5px;
    gap: 4px;
    text-decoration: none;
}
.gas-site-header__contact-item:hover { color: var(--gas-primary, #2d6cdf); }

/* Cart badge */
.gas-site-header__cart-badge,
.gas-site-header__notif-badge {
    align-items: center;
    color: inherit;
    display: inline-flex;
    gap: 4px;
    position: relative;
    text-decoration: none;
}
.gas-site-header__cart-badge:hover,
.gas-site-header__notif-badge:hover { color: var(--gas-primary, #2d6cdf); }
.gas-site-header__cart-badge-count,
.gas-site-header__notif-badge-count {
    background: var(--gas-danger, #d93030);
    border-radius: 999px;
    color: #fff;
    font-size: 7px;
    font-weight: 700;
    line-height: 1;
    padding: 2px 6px;
    position: absolute;
    right: -6px;
    top: -4px;
}
.gas-site-header__cart-badge-label,
.gas-site-header__notif-badge-label {
    font-size: 8.5px;
    margin-left: 4px;
}

/* HTML raw + shortcode wrappers : pas de style imposé, l'admin gère */
.gas-site-header__html-raw,
.gas-site-header__shortcode {
    display: inline-flex;
    align-items: center;
}

@media (prefers-color-scheme: dark) {
    :root[data-theme="auto"] .gas-site-header {
        --_header-bg: var(--gas-site-header-bg-dark, var(--_header-panel-bg));
        --_nav-hover-color:       var(--gas-primary-light);
        --_nav-active-color:      var(--gas-primary-light);
        --_member-hover-color:    var(--gas-primary-light);
        --_member-active-color:   var(--gas-primary-light);
        --_cta-primary-bg:        var(--gas-primary-light);
        --_cta-primary-hover-bg:  var(--gas-primary-light);
        --_cta-primary-color:     var(--gas-color-on-primary);
        --_cta-secondary-color:   var(--gas-text-color-link);
        --_cta-secondary-hover-bg: var(--_header-hover-bg);
    }
}