@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/render-bold/poppins-latin-400.woff2') format('woff2');
}

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('/render-bold/poppins-latin-600.woff2') format('woff2');
}

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('/render-bold/poppins-latin-700.woff2') format('woff2');
}

:root {
    --t-prime: #160405;
    --t-highlight: #fff631;
    --t-spot-deep: #fdfd02;
    --t-base-plane: #190605;
    --t-bg-elevated: #26100b;
    --t-front: #ffffff;
    --t-soft-text: #c2c1c1;
    --t-hairline: #40201a;
    --t-rule-bold: #653128;
    --t-ramp-start: #310e0f;
    --t-blend-b: #47b53b;
    --t-caution: #b91c1c;
    --t-stripe: #200c09;
    --t-ink: #160405;

    --f-heading: 'Poppins', Arial, sans-serif;
    --f-base: 'Poppins', Arial, sans-serif;

    --z-title: 64px;
    --z-display-2: 40px;
    --z-lg-2: 28px;
    --z-md-2: 22px;
    --z-sm-2: 18px;
    --z-xs-2: 16px;
    --z-copy: 17px;
    --z-small: 14px;
    --z-legal: 12px;

    --l-close: 1.1;
    --l-even: 1.5;
    --l-open: 1.75;

    --w-base: 400;
    --w-half: 500;
    --w-bold: 700;

    --e-snug: -0.02em;
    --e-normal: 0;
    --e-wide: 0.04em;

    --s-2xs: 4px;
    --s-xs: 12px;
    --s-sm: 20px;
    --s-md: 36px;
    --s-lg: 56px;
    --s-xl: 84px;
    --s-2xl: 120px;
    --s-3xl: 180px;
    --s-band: 44px;
    --s-step: 52px;

    --r-2xs: 3px;
    --r-xs: 2px;
    --r-sm: 6px;
    --r-md: 8px;
    --r-lg: 14px;
    --r-pill: 9999px;
    --r-dot: 50%;

    --d-2xs: 0 1px 1px rgba(0, 0, 0, 0.04);
    --d-xs: 0 1px 2px rgba(0, 0, 0, 0.05);
    --d-sm: 0 2px 4px rgba(0, 0, 0, 0.08);
    --d-md: 0 4px 10px rgba(0, 0, 0, 0.1);
    --d-lg: 0 8px 20px rgba(0, 0, 0, 0.14);

    --b-light: 1px;
    --b-even: 2px;
    --b-thick: 3px;

    --t-fast: 127ms;
    --t-normal: 250ms;
    --t-calm: 382ms;
    --x-settle: cubic-bezier(0.25, 0.82, 0.3, 0.97);
    --x-start: cubic-bezier(0.39, 0.03, 0.51, 0.95);
    --x-swing: cubic-bezier(0.51, 0.03, 0.39, 0.95);
    --x-spring: cubic-bezier(0.3, 1.1, 0.66, 1);

    --v-max: 1160px;
    --v-column: 1160px;
    --v-slim: 490px;
    --v-edge-wide: 48px;
    --v-padding-tablet: 32px;
    --v-pad-sm: 16px;

    --h-size-desktop: 82px;
    --h-size-mobile: 64px;
}

@media (max-width: 760px) {
    :root {
        --z-title: 36px;
        --z-display-2: 28px;
        --z-lg-2: 22px;
        --z-md-2: 18px;
        --z-sm-2: 16px;
        --z-xs-2: 14px;
        --z-copy: 16px;
        --z-small: 13px;
        --z-legal: 11px;
        --s-band: 34px;
        --v-edge-wide: 16px;
    }
}

@media (min-width: 761px) and (max-width: 1080px) {
    :root {
        --v-edge-wide: 32px;
    }
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    overflow-x: clip;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 96px;
}

body {
    background: var(--t-base-plane);
    color: var(--t-front);
    display: flex;
    flex-direction: column;
    font-family: var(--f-base);
    font-size: var(--z-copy);
    font-weight: var(--w-base);
    line-height: var(--l-even);
    margin: 0;
    min-height: 100vh;
    padding-top: var(--h-pad, 82px);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--f-heading);
    line-height: var(--l-close);
    margin: 0;
    overflow-wrap: anywhere;
    text-wrap: balance;
}

p {
    margin: 0;
    overflow-wrap: anywhere;
}

img {
    max-width: 100%;
}

a {
    color: var(--t-highlight);
}

ul,
ol {
    margin: 0;
    padding: 0;
}

table {
    border-collapse: collapse;
    width: 100%;
}

button {
    font: inherit;
}

.skiplane {
    background: var(--t-highlight);
    border-radius: var(--r-sm);
    color: var(--t-ink);
    font-size: var(--z-small);
    font-weight: var(--w-bold);
    left: var(--s-sm);
    padding: 10px 18px;
    position: fixed;
    top: 12px;
    z-index: 200;
}

.skiplane:not(:focus) {
    top: -200px;
}

.hoard {
    display: block;
    flex: 1 0 auto;
}

.hoard:has(> .repere) {
    display: flex;
    flex-direction: column;
}

.voute {
    background: var(--t-prime);
    box-shadow: var(--d-md);
    color: var(--t-front);
    inset-inline: 0;
    position: fixed;
    top: 0;
    transition: height var(--t-normal) var(--x-settle);
    z-index: 100;
}

.voute-deck {
    align-items: center;
    display: flex;
    gap: var(--s-md);
    height: 82px;
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
    position: relative;
    transition: height var(--t-normal) var(--x-settle);
}

.voute.is-shrunk .voute-deck {
    height: 62px;
}

.voute.is-shrunk .voute-crest {
    height: 40px;
}

.voute-sign {
    align-items: center;
    display: inline-flex;
    flex-shrink: 0;
    margin-inline-start: auto;
    order: 4;
    text-decoration: none;
}

.voute-crest {
    display: block;
    flex-shrink: 0;
    height: 48px;
    transition: height var(--t-normal) var(--x-settle);
    width: auto;
}

.voute-flag {
    background: var(--t-caution);
    border-radius: var(--r-sm);
    color: var(--t-front);
    flex-shrink: 0;
    font-size: var(--z-legal);
    font-weight: var(--w-bold);
    letter-spacing: var(--e-wide);
    order: 5;
    padding: 5px 9px;
}

.voute-menu-opener {
    align-items: center;
    background: var(--t-prime);
    border: 0;
    border-radius: var(--r-sm);
    color: var(--t-front);
    cursor: pointer;
    display: none;
    height: 44px;
    justify-content: center;
    order: 1;
    padding: 0;
    width: 44px;
}

.voute-lines {
    background: var(--t-front);
    display: block;
    height: 2px;
    position: relative;
    width: 24px;
}

.voute-lines::before,
.voute-lines::after {
    background: var(--t-front);
    content: '';
    inset-inline: 0;
    height: 2px;
    position: absolute;
}

.voute-lines::before {
    top: -7px;
}

.voute-lines::after {
    top: 7px;
}

.voute-panel {
    background: var(--t-prime);
    border-top: var(--b-light) solid var(--t-hairline);
    box-shadow: var(--d-lg);
    color: var(--t-front);
    inset-inline: 0;
    max-height: 68vh;
    opacity: 0;
    overflow-y: auto;
    padding: var(--s-sm) var(--v-edge-wide);
    pointer-events: none;
    position: absolute;
    top: 100%;
    transform: translateY(-8px);
    transition: opacity var(--t-normal) var(--x-settle), transform var(--t-normal) var(--x-settle), visibility var(--t-normal);
    visibility: hidden;
    z-index: 99;
}

.voute-panel.is-open {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
    visibility: visible;
}

.voute-panel-roll {
    display: flex;
    flex-direction: column;
    gap: var(--s-2xs);
    list-style: none;
}

.voute-leaf {
    list-style: none;
}

.voute-panel .voute-route {
    display: block;
    padding-block: 11px;
}

.voute-routes {
    flex: 0 1 auto;
    order: 2;
}

.voute-index {
    align-items: center;
    display: flex;
    gap: var(--s-md);
    list-style: none;
}

.voute-node,
.voute-nodeRest {
    flex-shrink: 0;
    list-style: none;
    position: relative;
}

.voute-node[hidden],
.voute-nodeRest[hidden] {
    display: none;
}

.voute-node + .voute-node::before {
    color: var(--t-rule-bold);
    content: '/';
    inset-inline-start: calc(var(--s-md) / -2 - 3px);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.voute-nodeOn::after {
    background: var(--t-highlight);
    content: '';
    height: 20px;
    inset-inline-start: -11px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
}

.voute-route {
    color: var(--t-front);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: color var(--t-fast) var(--x-settle);
    white-space: nowrap;
}

.voute-route:hover,
.voute-route:focus-visible {
    color: var(--t-highlight);
}

.voute-nodeOn > .voute-route {
    color: var(--t-highlight);
}

.voute-pack-opener,
.voute-more-opener {
    align-items: center;
    background: var(--t-prime);
    border: 0;
    color: var(--t-front);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--f-base);
    font-size: 14px;
    font-weight: 600;
    gap: 7px;
    min-height: 44px;
    padding: 0;
    white-space: nowrap;
}

.voute-pack-opener:hover,
.voute-more-opener:hover {
    background: var(--t-prime);
    color: var(--t-highlight);
}

.voute-caret {
    border-inline: 4px solid transparent;
    border-top: 5px solid currentColor;
    display: inline-block;
    height: 0;
    transition: transform var(--t-fast) var(--x-settle);
    width: 0;
}

.voute-pack-opener[aria-expanded='true'] .voute-caret,
.voute-more-opener[aria-expanded='true'] .voute-caret {
    transform: rotate(180deg);
}

.voute-pane,
.voute-rest-pane {
    background: var(--t-bg-elevated);
    border: var(--b-light) solid var(--t-hairline);
    border-radius: var(--r-md);
    box-shadow: var(--d-lg);
    color: var(--t-front);
    display: none;
    list-style: none;
    min-width: 196px;
    padding: var(--s-xs);
    pointer-events: none;
    position: absolute;
    top: calc(100% + 10px);
    z-index: 98;
}

.voute-pane {
    inset-inline-start: 0;
}

.voute-rest-pane {
    inset-inline-end: 0;
}

.voute-pane.is-open,
.voute-rest-pane.is-open {
    display: block;
    pointer-events: auto;
}

.voute-pane .voute-route,
.voute-rest-pane .voute-route {
    display: block;
    padding: 9px 10px;
}

.vitrail {
    display: block;
}

.vitrail-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-block: 72px 48px;
    padding-inline: var(--v-edge-wide);
}

.vitrail-text {
    text-align: center;
}

.vitrail-eyebrow {
    color: var(--t-highlight);
    display: block;
    font-size: var(--z-small);
    font-style: italic;
    letter-spacing: var(--e-wide);
    margin-bottom: var(--s-sm);
}

.vitrail-hdr {
    font-size: clamp(30px, 5.4vw, var(--z-title));
    font-weight: var(--w-bold);
    letter-spacing: var(--e-snug);
}

.vitrail-lead {
    color: var(--t-soft-text);
    font-size: var(--z-sm-2);
    font-style: italic;
    line-height: var(--l-even);
    margin-block: var(--s-sm) 0;
    margin-inline: auto;
    max-width: var(--v-column);
}

.vitrail-info {
    color: var(--t-soft-text);
    display: flex;
    flex-wrap: wrap;
    font-size: var(--z-legal);
    gap: 9px;
    justify-content: center;
    letter-spacing: var(--e-wide);
    margin-top: var(--s-sm);
    text-transform: uppercase;
}

.vitrail-who,
.vitrail-span,
.vitrail-dot {
    color: var(--t-soft-text);
}

.vitrail-figure {
    margin: var(--s-md) 0 0;
}

.vitrail-art {
    aspect-ratio: 21 / 9;
    border-radius: var(--r-lg);
    display: block;
    height: auto;
    object-fit: cover;
    width: 100%;
}

.vitrail-caption {
    color: var(--t-soft-text);
    font-size: var(--z-legal);
    font-style: italic;
    padding-top: var(--s-xs);
    text-align: center;
}

.arche {
    border-bottom: var(--b-light) solid var(--t-hairline);
    display: block;
    padding-block: var(--s-band);
}

.arche-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
}

.arche-crumbs {
    align-items: center;
    color: var(--t-soft-text);
    display: flex;
    font-size: var(--z-legal);
    gap: 8px;
    letter-spacing: var(--e-wide);
    margin-bottom: var(--s-sm);
    text-transform: uppercase;
}

.arche-route {
    color: var(--t-soft-text);
    text-decoration: none;
}

.arche-route:hover {
    color: var(--t-highlight);
}

.arche-gt,
.arche-here {
    color: var(--t-soft-text);
}

.arche-hdr {
    font-size: clamp(28px, 4.6vw, 52px);
    font-weight: var(--w-bold);
    letter-spacing: var(--e-snug);
}

.galerie {
    display: block;
    padding-block: var(--s-band);
}

.galerie-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
}

.galerie-part {
    padding-block: 0 var(--s-sm);
}

.galerie-hdr {
    font-size: clamp(24px, 3vw, 32px);
    font-weight: var(--w-bold);
    letter-spacing: var(--e-snug);
    margin-block-start: var(--s-md);
    padding-bottom: var(--s-xs);
}

.galerie-part:first-child .galerie-hdr,
.galerie-figureWide + .galerie-part .galerie-hdr {
    margin-block-start: 0;
}

.galerie-sub {
    font-size: var(--z-md-2);
    font-weight: 600;
    margin-block-start: var(--s-sm);
}

.galerie-text {
    line-height: var(--l-open);
    margin-block-start: 26px;
}

.galerie-part .galerie-text:nth-of-type(2) {
    margin-inline-start: var(--s-step);
}

.galerie-part .galerie-text:nth-of-type(3) {
    margin-inline-start: calc(var(--s-step) * 2);
}

.galerie-part .galerie-text:nth-of-type(n + 4) {
    margin-inline-start: calc(var(--s-step) * 3);
}

.galerie-roll {
    display: flex;
    flex-direction: column;
    gap: var(--s-xs);
    list-style: none;
    margin-block-start: 26px;
}

.galerie-leaf {
    border-inline-start: var(--b-thick) solid var(--t-rule-bold);
    line-height: var(--l-open);
    list-style: none;
    padding-inline-start: var(--s-sm);
}

.galerie-text a,
.galerie-leaf a,
.poteau-text a,
.cour-text a {
    background-image: linear-gradient(var(--t-highlight), var(--t-highlight));
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 0 2px;
    color: var(--t-highlight);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: background-size var(--t-fast) var(--x-settle);
}

.galerie-text a:hover,
.galerie-leaf a:hover,
.poteau-text a:hover,
.cour-text a:hover {
    background-size: 100% 2px;
    color: var(--t-spot-deep);
    text-decoration: none;
}

.galerie-figure {
    margin: var(--s-md) 0 0;
}

.galerie-figureWide {
    margin-block: 0 var(--s-md);
}

.galerie-art {
    border-radius: var(--r-md);
    display: block;
    height: auto;
    margin-inline: auto;
    max-height: 46vh;
    max-width: 100%;
    object-fit: contain;
    width: auto;
}

.galerie-caption {
    color: var(--t-soft-text);
    font-size: var(--z-legal);
    font-style: italic;
    padding-top: var(--s-xs);
}

.galerie-push,
.chevet-shell {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-sm);
    margin-block: var(--s-md);
}

.galerie-fine,
.atrium-fine,
.chevet-second {
    color: var(--t-soft-text);
    font-size: var(--z-legal);
    letter-spacing: var(--e-wide);
}

.placard {
    display: block;
    padding-block: var(--s-band);
}

.placard-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
}

.placard-hdr,
.cahier-hdr,
.grille-hdr,
.cour-hdr {
    font-size: clamp(24px, 3.2vw, var(--z-display-2));
    font-weight: var(--w-bold);
    letter-spacing: var(--e-snug);
    margin-block-end: var(--s-md);
}

.placard-grid {
    display: grid;
    gap: var(--s-sm);
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.placard-one {
    background: var(--t-bg-elevated);
    border: var(--b-light) solid var(--t-hairline);
    border-radius: var(--r-md);
    color: var(--t-front);
    padding: var(--s-sm);
    transition: border-color var(--t-normal) var(--x-settle);
}

.placard-one:hover {
    background: var(--t-bg-elevated);
    border-color: var(--t-highlight);
    color: var(--t-front);
}

.placard-art {
    display: block;
    fill: var(--t-highlight);
    height: 30px;
    width: 30px;
}

.placard-one-hdr {
    font-size: var(--z-sm-2);
    font-weight: 600;
    margin-block-start: var(--s-xs);
}

.placard-text {
    color: var(--t-soft-text);
    font-size: var(--z-small);
    line-height: var(--l-open);
    margin-block-start: var(--s-xs);
}

.cahier {
    display: block;
    padding-block: var(--s-band);
}

.cahier-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
}

.cahier-frame {
    background: var(--t-bg-elevated);
    border: var(--b-light) solid var(--t-hairline);
    border-radius: var(--r-md);
    overflow: hidden;
    overflow-x: auto;
}

.cahier-sheet {
    background: var(--t-bg-elevated);
    color: var(--t-front);
    min-width: 520px;
}

.cahier-sheet th[scope='col'] {
    background: var(--t-prime);
    color: var(--t-highlight);
    font-family: var(--f-base);
    font-size: var(--z-xs-2);
    font-weight: var(--w-half);
    letter-spacing: var(--e-wide);
    padding: var(--s-xs) var(--s-sm);
    text-align: start;
    text-transform: uppercase;
}

.cahier-sheet td,
.cahier-rank {
    background: var(--t-bg-elevated);
    color: var(--t-soft-text);
    font-size: var(--z-small);
    padding: var(--s-xs) var(--s-sm);
    text-align: start;
}

.cahier-rank {
    color: var(--t-front);
    font-weight: var(--w-half);
}

.cahier-sheet tbody tr:nth-child(even) td,
.cahier-sheet tbody tr:nth-child(even) .cahier-rank {
    background: var(--t-stripe);
}

.cahier-sheet tbody tr:hover td,
.cahier-sheet tbody tr:hover .cahier-rank {
    background: var(--t-ramp-start);
    color: var(--t-front);
    transition: background var(--t-fast) var(--x-settle);
}

.grille {
    display: block;
    padding-block: var(--s-band);
}

.grille-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
}

.grille-stack {
    display: grid;
    gap: var(--s-sm);
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grille-one {
    background: var(--t-bg-elevated);
    border: var(--b-light) solid var(--t-hairline);
    border-radius: var(--r-md);
    color: var(--t-front);
    display: flex;
    flex-direction: column;
    gap: var(--s-xs);
    justify-content: space-between;
    padding: var(--s-sm);
    transition: border-color var(--t-normal) var(--x-settle);
}

.grille-one:hover {
    background: var(--t-bg-elevated);
    border-color: var(--t-highlight);
    color: var(--t-front);
}

.grille-quote {
    margin: 0;
}

.grille-text {
    color: var(--t-soft-text);
    font-size: var(--z-copy);
    line-height: var(--l-open);
}

.grille-rank {
    align-items: baseline;
    border-top: var(--b-light) solid var(--t-hairline);
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-2xs) var(--s-xs);
    justify-content: space-between;
    padding-top: var(--s-xs);
}

.grille-voice {
    color: var(--t-front);
    font-size: var(--z-copy);
    font-weight: var(--w-bold);
}

.grille-stars {
    color: var(--t-highlight);
    font-size: var(--z-copy);
    letter-spacing: 1px;
}

.grille-score {
    color: var(--t-soft-text);
    font-size: var(--z-small);
    letter-spacing: var(--e-normal);
}

.cour {
    display: block;
    padding-block: var(--s-band);
}

.cour-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
}

.cour-roll {
    display: block;
}

.cour-one {
    border-bottom: var(--b-light) solid var(--t-hairline);
    padding-block: var(--s-sm);
}

.cour-ask {
    align-items: center;
    cursor: pointer;
    display: grid;
    gap: var(--s-sm);
    grid-template-columns: minmax(0, 1fr) auto;
    list-style: none;
}

.cour-ask::-webkit-details-marker {
    display: none;
}

.cour-ask-hdr {
    font-size: clamp(19px, 2.2vw, var(--z-md-2));
    font-weight: var(--w-bold);
}

.cour-mark {
    border-inline: 5px solid transparent;
    border-top: 7px solid var(--t-highlight);
    height: 0;
    transition: transform var(--t-normal) var(--x-swing);
    width: 0;
}

.cour-one[open] .cour-mark {
    transform: rotate(180deg);
}

.cour-fill {
    display: grid;
    grid-template-rows: 0fr;
    overflow: hidden;
    transition: grid-template-rows var(--t-normal) var(--x-swing);
}

.cour-one[open] .cour-fill {
    grid-template-rows: 1fr;
}

.cour-text {
    line-height: var(--l-open);
    min-height: 0;
    padding-top: var(--s-xs);
}

.atrium {
    display: block;
    padding-block: var(--s-band);
}

.atrium-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
}

.atrium-tile {
    background: var(--t-base-plane);
    border: var(--b-even) solid var(--t-highlight);
    border-radius: var(--r-lg);
    color: var(--t-front);
    display: flex;
    flex-direction: column;
    gap: var(--s-xs);
    padding: var(--s-md);
    text-align: center;
}

.atrium-numeral {
    color: var(--t-highlight);
    font-family: var(--f-heading);
    font-size: clamp(34px, 6vw, var(--z-title));
    font-weight: var(--w-bold);
    letter-spacing: var(--e-snug);
    line-height: var(--l-close);
}

.atrium-hdr {
    font-size: clamp(23px, 3vw, 34px);
    font-weight: var(--w-bold);
}

.atrium-text {
    color: var(--t-soft-text);
    line-height: var(--l-open);
    margin-inline: auto;
}

.atrium-offer,
.chevet-offer,
.galerie-offer {
    align-self: center;
    text-decoration: none;
}

.galerie-offer {
    align-self: auto;
}

.chevet {
    display: block;
    padding-block: var(--s-band);
}

.chevet-body {
    align-items: center;
    background: var(--t-bg-elevated);
    border-inline-start: var(--b-thick) solid var(--t-highlight);
    border-radius: var(--r-md);
    color: var(--t-front);
    display: flex;
    gap: var(--s-md);
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding: var(--s-sm) var(--v-edge-wide);
}

.chevet-strip {
    flex: 1;
}

.chevet-hdr {
    font-size: var(--z-md-2);
    font-weight: 600;
}

.chevet-second {
    display: block;
    margin-top: var(--s-2xs);
}

.chevet-offer {
    flex-shrink: 0;
}

.classeur {
    display: block;
    padding-block: var(--s-band);
}

.classeur-tile {
    background: var(--t-bg-elevated);
    border: var(--b-light) solid var(--t-hairline);
    border-radius: var(--r-md);
    color: var(--t-front);
    display: flex;
    gap: var(--s-sm);
    margin-inline: auto;
    max-width: calc(var(--v-slim) + var(--s-lg));
    padding: var(--s-sm);
}

.classeur-frame {
    background: var(--t-prime);
    border-radius: var(--r-dot);
    display: block;
    flex-shrink: 0;
    height: 56px;
    overflow: hidden;
    position: relative;
    width: 56px;
}

.classeur-mug {
    filter: brightness(1.34) contrast(1.05);
    height: 128px;
    inset-block-start: 7px;
    inset-inline-start: -14px;
    max-width: none;
    object-fit: cover;
    position: absolute;
    width: 128px;
}

.classeur-fill {
    display: flex;
    flex-direction: column;
    gap: var(--s-2xs);
}

.classeur-job {
    color: var(--t-highlight);
    font-size: var(--z-legal);
    letter-spacing: var(--e-wide);
    text-transform: uppercase;
}

.classeur-who {
    font-family: var(--f-heading);
    font-size: var(--z-copy);
    font-weight: var(--w-bold);
}

.classeur-note {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    color: var(--t-soft-text);
    display: -webkit-box;
    font-size: var(--z-small);
    line-height: var(--l-even);
    overflow: hidden;
}

.tablette {
    display: block;
    padding-block: var(--s-band);
}

.tablette-body {
    align-items: center;
    border-top: var(--b-light) solid var(--t-hairline);
    display: flex;
    gap: var(--s-md);
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-block: var(--s-sm);
    padding-inline: var(--v-edge-wide);
}

.tablette-text {
    color: var(--t-soft-text);
    flex: 1;
    font-size: var(--z-small);
    font-style: italic;
}

.tablette-said,
.tablette-dash,
.tablette-job {
    color: var(--t-soft-text);
}

.tablette-who {
    color: var(--t-highlight);
    font-style: normal;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.tablette-who:hover {
    color: var(--t-spot-deep);
    text-decoration-thickness: 2px;
}

.tablette-frame {
    background: var(--t-prime);
    border-radius: var(--r-dot);
    display: block;
    flex-shrink: 0;
    height: 44px;
    overflow: hidden;
    position: relative;
    width: 44px;
}

.tablette-mug {
    filter: brightness(1.34) contrast(1.05);
    height: 100px;
    inset-block-start: 6px;
    inset-inline-start: -11px;
    max-width: none;
    object-fit: cover;
    position: absolute;
    width: 100px;
}

.poteau {
    display: block;
    padding-block: var(--s-band);
}

.poteau-body {
    display: grid;
    gap: var(--s-md);
    grid-template-columns: 240px minmax(0, 1fr);
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
}

.poteau-toc {
    align-self: start;
    background: var(--t-bg-elevated);
    border: var(--b-light) solid var(--t-hairline);
    border-radius: var(--r-md);
    color: var(--t-front);
    padding: var(--s-sm);
    position: sticky;
    top: 118px;
}

.poteau-toc-hdr {
    color: var(--t-highlight);
    display: block;
    font-family: var(--f-heading);
    font-size: var(--z-legal);
    font-weight: var(--w-bold);
    letter-spacing: var(--e-wide);
    margin-bottom: var(--s-xs);
    text-transform: uppercase;
}

.poteau-roll {
    display: flex;
    flex-direction: column;
    font-size: var(--z-small);
    gap: 9px;
    list-style: none;
    counter-reset: toc;
}

.poteau-leaf {
    line-height: var(--l-even);
    list-style: none;
}

.poteau-route {
    color: var(--t-soft-text);
    text-decoration: none;
}

.poteau-route:hover {
    color: var(--t-highlight);
}

.poteau-fill {
    display: block;
}

.poteau-lead {
    color: var(--t-soft-text);
    font-size: var(--z-sm-2);
    line-height: var(--l-open);
}

.poteau-part {
    padding-block: var(--s-sm) 0;
}

.poteau-hdr {
    font-size: clamp(22px, 2.8vw, 30px);
    font-weight: var(--w-bold);
    margin-block-end: var(--s-xs);
}

.poteau-text {
    line-height: var(--l-open);
    margin-block-start: var(--s-xs);
}

.poteau-helproll {
    display: flex;
    flex-direction: column;
    gap: var(--s-xs);
    list-style: none;
    margin-block-start: var(--s-xs);
}

.poteau-note {
    background: var(--t-bg-elevated);
    border-radius: var(--r-md);
    color: var(--t-soft-text);
    font-size: var(--z-small);
    line-height: var(--l-open);
    margin-block-start: var(--s-md);
    padding: var(--s-sm);
}

.tribune {
    display: block;
    padding-block: var(--s-band);
}

.tribune-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
}

.tribune-frame {
    border: var(--b-even) solid var(--t-highlight);
    border-radius: var(--r-md);
    padding: var(--s-md);
}

.tribune-shape {
    display: flex;
    flex-direction: column;
    gap: var(--s-sm);
}

.tribune-cell {
    display: flex;
    flex-direction: column;
    gap: var(--s-2xs);
}

.tribune-caption {
    color: var(--t-soft-text);
    font-size: var(--z-legal);
    letter-spacing: var(--e-wide);
    text-transform: uppercase;
}

.tribune-input,
.tribune-area {
    background: var(--t-base-plane);
    border: 0;
    border-bottom: var(--b-light) solid var(--t-rule-bold);
    color: var(--t-front);
    font-family: var(--f-base);
    font-size: var(--z-sm-2);
    padding: 10px 2px;
    width: 100%;
}

.tribune-input:focus,
.tribune-area:focus {
    border-bottom-color: var(--t-highlight);
    outline: none;
}

.tribune-area {
    resize: vertical;
}

.tribune-send {
    align-self: flex-start;
    background: var(--t-highlight);
    border: 0;
    border-radius: var(--r-md);
    color: var(--t-ink);
    cursor: pointer;
    font-weight: var(--w-bold);
    letter-spacing: var(--e-wide);
    min-height: 48px;
    padding: 12px var(--s-md);
    text-transform: uppercase;
    transition: transform var(--t-fast) var(--x-spring);
}

.tribune-send:hover {
    background: var(--t-spot-deep);
    color: var(--t-ink);
    transform: scale(1.045);
}

.tribune-note {
    background: var(--t-bg-elevated);
    border-radius: var(--r-md);
    color: var(--t-front);
    line-height: var(--l-even);
    margin-top: var(--s-sm);
    padding: var(--s-sm);
}

.tribune-note.is-hidden {
    display: none;
}

.repere {
    display: block;
    flex: 1 0 auto;
    padding-block: var(--s-band);
}

.repere-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
    text-align: center;
}

.repere-hdr {
    color: var(--t-front);
    font-size: clamp(30px, 6vw, 58px);
    font-weight: var(--w-bold);
    isolation: isolate;
    letter-spacing: var(--e-snug);
    position: relative;
}

.repere-hdr::before,
.repere-hdr::after {
    content: attr(data-text);
    inset: 0;
    opacity: 0.5;
    position: absolute;
    z-index: -1;
}

.repere-hdr::before {
    color: var(--t-highlight);
    transform: translate(2px, -2px);
}

.repere-hdr::after {
    color: var(--t-blend-b);
    transform: translate(-2px, 2px);
}

.repere-text {
    color: var(--t-soft-text);
    line-height: var(--l-open);
    margin-block: var(--s-sm);
    margin-inline: auto;
    max-width: var(--v-slim);
}

.repere-goto {
    background: var(--t-highlight);
    border-radius: var(--r-md);
    color: var(--t-ink);
    display: inline-block;
    font-weight: var(--w-bold);
    letter-spacing: var(--e-wide);
    min-height: 48px;
    padding: 13px var(--s-md);
    text-decoration: none;
    text-transform: uppercase;
    transition: transform var(--t-fast) var(--x-spring);
}

.repere-goto:hover {
    background: var(--t-spot-deep);
    color: var(--t-ink);
    transform: scale(1.045);
}

.salon {
    background: var(--t-prime);
    color: var(--t-front);
    display: block;
    padding-block: 56px var(--s-band);
}

.salon-body {
    margin-inline: auto;
    max-width: calc(var(--v-max) + 2 * var(--v-edge-wide));
    padding-inline: var(--v-edge-wide);
}

.salon-manifesto {
    text-align: center;
}

.salon-statement {
    font-size: clamp(24px, 3.4vw, var(--z-display-2));
    font-weight: var(--w-bold);
    letter-spacing: var(--e-snug);
    margin-inline: auto;
    max-width: var(--v-slim);
}

.salon-goto {
    color: var(--t-highlight);
    display: inline-block;
    font-family: var(--f-heading);
    font-size: var(--z-sm-2);
    letter-spacing: var(--e-wide);
    margin-top: var(--s-sm);
    text-decoration: underline;
    text-transform: uppercase;
    text-underline-offset: 4px;
}

.salon-goto:hover {
    color: var(--t-spot-deep);
}

.salon-rule {
    background: var(--t-hairline);
    height: 1px;
    margin-block: var(--s-md);
}

.salon-info {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-md);
    justify-content: space-between;
}

.salon-sign {
    display: inline-block;
    flex-shrink: 0;
}

.salon-crest {
    display: block;
    height: 44px;
    width: auto;
}

.salon-routes,
.salon-legal {
    display: block;
}

.salon-hdr {
    color: var(--t-highlight);
    display: block;
    font-family: var(--f-heading);
    font-size: var(--z-legal);
    font-weight: var(--w-bold);
    letter-spacing: var(--e-wide);
    margin-bottom: var(--s-xs);
    text-transform: uppercase;
}

.salon-roll,
.salon-lawroll {
    display: flex;
    flex-direction: column;
    gap: 7px;
    list-style: none;
}

.salon-leaf {
    list-style: none;
}

.salon-route {
    color: var(--t-soft-text);
    font-size: var(--z-small);
    text-decoration: none;
}

.salon-route:hover {
    color: var(--t-highlight);
}

.salon-small {
    align-self: flex-end;
    color: var(--t-soft-text);
    font-size: var(--z-legal);
    max-width: 320px;
}

.salon-rg {
    align-items: flex-start;
    border-top: var(--b-light) solid var(--t-hairline);
    display: flex;
    gap: var(--s-xs);
    margin-top: var(--s-md);
    padding-top: var(--s-sm);
}

.salon-flag {
    background: var(--t-caution);
    border-radius: var(--r-sm);
    color: var(--t-front);
    flex-shrink: 0;
    font-size: var(--z-legal);
    font-weight: var(--w-bold);
    letter-spacing: var(--e-wide);
    padding: 5px 9px;
}

.salon-warn {
    background: var(--t-prime);
    color: var(--t-soft-text);
    font-size: var(--z-small);
    line-height: var(--l-even);
}

.salon-lawroute {
    color: var(--t-highlight);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.salon-lawroute:hover {
    color: var(--t-spot-deep);
}

.aile {
    background: var(--t-base-plane);
    border: var(--b-light) solid var(--t-hairline);
    border-inline-start: 4px solid var(--t-highlight);
    border-radius: var(--r-sm);
    bottom: var(--s-sm);
    box-shadow: var(--d-lg);
    color: var(--t-front);
    inset-inline-end: var(--s-sm);
    max-width: 320px;
    padding: var(--s-xs) var(--s-sm) var(--s-sm);
    position: fixed;
    z-index: 90;
}

.aile.is-hidden {
    display: none;
}

.aile-note {
    color: var(--t-soft-text);
    font-size: var(--z-small);
    line-height: var(--l-even);
}

.aile-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-xs);
    margin-top: var(--s-xs);
}

.aile-accept {
    background: var(--t-highlight);
    border: 0;
    border-radius: var(--r-sm);
    color: var(--t-ink);
    cursor: pointer;
    font-size: var(--z-small);
    font-weight: var(--w-bold);
    min-height: 40px;
    padding: 9px var(--s-sm);
}

.aile-accept:hover {
    background: var(--t-spot-deep);
    color: var(--t-ink);
}

.aile-decline {
    align-items: center;
    background: var(--t-base-plane);
    border: var(--b-light) solid var(--t-rule-bold);
    border-radius: var(--r-sm);
    color: var(--t-soft-text);
    cursor: pointer;
    display: inline-flex;
    font-size: var(--z-small);
    min-height: 40px;
    padding: 9px var(--s-sm);
}

.aile-decline:hover {
    background: var(--t-bg-elevated);
    color: var(--t-front);
}

[data-motion] {
    opacity: 0;
    transition: opacity var(--t-calm) var(--x-settle);
}

[data-motion].is-visible {
    opacity: 1;
}

.vitrail-text > *,
.vitrail-figure {
    animation: hoardRise var(--t-calm) var(--x-settle) both;
}

.vitrail-hdr {
    animation-delay: 70ms;
}

.vitrail-lead {
    animation-delay: 140ms;
}

.vitrail-info {
    animation-delay: 190ms;
}

.vitrail-figure {
    animation-delay: 240ms;
}

@keyframes hoardRise {
    from {
        opacity: 0;
        transform: translateY(28px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 1080px) {
    .voute-index {
        gap: var(--s-sm);
    }

    .voute-node + .voute-node::before {
        inset-inline-start: calc(var(--s-sm) / -2 - 3px);
    }
}

@media (max-width: 900px) {
    .voute-menu-opener {
        display: inline-flex;
        margin-inline-end: auto;
    }

    .voute-routes {
        display: none;
    }

    .voute-sign {
        margin-inline-start: 0;
    }

    .voute-deck {
        gap: var(--s-sm);
        height: var(--h-size-mobile);
    }

    .voute-crest {
        height: 40px;
    }

    .voute.is-shrunk .voute-deck {
        height: var(--h-size-mobile);
    }

    .voute.is-shrunk .voute-crest {
        height: 40px;
    }

    .placard-grid,
    .grille-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .poteau-body {
        grid-template-columns: minmax(0, 1fr);
    }

    .poteau-toc {
        position: static;
    }
}

@media (max-width: 760px) {
    .vitrail-body {
        padding-block: var(--s-md) var(--s-sm);
    }

    .vitrail-art {
        aspect-ratio: 4 / 3;
    }

    .placard-grid,
    .grille-stack {
        grid-template-columns: minmax(0, 1fr);
    }

    .placard-one {
        align-items: flex-start;
        display: flex;
        flex-direction: column;
        gap: var(--s-2xs);
    }

    .galerie-part .galerie-text:nth-of-type(2),
    .galerie-part .galerie-text:nth-of-type(3),
    .galerie-part .galerie-text:nth-of-type(n + 4) {
        margin-inline-start: 0;
    }

    .chevet-body {
        align-items: stretch;
        flex-direction: column;
        gap: var(--s-sm);
        padding-inline: var(--s-sm);
    }

    .chevet-offer {
        text-align: center;
        width: 100%;
    }

    .tablette-body {
        gap: var(--s-sm);
    }

    .classeur-tile {
        flex-direction: column;
    }

    .salon-info {
        gap: var(--s-sm);
    }

    .salon-small {
        align-self: flex-start;
        max-width: none;
    }

    .tribune-frame {
        padding: var(--s-sm);
    }
}

@media (max-width: 720px) {
    .aile,
    .aile-note {
        font-size: 13px;
        line-height: 1.35;
    }

    .aile {
        inset-inline: var(--v-pad-sm);
        max-width: none;
        padding: 12px 14px;
    }

    .aile-buttons {
        gap: 8px;
    }

    .aile-accept,
    .aile-decline {
        flex: 1 1 auto;
        font-size: 12px;
        justify-content: center;
        min-height: 38px;
        padding: 8px 14px;
        text-align: center;
    }
}

@media (max-width: 640px) {
    .cahier-sheet {
        min-width: 0;
    }

    .cahier-sheet th[scope='col'],
    .cahier-sheet td,
    .cahier-rank {
        padding: 10px 12px;
    }
}

@media (max-width: 430px) {
    .voute-deck {
        gap: 10px;
    }

    .voute-flag {
        font-size: 10px;
        padding: 4px 6px;
    }

    .voute-crest {
        height: 28px;
    }

    .voute.is-shrunk .voute-crest {
        height: 28px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 1ms !important;
    }

    [data-motion] {
        opacity: 1;
    }

    html {
        scroll-behavior: auto;
    }
}
/* Offer CTA */
.ruop-act{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;
  min-height:50px;padding:0 28px;border:1px solid #160405;border-radius:6px;
  background:#0D9488;color:#160405;text-decoration:none;
  font-size:13px;font-weight:600;letter-spacing:1px;text-transform:uppercase;
  box-shadow:0 5px 15px rgba(0,0,0,.22);transition:background .12s ease,color .12s ease,transform .12s ease,box-shadow .12s ease}
.ruop-act:hover{background:#0F766E;color:#FFFFFF;box-shadow:0 3px 10px rgba(0,0,0,.28);animation:none}
.ruop-act:hover::after{animation:none}
.ruop-act:active{background:#115E59;color:#FFFFFF}
.ruop-act:focus-visible{outline:3px solid #160405;outline-offset:3px}
.ruop-act{animation:breathe_ruop 3.15s linear infinite}
@keyframes breathe_ruop{0%{transform:scale(1);animation-timing-function:cubic-bezier(.25,.8,.35,1)}11.111%{transform:scale(1.09);animation-timing-function:cubic-bezier(.45,.05,.55,.95)}33.333%,100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.ruop-act,.ruop-act::after{animation:none!important;transition:none!important}}

@media (max-width: 507px) {
  .voute-routes,
  .voute-index { display: none !important; }
  .voute-more-opener { display: inline-flex !important; }
}
