@layer tokens {
    /* TYPOGRAPHIES */
    :root {
        --local-color-identity-action: rgb(10 75 180);
        --local-color-identity-action-hover: hsl(217 85% 39%);
        --local-color-identity-action-faint: color-mix(in srgb, var(--local-color-identity-action) 10%, white);
        --local-color-identity-dark: hsl(216 20% 7%);
        --local-color-identity-dark-hover: hsl(216 17% 10%);
        --local-color-identity-red: rgb(255 50 50);
        --local-color-identity-red-hover: rgb(255 30 30);
        --raw-color-pearl-1: rgb(250 250 252);
        --raw-color-pearl-2: rgb(245 245 247);
        --raw-color-white-90: rgb(255 255 255 / 0.9);
        --raw-color-white-70: rgb(255 255 255 / 0.7);
        --raw-color-white-50: rgb(255 255 255 / 0.5);
        --raw-color-black: rgb(0 0 0 / 1);
        --raw-color-black-90: rgb(0 0 0 / 0.9);
        --raw-color-black-85: rgb(0 0 0 / 0.85);
        --raw-color-black-80: rgb(0 0 0 / 0.8);
        --raw-color-black-70: rgb(0 0 0 / 0.7);
        --raw-color-black-60: rgb(0 0 0 / 0.6);
        --raw-color-black-50: rgb(0 0 0 / 0.5);
        --raw-color-white: rgb(255 255 255 / 1);
        --raw-color-white-90: rgb(255 255 255 / 0.9);
        --raw-color-white-85: rgb(255 255 255 / 0.85);
        --raw-color-white-80: rgb(255 255 255 / 0.8);
        --raw-color-white-70: rgb(255 255 255 / 0.7);
        --raw-color-white-60: rgb(255 255 255 / 0.6);
        --raw-color-white-50: rgb(255 255 255 / 0.5);
        --raw-size-13: 1.3rem;
        --raw-size-09: 0.9rem;
        --raw-size-08: 0.8rem;
        --raw-size-07: 0.7rem;
        /* Fondations du hub : les seuls jetons que ses feuilles lisent */
        --local-color-identity-ink: #171916;
        --local-color-identity-warning: #7a4a00;
        --local-color-identity-warning-surface: #fff7db;
        --local-color-identity-carbon: #0b0b0d;
        --local-color-identity-projects: #00379e;
        --local-color-identity-design: #be0030;
        --local-color-identity-studies: #00999e;
        --local-color-identity-technical: #5400da;
        --local-color-identity-various: #c96100;
        --local-color-identity-projects-soft: color-mix(in srgb, var(--local-color-identity-projects) 20%, rgb(255 255 255 / 0));
        --local-color-identity-design-soft: color-mix(in srgb, var(--local-color-identity-design) 20%, rgb(255 255 255 / 0));
        --local-color-identity-studies-soft: color-mix(in srgb, var(--local-color-identity-studies) 20%, rgb(255 255 255 / 0));
        --local-color-identity-technical-soft: color-mix(in srgb, var(--local-color-identity-technical) 20%, rgb(255 255 255 / 0));
        --local-color-identity-various-soft: color-mix(in srgb, var(--local-color-identity-various) 20%, rgb(255 255 255 / 0));
        --local-size-section: 1.25rem;
        --local-size-page: 1.75rem;
        --local-weight-emphasis: 650;
        --raw-space-2: 8px;
        --raw-space-3: 12px;
        --raw-space-4: 16px;
        --raw-space-6: 24px;
        --raw-space-8: 32px;
        --raw-space-12: 48px;
        --raw-space-16: 64px;
        --raw-line-1: 1px;
        --raw-radius-1: 6px;
        --local-layout-reading: 72ch;
    }

    :root {
        --local-bleed-reach: 100vmax;
    }

    /* web-fonts.py : faces générées depuis _common/assets/fonts/fonts.yaml — ne pas éditer */
    @font-face {
        font-family: "Inter-italic";
        src: url("/assets/fonts/Inter-Italic-VariableFont_opsz,wght.latin.woff2") format("woff2");
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF, U+2000-206F, U+20AC, U+2122, U+2190-2194, U+2196-2199, U+21D0, U+21D2, U+21D4, U+2212, U+2215, U+2248, U+2260, U+2264-2265, U+25AA, U+25E6, U+27F5-27FA, U+E088, U+E097, U+FEFF, U+FFFD, U+1F850, U+1F852;
    }
    @font-face {
        font-family: "Inter-italic";
        src: url("/assets/fonts/Inter-Italic-VariableFont_opsz,wght.latin-ext.woff2") format("woff2");
        unicode-range: U+0100-0130, U+0132-0151, U+0154-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
    }
    @font-face {
        font-family: "Inter-italic";
        src: url("/assets/fonts/Inter-Italic-VariableFont_opsz,wght.rest.woff2") format("woff2");
        unicode-range: U+02CD, U+02D8-02D9, U+02DB, U+0300-0303, U+0306-0307, U+0309-030A, U+030C, U+030F, U+0313, U+0315, U+031B, U+0323, U+0326-0328, U+032C, U+0337-0338, U+0342-0343, U+0346-036F, U+0400-0479, U+0480-049D, U+04A0-04FF, U+052F, U+0E3F, U+1DC0-1DF5, U+1DFC-1DFF, U+1EA0-1EF1, U+1F00-1F15, U+1F18-1F1D, U+1F20-1F45, U+1F48-1F4D, U+1F50-1F57, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7D, U+1F80-1FB4, U+1FB6-1FC4, U+1FC6-1FD3, U+1FD6-1FDB, U+1FDD-1FEF, U+1FF2-1FF4, U+1FF6-1FFE, U+2070-2071, U+2074-208E, U+2090-209C, U+20DB-20DE, U+20E8, U+20F0, U+2100-2101, U+2103, U+2105-2106, U+2109, U+2116-2117, U+211E-2121, U+2126, U+212A-212B, U+212E, U+2132, U+213B, U+214D, U+2150-217F, U+2183-2186, U+2189, U+2195, U+21A9-21AA, U+21B0-21B1, U+21B3-21B5, U+21BA-21BB, U+21DE-21DF, U+21E4-21E5, U+21E7, U+21EA, U+2202, U+2205-2206, U+220F, U+2211, U+221A, U+221E, U+222B, U+2236, U+2295-2298, U+2303-2305, U+2318, U+2325-2327, U+232B, U+2380, U+2387, U+238B, U+23CE-23CF, U+2423, U+2460-2468, U+24B6-24CF, U+24EA, U+25A0-25A2, U+25B2-25B3, U+25B6-25B7, U+25BA-25BD, U+25C0-25C1, U+25C4-25C7, U+25CA-25CB, U+25CF, U+25EF, U+2600, U+2605-2606, U+263C, U+2661, U+2665, U+26A0, U+2713, U+2717, U+2756, U+2764, U+2780-2788, U+27EF, U+2913, U+2A38, U+2B06, U+2B12-2B13, U+2B1C, U+2B24, U+2DFF, U+2E18, U+A69F, U+A92E, U+E000, U+E002-E02B, U+E04B-E05E, U+E06A-E087, U+E089-E096, U+E098-E0BD, U+E0C8-E0CC, U+E0DC-E0E6, U+E0F3-E0F5, U+E106, U+E109-E10A, U+E10C-E10F, U+E111-E113, U+E117-E118, U+E121-E122, U+E124, U+E12A-E15E, U+E163, U+E1C3, U+E1D2-E1DF, U+E1E1-E274, U+E27B-E2DC, U+EE01-EE07, U+EE09-EE0A, U+EE0C-EE12, U+EE14, U+EE17, U+EE1D-EE45, U+EE47-EE84, U+EE87-EEE1, U+F6C3, U+1F12F-1F149, U+1F16A-1F16B;
    }
    @font-face {
        font-family: "Intertight";
        src: url("/assets/fonts/InterTight-VariableFont_wght.latin.woff2") format("woff2");
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF, U+2000-206F, U+20AC, U+2122, U+2190-2194, U+21D0, U+21D2, U+21D4, U+2212, U+2215, U+2248, U+2260, U+2264-2265, U+25AA, U+25E6, U+27F5-27FA, U+FEFF, U+FFFD, U+1F850, U+1F852;
    }
    @font-face {
        font-family: "Intertight";
        src: url("/assets/fonts/InterTight-VariableFont_wght.latin-ext.woff2") format("woff2");
        unicode-range: U+0100-0130, U+0132-0151, U+0154-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
    }
    @font-face {
        font-family: "Intertight";
        src: url("/assets/fonts/InterTight-VariableFont_wght.rest.woff2") format("woff2");
        unicode-range: U+02CD, U+02D8-02D9, U+02DB, U+0300-0303, U+0305-0307, U+030A-031E, U+0321-0328, U+032A-036F, U+0400-049D, U+04A0-04FF, U+052F, U+0E3F, U+1DC0-1DF5, U+1DFC-1DFF, U+1EA0-1EF1, U+1F00-1F15, U+1F18-1F1D, U+1F20-1F45, U+1F48-1F4D, U+1F50-1F57, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7D, U+1F80-1FB4, U+1FB6-1FC4, U+1FC6-1FD3, U+1FD6-1FDB, U+1FDD-1FEF, U+1FF2-1FF4, U+1FF6-1FFE, U+2070-2071, U+2074-208E, U+2090-209C, U+20DB-20DE, U+20E8, U+20F0, U+2100-2101, U+2103, U+2105-2106, U+2109, U+2116-2117, U+211E-2121, U+2123, U+2126, U+212A-212B, U+212E, U+2132, U+213B, U+214D, U+214F, U+2153, U+215A-2188, U+2195-2199, U+21A9-21AA, U+21B0-21B1, U+21B3-21B5, U+21BA-21BB, U+21DE-21DF, U+21E4-21E5, U+21E7, U+21EA, U+2202, U+2205-2206, U+220F, U+2211, U+221A, U+221E, U+222B, U+2303, U+2305, U+2318, U+2325-2327, U+232B, U+2380, U+2387, U+238B, U+23CE-23CF, U+2423, U+2460-2468, U+24B6-24CF, U+24EA, U+25A0-25A2, U+25B2-25B3, U+25B6-25B7, U+25BA-25BD, U+25C0-25C1, U+25C4-25C7, U+25CA-25CB, U+25CF, U+25EF, U+2600, U+2605-2606, U+263C, U+2661, U+2665, U+26A0, U+2713, U+2717, U+2756, U+2764, U+2780-2788, U+27EF, U+2B06, U+2B12-2B13, U+2B1C, U+2DFF, U+2E18, U+A69F, U+A92E, U+E000, U+E002-E080, U+E093-E096, U+E0A5-E0E6, U+E0F3-E11C, U+E11E-E164, U+EE01-EE05, U+F6C3, U+FE20-FE2D, U+1F12F-1F149, U+1F16A-1F16B;
    }
    @font-face {
        font-family: "Intertight-italic";
        src: url("/assets/fonts/InterTight-Italic-VariableFont_wght.latin.woff2") format("woff2");
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF, U+2000-206F, U+20AC, U+2122, U+2190-2194, U+21D0, U+21D2, U+21D4, U+2212, U+2215, U+2248, U+2260, U+2264-2265, U+25AA, U+25E6, U+27F5-27FA, U+FEFF, U+FFFD, U+1F850, U+1F852;
    }
    @font-face {
        font-family: "Intertight-italic";
        src: url("/assets/fonts/InterTight-Italic-VariableFont_wght.latin-ext.woff2") format("woff2");
        unicode-range: U+0100-0130, U+0132-0151, U+0154-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
    }
    @font-face {
        font-family: "Intertight-italic";
        src: url("/assets/fonts/InterTight-Italic-VariableFont_wght.rest.woff2") format("woff2");
        unicode-range: U+02CD, U+02D8-02D9, U+02DB, U+0300-0303, U+0305-0307, U+030A-031E, U+0321-0328, U+032A-036F, U+0400-049D, U+04A0-04FF, U+052F, U+0E3F, U+1DC0-1DF5, U+1DFC-1DFF, U+1EA0-1EF1, U+1F00-1F15, U+1F18-1F1D, U+1F20-1F45, U+1F48-1F4D, U+1F50-1F57, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7D, U+1F80-1FB4, U+1FB6-1FC4, U+1FC6-1FD3, U+1FD6-1FDB, U+1FDD-1FEF, U+1FF2-1FF4, U+1FF6-1FFE, U+2070-2071, U+2074-208E, U+2090-209C, U+20DB-20DE, U+20E8, U+20F0, U+2100-2101, U+2103, U+2105-2106, U+2109, U+2116-2117, U+211E-2121, U+2123, U+2126, U+212A-212B, U+212E, U+2132, U+213B, U+214D, U+214F, U+2153, U+215A-2188, U+2195-2199, U+21A9-21AA, U+21B0-21B1, U+21B3-21B5, U+21BA-21BB, U+21DE-21DF, U+21E4-21E5, U+21E7, U+21EA, U+2202, U+2205-2206, U+220F, U+2211, U+221A, U+221E, U+222B, U+2303, U+2305, U+2318, U+2325-2327, U+232B, U+2380, U+2387, U+238B, U+23CE-23CF, U+2423, U+2460-2468, U+24B6-24CF, U+24EA, U+25A0-25A2, U+25B2-25B3, U+25B6-25B7, U+25BA-25BD, U+25C0-25C1, U+25C4-25C7, U+25CA-25CB, U+25CF, U+25EF, U+2600, U+2605-2606, U+263C, U+2661, U+2665, U+26A0, U+2713, U+2717, U+2756, U+2764, U+2780-2788, U+27EF, U+2B06, U+2B12-2B13, U+2B1C, U+2DFF, U+2E18, U+A69F, U+A92E, U+E000, U+E002-E080, U+E093-E096, U+E0A5-E0E6, U+E0F3-E11C, U+E11E-E164, U+EE01-EE05, U+F6C3, U+FE20-FE2D, U+1F12F-1F149, U+1F16A-1F16B;
    }
    /* fin des faces générées */

    @media (max-width: 800px) {
        :root {
            --raw-size-13: 1.3rem;
            --raw-size-09: 0.9rem;
            --raw-size-08: 0.8rem;
            --raw-size-07: 0.7rem;
        }
    }

    @media (max-width: 600px) {
        :root {
            --raw-size-13: 1.28rem;
            --raw-size-09: 0.9rem;
            --raw-size-08: 0.84rem;
            --raw-size-07: 0.75rem;
        }
    }
}

@layer reset {
    * {
        font-family: var(--canon-font-oratio);
        list-style: none;
    }
}

@layer base {
    html, body {
        min-height: 100vh;
        height: 100%;
        margin: 0;
        padding: 0;
    }

    /* BOUTONS GENERAUX UNIQUES */
    button {
        box-sizing: border-box;
    }

    /* =========================
       REBOND ÉLASTIQUE
       Latéral : bloqué par la fondation, overflow-x: clip sur la racine.
       Vertical : le rebond décale le document et découvre ses abords, où ne restent peints que les
       calques fixes et composités. Le pseudo-élément composité de l'en-tête (.u-bleed-top) et du pied
       de page (.u-bleed-bottom) y prolonge son fond, sans peindre la bande elle-même ni créer de
       défilement.
       ========================= */

    /* =========================
       BLUR GLOBAL - DROPDOWN MENU
       ========================= */
    body::before {
        position: fixed;
        inset: 0;
        z-index: 50;
    }

    button {
        outline: none;
    }

    body::before {
        backdrop-filter: blur(0px);
        -webkit-backdrop-filter: blur(0px);
        background: var(--local-color-decor-app-body-surface);
        opacity: 0;
    }

    :root {
        font-weight: 410;
    }

    :any-link {
        color: inherit;
        text-decoration: none;
    }

    body::before {
        content: "";
    }

    nav, ul, li {
        user-select: none;
    }

    button {
        cursor: pointer;
    }

    body::before {
        pointer-events: none;
        transition: opacity 600ms ease, backdrop-filter 200ms ease, -webkit-backdrop-filter 200ms ease;
    }
}

@layer components {
    .header-glass {
        /* Au repos en haut de page, le verre rend un blanc plein : le rebond le prolonge au-dessus. */
        --bleed-color: var(--raw-color-white);
        --header-shine: rgb(255 255 255 / 0.75);
        --header-glass-ink: rgb(0 0 0 / 0.95);
    }

    .band {
        --bleed-color: var(--raw-color-pearl-2);
    }

    @media (prefers-color-scheme: dark) {
        .header-glass {
            --header-shine: rgb(255 255 255 / 0.15);
        }
    }

    .hub-tabs {
        justify-content: safe center;
    }

    /* =========================
       GLOBAL HEADER NAV
       ========================= */
    .header-logo {
        height: 20px;
    }

    .header-glass-filter, .header-glass-frost, .header-glass-shine {
        position: absolute;
        inset: 0;
    }

    .header-glass-filter {
        z-index: 1;
    }

    .header-glass-frost {
        z-index: 2;
    }

    .header-glass-shine {
        z-index: 3;
    }

    .header-glass-content {
        position: relative;
        z-index: 4;
        padding: 7px 14px 7px 14px;
    }

    .header-menu {
        max-height: 50px;
        width: 100%;
        height: auto;
        box-sizing: border-box;
        margin: 0;
        padding: 10px;
        display: flex;
        flex-wrap: nowrap;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 24px;
    }

    .header-menu-content {
        display: flex;
        box-sizing: border-box;
        min-width: 530px;
        width: 80vw;
        max-width: 1000px;
        height: 54px;
        flex-wrap: nowrap;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 32px;
    }

    .header-menu-start {
        display: flex;
        align-items: center;
        gap: 32px;
    }

    .header-menu-end {
        display: flex;
        align-items: center;
        gap: 32px;
    }

    .header-item {
        position: relative;
        display: inline-block;
        align-items: center;
        align-content: center;
        padding-top: 14px;
        height: 73px;
        width: auto;
    }

    .header-item::before {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 8px;
        height: 2px;
        transform: scaleX(0);
        transform-origin: center;
    }

    .header-item::after {
        overflow: hidden;
        display: block;
    }

    .header-item:hover {
        width: 100%;
    }

    .header-item:hover::before {
        transform: scaleX(1);
    }

    .header-item[aria-expanded="true"]::before {
        transform: scaleX(1);
    }

    /*=========================
       MOBILE MENU - Burger
       =========================*/
    .header-mobile {
        display: none;
        align-items: center;
        gap: 16px;
        margin-left: auto;
    }

    .header-mobile-search {
        display: none;
        width: 20px;
        height: 20px;
    }

    /* Burger Button */
    .header-burger {
        display: none;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 44px;
        height: 44px;
        padding: 0;
        gap: 6px;
        z-index: 1001;
    }

    .header-burger-line {
        display: block;
        width: 22px;
        height: 2px;
        transform-origin: center;
    }

    /* Burger animation - open state (cross) */
    .header-burger[aria-expanded="true"] .header-burger-line:first-child {
        transform: translateY(4px) rotate(45deg);
    }

    .header-burger[aria-expanded="true"] .header-burger-line:last-child {
        transform: translateY(-4px) rotate(-45deg);
    }

    /* Mobile Menu Overlay */
    .header-drawer-menu {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 999;
        overflow-y: auto;
        transform: translateY(-100%);
    }

    .header-drawer-menu[data-header-open] {
        transform: translateY(0);
    }

    .header-drawer-menu-content {
        padding: 100px 24px 40px 24px;
        max-width: 600px;
        margin: 0 auto;
    }

    /* Mobile Navigation Accordion */
    .header-drawer-menu-accordion {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    /* Mobile nav accordion open state */

    .header-drawer-menu-panel {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .header-drawer-menu-panel a {
        padding: 12px 0;
    }

    /* Lock body scroll when mobile menu is open */
    body[data-header-drawer-menu] {
        overflow: hidden;
    }

    /*=========================
       MOBILE SEARCH OVERLAY
       =========================*/
    .header-drawer-search {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 999;
        /* Same level as mobile menu */
        overflow-y: auto;
        transform: translateY(-100%);
    }

    .header-drawer-search[data-header-open] {
        transform: translateY(0);
    }

    .header-drawer-search-content {
        padding: 100px 24px 40px 24px;
        /* Top padding for navbar space */
        max-width: 600px;
        margin: 0 auto;
    }

    .header-drawer-search-field {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 12px 0;
        margin-bottom: 20px;
    }

    .header-drawer-search-icon {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
    }

    .header-drawer-search-input {
        flex: 1;
    }

    .header-drawer-search-results {
        padding: 0;
    }

    .header-drawer-search-suggestions {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .header-drawer-search-item {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 16px 0;
    }

    .header-drawer-search-item-icon {
        width: 16px;
        height: 16px;
        flex-shrink: 0;
    }

    .header-drawer-search-item-content {
        flex: 1;
    }

    .header-drawer-search-item-title {
        margin-top: 2px;
    }

    .header-drawer-search-empty {
        padding: 40px 20px;
    }

    .header-drawer-search-help {
        margin-top: 30px;
        padding: 0;
    }

    .header-drawer-search-help h3 {
        margin: 0 0 8px 0;
    }

    .header-drawer-search-help p {
        margin: 0 0 20px 0;
    }

    .header-drawer-search-help h2 {
        margin: 0 0 10px 0;
    }

    .header-drawer-search-tags {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .header-drawer-search-tags a {
        display: inline-block;
        padding: 6px 12px;
    }

    /* Lock body scroll when mobile search is open */
    body[data-header-drawer-search] {
        overflow: hidden;
    }

    /* Hide mobile menu when search is open */
    body[data-header-drawer-search] .header-drawer-menu {
        display: none !important;
    }

    /*=========================
       MOBILE ACCOUNT OVERLAY
       =========================*/
    .header-drawer-session {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 999;
        overflow-y: auto;
        transform: translateY(-100%);
    }

    .header-drawer-session[data-header-open] {
        transform: translateY(0);
    }

    .header-drawer-session-content {
        padding: 100px 24px 40px 24px;
        max-width: 400px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .header-drawer-session-head {
        padding-bottom: 12px;
    }

    .header-drawer-session-title {
        margin: 0;
    }

    .header-drawer-session-status {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 14px 16px;
    }

    .header-drawer-session-benefits {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .header-drawer-session-benefits-title {
        margin: 0;
    }

    .header-drawer-session-benefits-items {
        margin: 0;
        padding-left: 0px;
    }

    .header-drawer-session-benefits-items li {
        margin-bottom: 6px;
    }

    .header-drawer-session-action {
        display: flex;
        justify-content: flex-end;
        padding-top: 10px;
    }

    /* Lock body scroll when mobile account is open */
    body[data-header-drawer-session] {
        overflow: hidden;
    }

    /* Hide other overlays when account is open */
    body[data-header-drawer-session] .header-drawer-menu,
    body[data-header-drawer-session] .header-drawer-search {
        display: none !important;
    }

    .header-mobile-session {
        display: none;
        width: 20px;
        height: 20px;
    }

    /* Dropdown Menu */
    [data-header-group] {
        display: none;
        transform: translateY(6px);
    }

    [data-header-visible] {
        transform: translateY(0);
    }

    .header-dropdown[data-header-open] {
        transform: translateY(0) scale(1);
    }

    .header-dropdown-content {
        display: flex;
        flex-wrap: nowrap;
        flex-direction: row;
        align-items: start;
        gap: calc(20px + 1vw);
        justify-content: start;
        min-width: 530px;
        width: 80vw;
        max-width: 1000px;
        height: auto;
        box-sizing: border-box;
        padding: 0;
        transform: translateY(8px);
    }

    .header-dropdown[data-header-open] .header-dropdown-content {
        transform: translateY(0);
    }

    .header-dropdown[data-header-mode="search"] .header-dropdown-detail,
    .header-dropdown[data-header-mode="search"] .header-dropdown-items {
        display: none;
    }

    .header-dropdown-title {
        margin: 0;
        padding-top: 4px;
        bottom: 0;
        transform: none;
    }

    .header-dropdown .divider {
        margin-block: 2px 7px;
    }

    .header-dropdown-detail {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        margin: 0;
        padding: 0;
        flex-wrap: nowrap;
        width: 30%;
        min-width: 250px;
        max-width: 290px;
    }

    .header-dropdown-detail-text {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        margin: 0;
        padding: 0;
        transform: translateY(6px);
    }

    .header-dropdown-detail-text[data-header-reveal] {
        transform: translateY(0);
    }

    .header-dropdown-items {
        display: flex;
        flex-direction: column;
        margin: 0;
    }

    .header-dropdown-search {
        display: none;
        flex-direction: column;
        gap: 12px;
        width: 100%;
    }

    .header-search, .header-session {
        width: 20px;
        height: 20px;
    }

    .header-dropdown[data-header-mode="search"] .header-dropdown-search {
        display: flex;
    }

    .header-dropdown-search-head {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .header-dropdown-search-icon {
        width: 16px;
        height: 16px;
    }

    .header-dropdown-search-input {
        width: 100%;
        flex: 1;
        padding: 6px 10px;
    }

    .header-dropdown-search-suggestions {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .header-dropdown-search-item {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: start;
        gap: 10px;
        padding: 2px 0px 2px 2px;
    }

    .header-dropdown-search-item-icon {
        width: 14px;
        height: 14px;
        flex-shrink: 0;
    }

    .header-dropdown-search-item-title {
        display: inline-flex;
        align-items: center;
        gap: 8px;
    }

    .header-dropdown-search-empty {
        padding: 12px;
    }

    .header-dropdown-search-help {
        display: flex;
        flex-direction: row;
        align-items: start;
        gap: 1vw;
    }

    .header-dropdown-search-help div {
        display: flex;
        flex-direction: column;
        align-items: start;
        width: 100%;
    }

    .header-dropdown-search-help h2, .header-dropdown-search-help h3 {
        margin: 0;
        padding: 0;
    }

    .header-dropdown-search-help p, .header-dropdown-search-help li {
        margin: 0.8rem 0 0 0;
        padding: 0;
    }

    .header-dropdown-search-help li a {
        display: inline-block;
        margin-bottom: 4px;
        padding: 1px 6px;
    }

    .header-dropdown-item {
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        padding: 3px 12px;
        margin-left: -12px;
    }

    /* =========================
       DROPDOWN ACCOUNT PANEL
       ========================= */
    .header-dropdown-session {
        display: none;
        flex-direction: column;
        gap: 16px;
        width: 80%;
    }

    .header-dropdown[data-header-mode="session"] .header-dropdown-session {
        display: flex;
    }

    .header-dropdown[data-header-mode="session"] .header-dropdown-content > *:not(.header-dropdown-session) {
        display: none !important;
    }

    .header-dropdown-session-head {
        padding-bottom: 8px;
    }

    .header-dropdown-session-title {
        margin: 0;
    }

    .header-dropdown-session-status {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 12px;
    }

    .header-dropdown-session-benefits {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .header-dropdown-session-benefits-title {
        margin: 0;
    }

    .header-dropdown-session-benefits-items {
        margin: 0;
        padding-left: 10px;
    }

    .header-dropdown-session-benefits-items li {
        margin-bottom: 4px;
    }

    .header-dropdown-session-action {
        display: flex;
        justify-content: flex-end;
        padding-top: 8px;
    }

    /* =========================
       BANDE DU PIED
       La page pose le pied canonique dans une bande pleine largeur, qui le peint sur les fonds
       fixes et le prolonge au rebond.
       ========================= */
    .band {
        /* Sous l'en-tête et ses panneaux (1000), au-dessus du contenu de page : le pied et son
           prolongement au rebond ne couvrent jamais un menu ouvert. */
        z-index: 999;
        width: 100%;
        position: relative;
        bottom: 0;
        margin-top: auto;
    }

    .header-glass, .header-dropdown {
        z-index: 1000;
    }

    .header-glass {
        position: relative;
        width: 100%;
        overflow: visible;
    }

    .header-dropdown {
        visibility: hidden;
        display: flex;
        justify-content: center;
        position: absolute;
        left: 14px;
        top: 59px;
        width: calc(100% - 28px);
        height: 0px;
        box-sizing: border-box;
        overflow: hidden;
        padding: 3vh 0 12vh 0;
        transform: translateY(-6px) scale(0.99);
    }

    /*=========================
       MOBILE RESPONSIVE - 800px
       =========================*/
    @media (max-width: 800px) {
        .header-menu-content {
            min-width: unset;
            width: 100%;
            justify-content: flex-start;
            gap: 0;
        }
        .header-menu-start {
            flex: 1;
        }
        /* Hide desktop nav items */
        .header-menu-start > li:not(:first-child) {
            display: none;
        }
        /* Hide desktop search and account icons */
        .header-menu-end > li:not(.header-mobile) {
            display: none;
        }
        /* Show mobile controls */
        .header-mobile {
            display: flex;
        }
        .header-mobile-search {
            display: block;
        }
        .header-mobile-session {
            display: block;
        }
        .header-burger {
            display: flex;
        }
        /* Show mobile menu overlay container */
        .header-drawer-menu {
            display: block;
        }
        /* Show mobile search overlay container */
        .header-drawer-search {
            display: block;
        }
        /* Show mobile account overlay container */
        .header-drawer-session {
            display: block;
        }
        /* Hide dropdown menu on mobile */
        .header-dropdown {
            display: none !important;
        }
        /* Adjust nav-list padding */
        .header-menu {
            padding: 8px 12px;
        }
        .header-glass-content {
            padding: 7px 10px;
        }
    }

    .header-logo {
        opacity: 0.85;
    }

    .header-logo:hover {
        opacity: 0.95;
    }

    .header-glass {
        background: transparent;
        border-bottom: 1px solid var(--raw-color-white-90);
    }

    .header-glass-filter {
        backdrop-filter: blur(4px);
        filter: url(#header-distortion) saturate(120%) brightness(1.15);
    }

    .header-glass-frost {
        background: var(--local-color-decor-app-header-glass-frost-surface);
    }

    .header-glass-shine {
        box-shadow: var(--local-shadow-app-header-glass-shine);
    }

    .header-menu {
        background-color: var(--raw-color-white-70);
        backdrop-filter: blur(13px) saturate(2);
        border-radius: var(--local-radius-app-header-menu);
        border: 1px solid var(--raw-color-white-90);
    }

    /* Désactiver backdrop-filter quand un menu mobile est ouvert pour permettre au burger button d'être visible */
    body[data-header-drawer-menu] .header-menu,
    body[data-header-drawer-search] .header-menu,
    body[data-header-drawer-session] .header-menu {
        backdrop-filter: none;
    }

    .header-menu:hover {
        background-color: var(--raw-color-pearl-1);
    }

    /* Nav reste hover quand le dropdown est ouvert */
    .header-glass-content:has(.header-dropdown[data-header-open]) .header-menu {
        background-color: var(--raw-color-pearl-1);
    }

    .header-item {
        border: 2px solid var(--local-color-decor-app-header-item-line);
    }

    .header-item::before {
        background: var(--local-color-decor-app-header-item-surface);
        opacity: 0.9;
    }

    .header-item::after {
        opacity: 0;
    }

    .header-mobile-search {
        opacity: 0.8;
    }

    .header-mobile-search:hover {
        opacity: 1;
    }

    .header-burger {
        background: transparent;
        border: none;
    }

    .header-burger:hover {
        background: transparent;
        border: none;
    }

    .header-burger-line {
        background-color: var(--local-color-decor-app-header-burger-line-surface);
        border-radius: var(--local-radius-app-header-burger-line);
    }

    .header-drawer-menu {
        background-color: var(--raw-color-pearl-1);
        opacity: 0;
    }

    .header-drawer-menu[data-header-open] {
        opacity: 1;
    }

    .header-drawer-menu-panel a {
        border-bottom: 1px solid var(--local-color-decor-app-link-line);
    }

    .header-drawer-menu-panel a:last-child {
        border-bottom: none;
    }

    .header-drawer-search {
        background-color: var(--raw-color-pearl-1);
        opacity: 0;
    }

    .header-drawer-search[data-header-open] {
        opacity: 1;
    }

    .header-drawer-search-field {
        background-color: transparent;
        border-bottom: 1px solid var(--local-color-decor-app-header-drawer-search-field-line);
    }

    .header-drawer-search-icon {
        opacity: 0.5;
    }

    .header-drawer-search-input {
        border: none;
        background: transparent;
    }

    .header-drawer-search-item {
        border-bottom: 1px solid var(--local-color-decor-app-header-drawer-search-item-line);
    }

    .header-drawer-search-item:active {
        opacity: 0.6;
    }

    .header-drawer-search-item-icon {
        opacity: 0.4;
    }

    .header-drawer-search-tags a {
        background-color: transparent;
        border: 1px solid var(--local-color-decor-app-header-drawer-search-field-line);
        border-radius: var(--local-radius-app-link);
    }

    .header-drawer-search-tags a:hover {
        border-color: var(--raw-color-black-50);
    }

    .header-drawer-session {
        background-color: var(--raw-color-pearl-1);
        opacity: 0;
    }

    .header-drawer-session[data-header-open] {
        opacity: 1;
    }

    .header-drawer-session-head {
        border-bottom: 1px solid var(--local-color-decor-app-header-drawer-session-head-line);
    }

    .header-drawer-session-status {
        background: var(--raw-color-white-70);
        border: 1px solid var(--local-color-decor-app-button-style-neon-hover-line);
        border-radius: var(--local-radius-app-header-drawer-session-status);
    }

    [data-header-group] {
        opacity: 0;
    }

    [data-header-visible] {
        opacity: 1;
    }

    .header-dropdown {
        border: 1px solid var(--raw-color-white-90);
        border-radius: var(--local-radius-app-header-menu);
        background-color: var(--raw-color-pearl-1);
        opacity: 0;
    }

    .header-dropdown[data-header-open] {
        opacity: 1;
    }

    .header-dropdown-content {
        opacity: 0;
    }

    .header-dropdown[data-header-open] .header-dropdown-content {
        opacity: 1;
    }

    .header-dropdown-title {
        opacity: 0.5;
        filter: blur(6px);
    }

    .header-dropdown-title[data-header-visible] {
        opacity: 0.5;
        filter: blur(0px);
    }

    .header-dropdown-detail-text {
        opacity: 1;
    }

    .header-search, .header-session {
        opacity: 1;
    }

    .header-dropdown-search-icon {
        opacity: 0.5;
    }

    .header-dropdown-search-input {
        background: var(--raw-color-pearl-1);
        border: none;
    }

    .header-dropdown-search-item:hover {
        background-color: var(--local-color-decor-app-header-dropdown-search-item-hover-surface);
    }

    .header-dropdown-search-item-icon {
        opacity: 0.6;
    }

    .header-dropdown-search-item-kind {
        opacity: 0.7;
    }

    .header-dropdown-search-empty {
        opacity: 0.7;
    }

    .header-dropdown-search-help li a {
        border: 1px solid var(--local-color-decor-app-link-line-2);
        border-radius: var(--local-radius-app-link-2);
    }

    .header-dropdown-search-help li a:hover {
        border: 1px solid var(--local-color-decor-app-link-hover-line);
    }

    .header-dropdown-item {
        border-radius: var(--local-radius-app-header-dropdown-item);
        filter: blur(6px);
    }

    .header-dropdown-item[data-header-visible] {
        filter: blur(0px);
    }

    .header-dropdown-item:hover {
        background-color: var(--local-color-identity-dark-hover);
    }

    .header-dropdown-session-head {
        border-bottom: 1px solid var(--local-color-decor-app-header-drawer-session-head-line);
    }

    .header-dropdown-session-status {
        background: var(--raw-color-white-70);
        border: 1px solid var(--local-color-decor-app-button-style-neon-hover-line);
        border-radius: var(--local-radius-app-header-dropdown-session-status);
    }

    .band {
        background-color: var(--raw-color-pearl-2);
    }

    body[data-header-dropdown]::before {
        opacity: 1;
        backdrop-filter: blur(13px);
        -webkit-backdrop-filter: blur(13px);
        background-color: var(--local-color-decor-app-body-surface-2);
    }

    .header-menu {
        list-style: none;
    }

    .header-item {
        text-align: center;
        color: var(--header-glass-ink);
        text-shadow: var(--local-shadow-app-header-item);
        text-decoration: none;
        font-weight: 350;
        font-size: var(--canon-size-control);
    }

    .header-item::before {
        content: "";
    }

    .header-item::after {
        content: attr(data-header-text);
        font-weight: 500;
        white-space: nowrap;
    }

    .header-item:hover {
        font-weight: 500;
        color: var(--raw-color-black-85);
    }

    /* Dark mode styles */
    .header-item[aria-expanded="true"] {
        font-weight: 500;
        color: var(--raw-color-black-85);
    }

    .header-drawer-menu-panel a {
        font-size: var(--canon-size-control);
        font-weight: 400;
        color: var(--raw-color-black-70);
        text-decoration: none;
    }

    .header-drawer-menu-panel a:hover {
        color: var(--raw-color-black-90);
    }

    .header-drawer-search-input {
        font-size: var(--canon-size-field);
        font-family: inherit;
        color: var(--raw-color-black-90);
    }

    .header-drawer-search-input::placeholder {
        color: var(--raw-color-black-50);
    }

    .header-drawer-search-item {
        text-decoration: none;
    }

    .header-drawer-search-item-kind {
        font-size: var(--canon-size-fine);
        font-weight: 500;
        color: var(--raw-color-black-50);
        text-transform: uppercase;
        letter-spacing: var(--canon-tracking-capitals);
    }

    .header-drawer-search-item-title {
        font-size: var(--canon-size-body);
        font-weight: 400;
        color: var(--raw-color-black-85);
    }

    .header-drawer-search-empty {
        text-align: center;
        color: var(--raw-color-black-50);
        font-size: var(--canon-size-control);
    }

    .header-drawer-search-help h3 {
        font-size: var(--canon-size-control);
        font-weight: 600;
        color: var(--raw-color-black-85);
    }

    .header-drawer-search-help p {
        font-size: var(--canon-size-note);
        color: var(--raw-color-black-70);
        line-height: var(--canon-leading-body);
    }

    .header-drawer-search-help h2 {
        font-size: var(--canon-size-note);
        font-weight: 600;
        color: var(--raw-color-black-70);
    }

    .header-drawer-search-tags a {
        font-size: var(--canon-size-note);
        color: var(--raw-color-black-70);
        text-decoration: none;
    }

    .header-drawer-search-tags a:hover {
        color: var(--raw-color-black-90);
    }

    .header-drawer-session-title {
        font-size: var(--canon-size-title);
        font-weight: 600;
        color: var(--raw-color-black-85);
    }

    .header-drawer-session-text {
        font-size: var(--canon-size-note);
        color: var(--raw-color-black-70);
        line-height: var(--canon-leading-body);
    }

    .header-drawer-session-benefits-title {
        font-size: var(--canon-size-note);
        font-weight: 500;
        color: var(--raw-color-black-70);
    }

    .header-drawer-session-benefits-items {
        font-size: var(--canon-size-note);
        color: var(--raw-color-black-70);
    }

    .header-dropdown {
        text-decoration: none;
        font-size: var(--canon-size-control);
    }

    .header-dropdown-title {
        font-size: var(--canon-size-note);
        font-weight: 300;
    }

    .header-dropdown-detail {
        text-align: start;
        text-align: left;
    }

    .header-dropdown-detail-text {
        font-size: var(--canon-size-title);
        font-weight: 700;
    }

    .header-dropdown-search-input {
        font-size: var(--canon-size-field);
        font-weight: 400;
    }

    .header-dropdown-search-item {
        font-size: var(--canon-size-title);
        color: var(--raw-color-black-70);
    }

    .header-dropdown-search-item:hover {
        color: var(--raw-color-black);
    }

    .header-dropdown-search-item-title {
        font-weight: 500;
        font-size: var(--canon-size-note);
    }

    .header-dropdown-search-item-kind {
        font-size: var(--canon-size-note);
        white-space: nowrap;
    }

    .header-dropdown-search-empty {
        font-size: var(--canon-size-control);
    }

    .header-dropdown-search-help h2, .header-dropdown-search-help h3 {
        font-weight: 400;
        font-size: var(--canon-size-note);
        color: var(--raw-color-black-50);
    }

    .header-dropdown-search-help p, .header-dropdown-search-help li {
        font-size: var(--canon-size-note);
        font-weight: 400;
    }

    .header-dropdown-search-help p strong {
        font-weight: 600;
    }

    .header-dropdown-search-help li a:hover {
        color: var(--local-color-decor-app-link-hover-ink);
    }

    .header-dropdown-item {
        text-align: center;
    }

    .header-dropdown-item:hover {
        color: var(--raw-color-white-90);
    }

    .header-dropdown-session-title {
        font-size: var(--canon-size-title);
        font-weight: 600;
        color: var(--raw-color-black);
    }

    .header-dropdown-session-text {
        font-size: var(--canon-size-body);
        color: var(--raw-color-black-70);
    }

    .header-dropdown-session-benefits-title {
        font-size: var(--canon-size-note);
        font-weight: 500;
        color: var(--raw-color-black-70);
    }

    .header-dropdown-session-benefits-items {
        font-size: var(--canon-size-note);
        color: var(--raw-color-black-70);
        line-height: var(--canon-leading-body);
    }

    .header-logo {
        user-select: none;
        transition: opacity 220ms ease;
    }

    .header-logo:hover {
        cursor: pointer;
        transition: opacity 220ms ease;
    }

    .header-menu {
        transition: 200ms background-color ease;
    }

    .header-item {
        transition: color 220ms ease, opacity 220ms ease;
    }

    .header-item::before {
        transition: transform 260ms ease;
    }

    .header-mobile-search {
        cursor: pointer;
        transition: opacity 220ms ease;
    }

    .header-burger {
        cursor: pointer;
    }

    .header-burger-line {
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .header-drawer-menu {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .header-drawer-menu-panel a {
        transition: color 0.2s ease;
    }

    .header-drawer-search {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .header-drawer-search-item {
        transition: opacity 0.2s ease;
    }

    .header-drawer-search-tags a {
        transition: border-color 0.2s ease, color 0.2s ease;
    }

    .header-drawer-session {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .header-mobile-session {
        cursor: pointer;
    }

    [data-header-group]:where(:not([data-appear-item="shown"])) {
        transition: opacity 220ms ease, transform 260ms ease;
    }

    .header-dropdown {
        transition: opacity 260ms ease, transform 320ms ease, height 420ms ease;
        pointer-events: none;
        will-change: opacity, transform, height;
    }

    .header-dropdown[data-header-open] {
        pointer-events: auto;
    }

    .header-dropdown[data-header-switching] {
        transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
    }

    .header-dropdown-content {
        transition: opacity 280ms ease, transform 360ms ease;
        transition-delay: 120ms;
    }

    .header-dropdown[data-header-switching] .header-dropdown-content {
        transition-delay: 80ms;
    }

    .header-dropdown[data-header-mode="search"] .header-dropdown-content {
        transition-delay: 120ms;
    }

    .header-dropdown-title {
        transition: opacity 220ms ease, filter 260ms ease;
    }

    .header-dropdown-detail-text {
        transition: transform 380ms ease;
    }

    .header-search, .header-session {
        cursor: pointer;
        transition: opacity 180ms ease;
    }

    .header-dropdown-search-input {
        transition: border-color 180ms ease, box-shadow 180ms ease;
    }

    .header-dropdown-search-item {
        transition: background-color 180ms ease, transform 180ms ease;
    }

    .header-dropdown-search-help li a {
        transition: border-color 120ms ease, color 120ms ease;
    }

    .header-dropdown-search-help li a:hover {
        transition: border-color 180ms ease, color 180ms ease;
    }

    .header-dropdown-item:where(:not([data-appear-item="shown"])) {
        transition: opacity 220ms ease, transform 260ms ease, filter 260ms ease;
    }

    /* À l'ouverture, le flou suit le fondu de l'apparition : les durées, les courbes et le retard restent ceux du canon. */
    :is(.header-dropdown-title, .header-dropdown-item)[data-appear-item="shown"] {
        transition-property: opacity, transform, filter;
    }

    .header-dropdown-item svg {
        transition: inherit;
    }

    .header-dropdown-item:hover {
        transition-duration: 150ms;
    }

    body[data-header-dropdown]::before {
        transition-duration: 600ms;
    }
}

@layer utilities {
    .u-bleed-top {
        --bleed-top: var(--local-bleed-reach);
    }

    .u-bleed-bottom {
        --bleed-bottom: var(--local-bleed-reach);
    }

    .u-invisible {
        visibility: hidden;
    }

    .u-bleed-top, .u-bleed-bottom {
        position: relative;
    }

    .u-bleed-top::before, .u-bleed-bottom::before {
        position: absolute;
        inset: 0;
        z-index: -1;
    }

    .u-bleed-top, .u-bleed-bottom {
        isolation: isolate;
    }

    .u-bleed-top::before, .u-bleed-bottom::before {
        box-shadow: var(--local-shadow-app-bleed-top);
        clip-path: inset(calc(-1 * var(--bleed-top, 0px)) 0 calc(-1 * var(--bleed-bottom, 0px)));
    }

    .u-bleed-top::before, .u-bleed-bottom::before {
        content: '';
    }

    .u-bleed-top::before, .u-bleed-bottom::before {
        pointer-events: none;
        will-change: transform;
    }
}