@font-face {
font-family: 'Archivo';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('../fonts/archivo-500-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Archivo';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('../fonts/archivo-500-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Archivo';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../fonts/archivo-600-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Archivo';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../fonts/archivo-600-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Archivo';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/archivo-700-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Archivo';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/archivo-700-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'DM Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/dm-mono-400-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'DM Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/dm-mono-400-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'DM Mono';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('../fonts/dm-mono-500-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'DM Mono';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('../fonts/dm-mono-500-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Instrument Sans';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/instrument-sans-400-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Instrument Sans';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/instrument-sans-400-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Instrument Sans';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('../fonts/instrument-sans-500-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Instrument Sans';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('../fonts/instrument-sans-500-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Instrument Sans';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../fonts/instrument-sans-600-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Instrument Sans';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../fonts/instrument-sans-600-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Bricolage Grotesque';
font-style: normal;
font-weight: 300 800;
font-stretch: 75% 100%;
font-display: swap;
src: url('../fonts/bricolage-grotesque-var-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Bricolage Grotesque';
font-style: normal;
font-weight: 300 800;
font-stretch: 75% 100%;
font-display: swap;
src: url('../fonts/bricolage-grotesque-var-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Space Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/space-mono-400-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Space Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/space-mono-400-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Space Mono';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/space-mono-700-latin-ext.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Space Mono';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/space-mono-700-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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {

--ink:      #0A0A0B;   
--ink-lift: #0A0A0B;   

--encre:    #0A0A0B;
--bone:     #EDEAE3;   
--ash:      #9B9BA3;   
--line:     rgba(237, 234, 227, 0.13);



--acier-haut:  #E6E6E4;  
--acier-clair: #FBFBFA;  
--acier:       #F2F2F0;  
--acier-bas:   #DEDEDC;  

--plate:       #131317;  

--laque-haut:  #1F1F25;
--laque-bas:   #101014;


--eclat:       #EDEAE3;   

--eclat-rvb:   237, 234, 227;
--eclat-vif:   #FFFFFF;   
--eclat-voile: rgba(237, 234, 227, 0.15);  
--eclat-lueur: rgba(237, 234, 227, 0.36);  


--rouge: #990000;


--perte: #E2706E;


--gain: #4FC98A;


--pose:      rgba(255, 255, 255, 0.045);
--pose-fort: rgba(255, 255, 255, 0.075);


--f-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
--f-titre:   'Archivo', 'Helvetica Neue', Arial, sans-serif;
--f-body:    'Instrument Sans', 'Helvetica Neue', Arial, sans-serif;
--f-mono:    'DM Mono', ui-monospace, 'SFMono-Regular', monospace;


--k-affiche:  -0.042em;
--k-phare:    -0.034em;
--k-titre:    -0.028em;
--k-bloc:     -0.020em;
--k-sous:     -0.012em;
--k-texte:     0;
--k-etiquette: 0.15em;
--k-serre:     0.10em;
--k-repere:    0.26em;
--k-large:     0.50em;


--i-phare:    1.02;


--rouge-titre: var(--bone);


--tx-1:  clamp(9.5px, 0.86vw, 10.5px);
--tx-2:  clamp(11px, 1.05vw, 13px);
--tx-3:  clamp(12.5px, 1.15vw, 14.5px);
--tx-4:  clamp(14px, 1.35vw, 17px);
--tx-5:  clamp(16px, 1.7vw, 21px);
--tx-6:  clamp(18px, 2.1vw, 26px);
--tx-7:  clamp(21px, 2.6vw, 32px);
--tx-8:  clamp(24px, 3.4vw, 42px);
--tx-9:  clamp(27px, 4.2vw, 52px);
--tx-10: clamp(30px, 5.4vw, 67px);

--gutter: clamp(20px, 4.5vw, 64px);

--marge-g: max(var(--gutter), env(safe-area-inset-left, 0px));
--marge-d: max(var(--gutter), env(safe-area-inset-right, 0px));
--ease:   cubic-bezier(0.22, 1, 0.36, 1);


--r-xs:   6px;    
--r-sm:   10px;   
--r-md:   16px;   
--r-lg:   22px;   
--r-xl:   30px;   
--r-pill: 999px;  


--ombre-1: 0 1px 2px rgba(0, 0, 0, .30);
--ombre-2: 0 6px 20px -8px rgba(0, 0, 0, .55);
--ombre-3: 0 22px 60px -24px rgba(0, 0, 0, .75);
--lueur-haut: inset 0 1px 0 rgba(255, 255, 255, .055);
--ombre-plaque: 0 10px 30px -14px rgba(10, 10, 11, .42);


--e-1: 4px;   --e-2: 8px;   --e-3: 12px;  --e-4: 18px;
--e-5: 26px;  --e-6: 38px;  --e-7: 54px;  --e-8: 76px;


--air-2: clamp(12px, 1.4vw, 15px);
--air-3: clamp(16px, 1.9vw, 20px);
--air-4: clamp(22px, 2.6vw, 28px);
--air-5: clamp(30px, 3.5vw, 38px);
--air-6: clamp(40px, 4.7vw, 52px);
--air-7: clamp(54px, 6.4vw, 70px);


--mesure: 66ch;


}

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

html {
-webkit-text-size-adjust: 100%;
scroll-behavior: smooth;

overflow-anchor: none;

scroll-padding-top: 84px;
}
@media (max-width: 620px) { html { scroll-padding-top: 68px; } }

body {
margin: 0;
background: var(--ink);
color: var(--bone);
font-family: var(--f-body);
font-size: var(--tx-4);
line-height: 1.55;
overflow-x: hidden;
-webkit-font-smoothing: antialiased;

-webkit-tap-highlight-color: transparent;
touch-action: manipulation;
overscroll-behavior-y: none;
}


.wordmark { -webkit-user-select: none; user-select: none; }


body::before {
content: '';
position: fixed;
inset: 0;
pointer-events: none;
z-index: 0;
opacity: 0.28;
background: repeating-linear-gradient(
90deg,
rgba(255, 255, 255, 0.022) 0 1px,
transparent 1px 4px
);
}

img { max-width: 100%; display: block; }

a { color: inherit; text-decoration: none; }


.skip {
position: fixed;
left: -9999px;
top: 0;
background: var(--bone);
color: var(--ink);
padding: 10px 16px;
z-index: 99;
}
.skip:focus { left: 8px; top: 8px; }


.sr {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
border: 0;
}

:focus-visible {
outline: 1px solid var(--bone);
outline-offset: 4px;
}

.bar {
position: fixed;
inset: 0 0 auto 0;
z-index: 40;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
padding: 18px var(--gutter);

background: transparent;
border-bottom: 1px solid transparent;
transition: background 0.5s var(--ease), border-color 0.5s var(--ease),
padding 0.5s var(--ease);
}

.bar.is-stuck {
background: #0A0A0B;
border-bottom-color: var(--line);
padding-top: 13px;
padding-bottom: 13px;
}



.minuteur {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 6px 12px 6px 10px;
border: 1px solid var(--line);
border-radius: 999px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
line-height: 1;
color: var(--ash);
white-space: nowrap;
transition: color 0.4s var(--ease), border-color 0.4s var(--ease),
background 0.4s var(--ease);
}
.minuteur__temps { font-variant-numeric: tabular-nums; }

.minuteur__point {
width: 5px;
height: 5px;
border-radius: 50%;
background: var(--ash);
transition: background 0.4s var(--ease);
animation: veilleuse 2.8s ease-in-out infinite;
}
@keyframes veilleuse {
0%, 100% { opacity: 0.85; }
50%      { opacity: 0.25; }
}

.minuteur.is-alerte {
color: var(--bone);
border-color: rgba(237, 234, 227, 0.42);
background: rgba(237, 234, 227, 0.05);
}
.minuteur.is-alerte .minuteur__point {
background: var(--bone);
animation-duration: 1s;
}
.minuteur.is-fini { opacity: 0.4; }

@media (prefers-reduced-motion: reduce) {
.minuteur__point { animation: none; }
}


@media (max-width: 520px) {
.minuteur { padding: 5px 10px 5px 9px; font-size: var(--tx-1); gap: 6px; letter-spacing: var(--k-texte); }
}


.logo {
display: inline-flex;
gap: 0.5em;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-2);
letter-spacing: var(--k-texte);
line-height: 1;
white-space: nowrap;
}

.logo__a,
.logo__b { transition: color 0.34s var(--ease), opacity 0.34s var(--ease); }
.logo__a { color: var(--bone); opacity: 0.5; }

.logo__b { color: var(--rouge); }

.bar__nav {
display: flex;
gap: 26px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
.bar__nav a { transition: color 0.3s var(--ease); }


.bar.is-stuck .bar__nav { color: var(--bone); }


@media (scripting: none) {
.bar {
background: #0A0A0B;
border-bottom-color: var(--line);
}
}
.bar.is-stuck .bar__nav a:hover,
.bar.is-stuck .bar__nav a:focus-visible {
text-decoration: underline;
text-underline-offset: 4px;
}
.bar__retour { display: inline-flex; align-items: center; gap: 8px; }
.bar__retour svg { transition: transform 0.3s var(--ease); }
.bar__retour:hover svg { transform: translateX(-3px); }
.bar__nav a:hover { color: var(--bone); }

.hero {
position: relative;
z-index: 1;
--leave: 0;
min-height: 100svh;

display: grid;
grid-template-rows: 1fr auto;
padding: clamp(66px, 9vh, 88px) var(--gutter) clamp(16px, 2.8vh, 26px);
overflow: hidden;
}

.hero__scene {
position: relative;
display: grid;
place-items: center;
min-height: 0;
}


.hero__contact {
position: absolute;
left: 50%;
top: 52%;
z-index: 1;
width: min(76vw, 620px);
height: min(52vh, 470px);
transform: translate(-50%, -50%) scale(var(--grow, 1));
pointer-events: none;
opacity: calc(1 - var(--leave));

transition: background 0.34s var(--ease);
background: radial-gradient(50% 50% at 50% 50%,
rgba(0, 0, 0, 0.88) 0%,
rgba(0, 0, 0, 0.62) 46%,
rgba(0, 0, 0, 0.22) 66%,
transparent 76%);
}


.wordmark {
z-index: 0;
opacity: calc(1 - var(--leave));
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -52%);
width: 100%;
text-align: center;
pointer-events: none;
user-select: none;
}
.wordmark__over {
display: block;
font-family: var(--f-mono);
font-size: var(--tx-2);
letter-spacing: var(--k-large);
text-indent: 0.5em;
color: var(--ash);
margin-bottom: clamp(8px, 1.4vw, 18px);
transition: color 0.34s var(--ease);
}

.wordmark__main {
position: relative;
display: inline-block;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 700;

font-size: clamp(38px, 11vw, 152px);
line-height: 0.84;
letter-spacing: -0.02em;
white-space: nowrap;
color: transparent;
background-image:

linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 8%),

linear-gradient(0deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0) 24%),


linear-gradient(177deg,
#F7F7F9 0%,
#C6C6CE 24%,
#7E7E88 54%,
#414149 82%,
#2B2B32 100%);
background-size: 100% 100%;
background-repeat: no-repeat;
-webkit-background-clip: text;
background-clip: text;
}


.wordmark__main::before { content: none; }


.wordmark__main::after {
content: attr(data-mot);
position: absolute;
left: 0;
top: 0;
color: transparent;


background-image: linear-gradient(102deg,
rgba(255, 255, 255, 0)    42.0%,
rgba(255, 255, 255, 0.10) 46.2%,
rgba(255, 255, 255, 0.34) 48.6%,
rgba(255, 255, 255, 1)    50%,
rgba(255, 255, 255, 0.34) 51.4%,
rgba(255, 255, 255, 0.10) 53.8%,
rgba(255, 255, 255, 0)    58.0%);

background-size: 300% 240%;
background-position: 140% 50%;
background-repeat: no-repeat;
-webkit-background-clip: text;
background-clip: text;
animation: eclatMot 7s var(--ease) 1.8s infinite;
}
@keyframes eclatMot {
0%   { background-position: 140% 42%; }
18%  { background-position: -40% 58%; }
100% { background-position: -40% 58%; }
}


.a-cagoule .wordmark__main::after {
animation: none;

background-position: var(--sweep, 50%) var(--montee, 50%);

}
@media (max-width: 900px) {
.wordmark__main::after {
background-image: linear-gradient(102deg,
rgba(255, 255, 255, 0)    26%,
rgba(255, 255, 255, 0.16) 34%,
rgba(255, 255, 255, 0.42) 42%,
rgba(255, 255, 255, 1)    50%,
rgba(255, 255, 255, 0.42) 58%,
rgba(255, 255, 255, 0.16) 66%,
rgba(255, 255, 255, 0)    74%);

background-size: 190% 240%;
}
}


.hero.est-loin .wordmark__main::after { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
.wordmark__main::after { animation: none; }
}


.stage {
opacity: calc(1 - var(--leave) * 0.85);
position: relative;
z-index: 2;
width: min(92vw, 680px);
height: 100%;
max-height: 660px;
}




@media (min-width: 900px) {
.hero {

padding-top: clamp(44px, 5vh, 58px);
}

.hero__foot { padding-top: clamp(6px, 1.2vh, 12px); }
.cue { gap: 8px; }
.cue__track { height: 30px; }

.stage {
width: min(92vw, 880px);


min-height: min(76svh, 780px);
max-height: min(84svh, 860px);
}

.hero__contact {
width: min(76vw, 780px);
height: min(56vh, 560px);
}
}

model-viewer {
width: 100%;
height: 100%;

background-color: transparent;
--poster-color: transparent;
--progress-bar-height: 0px;
outline: none;


}


.loader {
position: absolute;
left: 50%;
bottom: 12%;
width: 132px;
height: 1px;
transform: translateX(-50%);
background: var(--line);
}
.loader.is-done { opacity: 0; transition: opacity 0.5s var(--ease); }
.loader__bar {
display: block;
width: 0%;
height: 100%;
background: var(--bone);
transition: width 0.35s var(--ease);
}



#ar-prompt,
model-viewer::part(default-ar-button){ display: none !important; }


.hero__poster{
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;

pointer-events: none;
}


.hero__foot {
position: relative;
z-index: 3;
display: flex;
justify-content: center;
padding-top: clamp(12px, 2.4vh, 22px);
}
.cue {
display: inline-flex;
flex-direction: column;
align-items: center;
gap: 12px;
text-decoration: none;
}
.cue__label {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-repere);
text-transform: uppercase;
color: var(--ash);
transition: color 0.4s var(--ease);
}
.cue:hover .cue__label { color: var(--bone); }


.cue__track {
position: relative;
display: block;
width: 1px;
height: 42px;
background: linear-gradient(180deg, var(--line), transparent);
overflow: hidden;
}
.cue__track i {
position: absolute;
left: -1px;
width: 3px;
height: 3px;
border-radius: 50%;
background: var(--bone);
animation: fall 2.4s var(--ease) infinite;
}
@keyframes fall {
0%   { top: -4px;  opacity: 0; }
22%  { opacity: 1; }
78%  { opacity: 1; }
100% { top: 42px;  opacity: 0; }
}



.son[hidden] { display: none; }

.son {
position: absolute;
right: 0;
bottom: 0;
display: inline-flex;
align-items: center;
gap: 10px;

min-height: 44px;
padding: 0;
border: 0;
background: none;

color: inherit;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-repere);
text-transform: uppercase;
cursor: pointer;
opacity: 0.65;
transition: opacity 0.4s var(--ease);
}
.son:hover,
.son[aria-pressed="true"] { opacity: 1; }


.son:focus-visible { outline-color: currentColor; opacity: 1; }


.son__onde {
display: flex;
align-items: center;
gap: 3px;
height: 13px;
}
.son__onde i {
display: block;
width: 2px;
height: 100%;
background: currentColor;
transform: scaleY(0.26);
transition: transform 0.4s var(--ease);
}
.son[aria-pressed="true"] .son__onde i {
transform: scaleY(1);
animation: onde 1.15s var(--ease) infinite;
}
.son[aria-pressed="true"] .son__onde i:nth-child(2) { animation-delay: 0.19s; }
.son[aria-pressed="true"] .son__onde i:nth-child(3) { animation-delay: 0.38s; }
@keyframes onde {
0%, 100% { transform: scaleY(0.26); }
50%      { transform: scaleY(1); }
}

.hero.est-loin .son[aria-pressed="true"] .son__onde i {
animation-play-state: paused;
}


.son__mot { line-height: 1; white-space: nowrap; }
@media (max-width: 620px) {
.son__mot { display: none; }
}

.raccord {
position: relative;
--raccord-h: clamp(36px, 3.6vw, 52px);
--raccord-rvb: 10, 10, 11;
}
.hero.raccord { --raccord-h: 26px; }
.hero.raccord,
.vault.raccord,
.page.raccord { --raccord-rvb: 230, 230, 228; }
.plaque.raccord { --raccord-rvb: 10, 10, 11; }
.raccord::before {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: var(--raccord-h);
pointer-events: none;
z-index: -1;
background-image: linear-gradient(180deg,
rgba(var(--raccord-rvb), 0)    0%,
rgba(var(--raccord-rvb), 0.04) 42%,
rgba(var(--raccord-rvb), 0.26) 68%,
rgba(var(--raccord-rvb), 0.72) 88%,
rgba(var(--raccord-rvb), 1)   100%);
}
.raccord + section { margin-top: -1px; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

.raccord--decoupe {
--dec-h: clamp(30px, 3.4vw, 44px);
--ch-h: clamp(20px, 2.2vw, 28px);
--dec-z: -1;
--dec-ombre-c: #000000;
--dec-ombre-a: 0.20;
--ch-noir: inline;
--ch-froid: none;
--ch-eclat: brightness(1.07) saturate(1.03);
}
.plaque.raccord--decoupe,
.page.raccord--decoupe { --ch-eclat: brightness(0.95) contrast(1.12); }
.raccord--decoupe::before {
height: max(0px, calc(var(--raccord-h) - var(--dec-h) / 2));
background-image: linear-gradient(180deg,
rgba(var(--raccord-rvb), 0)    0%,
rgba(var(--raccord-rvb), 0.02) 46%,
rgba(var(--raccord-rvb), 0.09) 72%,
rgba(var(--raccord-rvb), 0.17) 90%,
rgba(var(--raccord-rvb), 0.22) 100%);
}
.decoupe {
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: var(--dec-h);
display: block;
pointer-events: none;
contain: layout paint;
z-index: var(--dec-z);
}
.decoupe::before {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: calc(var(--dec-h) / 2);
background-color: rgb(var(--raccord-rvb));
}
.decoupe::after {
content: '';
position: absolute;
left: 0;
right: 0;
top: 50%;
height: min(16px, 50%);
background-image: linear-gradient(180deg, var(--dec-ombre-c), transparent);
opacity: var(--dec-ombre-a);
}
.decoupe__chaine {
position: absolute;
left: 0;
top: 50%;
width: 100%;
height: var(--ch-h);
transform: translateY(-50%);
display: block;
}
.decoupe__maillons {
will-change: transform;
filter: drop-shadow(0 1.5px 2px rgba(0, 0, 0, 0.42));
}
.decoupe__feux {
will-change: transform;
}
.decoupe--loin .decoupe__feu { animation-play-state: paused; }
.decoupe__photo--noir  { display: var(--ch-noir, inline); }
.decoupe__photo--froid { display: var(--ch-froid, none); }
.decoupe__photo { filter: var(--ch-eclat, none); }
.decoupe__feu {
fill: #FFFFFF;
opacity: 0;
transform-box: fill-box;
transform-origin: center;
animation: decoupeFeu 5s ease-in-out infinite;
}
@keyframes decoupeFeu {
0%, 78%, 100% { opacity: 0; transform: scale(0.3); }
87%           { opacity: 1; transform: scale(1.2); }
94%           { opacity: 0.3; transform: scale(0.6); }
}
.decoupe__feu--metal { animation-name: decoupeFeuMetal; }
@keyframes decoupeFeuMetal {
0%, 82%, 100% { opacity: 0; transform: scale(0.3); }
90%           { opacity: 0.8; transform: scale(1); }
96%           { opacity: 0.2; transform: scale(0.55); }
}
@media (prefers-reduced-motion: reduce) {
.decoupe__feu { animation: none; opacity: 0.4; transform: scale(0.7); }
.decoupe__feu--metal { opacity: 0.22; }
}
.hero.raccord--decoupe { --dec-z: 1; }
.hero.raccord--decoupe .cue { margin-bottom: var(--dec-h); }
.accueil .hero.raccord { --raccord-rvb: 10, 10, 11; }
.hero.raccord--decoupe { --dec-ombre-c: #EDEAE3; --dec-ombre-a: 0.055; }
#clarte.raccord { --raccord-rvb: 230, 230, 228; }

.wrap { max-width: 1160px; margin: 0 auto; }


.plaque {
position: relative;
z-index: 1;

--bone: #101013;
--ash:  #4E4E56;
--line: rgba(10, 10, 11, 0.22);
--ink:  #EDEDEB;

--eclat:       #101013;
--eclat-vif:   #2C2C31;
--eclat-voile: rgba(10, 10, 11, 0.12);
--eclat-lueur: rgba(10, 10, 11, 0.26);

--gain: #0A5730;

--perte: #990000;

--rouge: #990000;

--rouge-titre: var(--rouge);

--plate:      #08080A;
--laque-haut: #0E0E12;
--laque-bas:  #050507;
color: var(--bone);
background-color: var(--acier);
background-image: linear-gradient(180deg,
var(--acier-haut)  0%,
var(--acier-clair) 30%,
var(--acier)       62%,
var(--acier-bas)   86%,
var(--acier-haut)  100%);
background-size: 100% 1100px;
background-repeat: repeat-y;
}

.plaque { --pose: rgba(255, 255, 255, 0.86); --pose-fort: #FFFFFF; }

.plaque .laque, .plaque .panneau {
--pose:      rgba(255, 255, 255, 0.045);
--pose-fort: rgba(255, 255, 255, 0.075);
}

.plaque::after {
content: '';
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
opacity: 0.055;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)'/%3E%3C/svg%3E");
background-size: 200px 200px;
}
.plaque > .wrap { position: relative; z-index: 3; }


.plaque .panneau {
--bone: #EDEAE3;
--ash:  #9B9BA3;
--line: rgba(237, 234, 227, 0.13);
--ink:  var(--encre);

--eclat:       #EDEAE3;
--eclat-vif:   #FFFFFF;
--eclat-voile: rgba(237, 234, 227, 0.15);
--eclat-lueur: rgba(237, 234, 227, 0.36);
--gain: #4FC98A;
--perte: #E2706E;

--rouge: #990000;
color: var(--bone);

box-shadow: 0 22px 46px -28px rgba(0, 0, 0, 0.85);
}




.plaque .doc p,
.plaque .doc li  { color: #45454C; }

.plaque .doc__fin { color: var(--ash); }
.plaque .doc__encart {
border-left-color: rgba(10, 10, 11, 0.32);
background: rgba(10, 10, 11, 0.045);
}

.plaque .cle__ok      { border-color: rgba(10, 10, 11, 0.30); }

.chapter {
display: flex;
align-items: center;
gap: clamp(11px, 1.6vw, 17px);

margin-bottom: clamp(17px, 2.3vw, 28px);


--part: 0;   
--rang: 0;   
}

.chapter--suite { --part: 22; }


.chapter__label {
font-family: var(--f-mono);
font-size: var(--tx-2);
letter-spacing: var(--k-repere);
text-transform: uppercase;
color: var(--bone);
white-space: nowrap;
}





.chapter__rule {
--trait:  var(--line);
--marque: var(--bone);
flex: 1;
height: 1px;
background-image:
linear-gradient(90deg, var(--marque), var(--marque)),
linear-gradient(90deg, var(--trait), transparent);
background-repeat: no-repeat, no-repeat;
background-size: calc(var(--part) * 1%) 100%, 100% 100%;
background-position: calc(var(--rang) * 100% / 3) 0, 0 0;
transform: scaleX(0);
transform-origin: left center;
transition: transform 1.1s var(--ease) 0.15s;
}
.chapter.is-in .chapter__rule { transform: scaleX(1); }



.tete {
margin: 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-9);
line-height: var(--i-phare);
letter-spacing: var(--k-phare);
color: var(--ash);
text-wrap: balance;
}

.tete em {
display: block;
font-style: normal;
color: var(--rouge-titre);
}

.tete--cime { font-size: var(--tx-10); }

.clarte {
position: relative;
z-index: 1;
background: var(--ink);
}
.clarte__titre {
margin-bottom: clamp(14px, 1.8vw, 22px);
max-width: 20ch;
}
.barre {
list-style: none;
margin: clamp(28px, 3.8vw, 48px) 0 0;
padding: 0;
display: grid;
row-gap: clamp(4px, 0.8vw, 10px);
}
.barre__li {
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: var(--tx-8);
line-height: 1.26;
letter-spacing: var(--k-titre);
}
.barre__mot {
position: relative;
display: inline-block;
color: var(--bone);
transition: color 0.45s var(--ease);
transition-delay: calc(var(--n, 0) * 90ms + 300ms);
}
.barre__li.is-in .barre__mot { color: var(--ash); }
.barre__mot::after {
content: '';
position: absolute;
left: -0.06em;
right: -0.06em;
top: 56%;
height: 2px;
border-radius: 2px;
background: var(--rouge);
transform: scaleX(0);
transform-origin: left center;
transition: transform 0.5s var(--ease);
transition-delay: calc(var(--n, 0) * 90ms + 300ms);
}
.barre__li.is-in .barre__mot::after { transform: scaleX(1); }
.passerelle {
display: grid;
justify-items: start;
row-gap: clamp(10px, 1.4vw, 16px);
margin-top: clamp(26px, 3.6vw, 46px);
}
.passerelle__cap {
margin: 0;
display: flex;
align-items: baseline;
gap: 0.9em;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
line-height: 1;
color: var(--ash);
}
.passerelle__cap b {
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-weight: 700;
font-size: clamp(20px, 1.9vw, 26px);
line-height: 0.9;
letter-spacing: 0.02em;
font-variant-numeric: tabular-nums;
color: var(--titre-accent);
}
@supports (-webkit-text-stroke: 1px red) {
.passerelle__cap b {
color: transparent;
-webkit-text-stroke: 1.1px var(--titre-accent);
}
}
.passerelle__ligne {
position: relative;
display: block;
width: 1px;
margin-left: 2px;
height: clamp(44px, 5.6vw, 76px);
background: linear-gradient(180deg, transparent 0%, var(--eclat-lueur) 100%);
}
.passerelle__ligne::after {
content: '';
position: absolute;
left: -3px;
bottom: 0;
width: 7px;
height: 7px;
border-right:  1px solid var(--eclat-lueur);
border-bottom: 1px solid var(--eclat-lueur);
transform: rotate(45deg);
}
.clarte__non {
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-9);
line-height: var(--i-phare);
letter-spacing: var(--k-phare);
margin: 0;
}
.clarte__non  { color: var(--ash); }
.clarte {
--carte-fond:  var(--pose);
--carte-bord:  var(--line);
--carte-ombre: var(--lueur-haut);
--clarte-accent: #DD0000;
}
.clarte__faces {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
gap: clamp(28px, 4vw, 70px);
align-items: start;
margin-top: clamp(8px, 1.2vw, 14px);
}
@media (max-width: 880px) {
.clarte__faces { grid-template-columns: 1fr; gap: clamp(30px, 6vw, 44px); }
}
.clarte__faces .clarte__non { font-size: var(--tx-7); }
.clarte__faces .clarte__non { margin-top: clamp(14px, 2vw, 22px); }
@media (max-width: 700px) {
}
.vrai {
display: grid;
gap: clamp(16px, 2.2vw, 26px);
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
margin-top: clamp(26px, 3.6vw, 46px);
}
@media (prefers-reduced-motion: reduce) {
.barre__mot,
.barre__mot::after { transition: none; }
.barre__mot::after { transform: scaleX(1); }
.barre__mot { color: var(--ash); }
}
@media (scripting: none) {
.barre__mot,
.barre__mot::after { transition: none; transition-delay: 0s; }
.barre__mot::after { transform: scaleX(1); }
.barre__mot { color: var(--ash); }
}

.vault {
position: relative;
z-index: 1;
background: var(--ink);

}

.vault::after {
content: '';
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='v' x='0' y='0' width='100%25' height='100%25' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' seed='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.93 0 0 0 0 0.92 0 0 0 0 0.89 0.030 0 0 0 -0.012'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23v)'/%3E%3C/svg%3E"),
radial-gradient(74% 58% at 21% -4%,
rgba(237, 234, 227, 0.075) 0%,
rgba(237, 234, 227, 0.026) 40%,
rgba(237, 234, 227, 0)     74%),
radial-gradient(96% 70% at 88% 108%,
rgba(0, 0, 0, 0.62) 0%,
rgba(0, 0, 0, 0.26) 46%,
rgba(0, 0, 0, 0)    78%);
background-size: 200px 200px, 100% 100%, 100% 100%;
background-repeat: repeat, no-repeat, no-repeat;
-webkit-mask-image: linear-gradient(180deg, #000 0%, #000 88%, transparent 100%);
mask-image: linear-gradient(180deg, #000 0%, #000 88%, transparent 100%);
}


.vault > .wrap { position: relative; z-index: 3; }









@media (prefers-reduced-motion: reduce) {
}

.foot {
position: relative;
z-index: 1;
background: var(--ink);
border-top: 1px solid var(--line);
padding: clamp(17px, 2.2vh, 26px) var(--gutter);
}
.foot__grid {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 13px 28px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
.foot__nom { color: var(--bone); }
.foot__liens,
.foot__reseaux { display: flex; flex-wrap: wrap; gap: 20px; }
.foot__grid a { transition: color 0.3s var(--ease); }
.foot__grid a:hover { color: var(--bone); }

.page {
position: relative;
z-index: 1;
background: var(--ink);
padding: clamp(84px, 10.5vh, 108px) var(--gutter) clamp(38px, 5.6vh, 64px);
}

.page--tete .page__intro { margin-bottom: 0; }
.page--tete .doc__date   { display: block; margin-bottom: 4px; }


.plaque--corps {
padding: clamp(40px, 5.6vh, 64px) var(--gutter) clamp(40px, 5.6vh, 64px);
}
.plaque--corps .page__intro { margin-bottom: clamp(25px, 3.7vw, 42px); }
.page__titre {
margin: 22px 0 18px;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: var(--tx-9);
line-height: var(--i-phare);
letter-spacing: var(--k-phare);

color: var(--ash);
}

.page__titre em {

display: block;
font-style: normal;
font-variation-settings: 'wdth' 100, 'wght' 700;

color: var(--rouge-titre);
}
.page__intro {
margin: 0 0 clamp(24px, 3.6vw, 46px);
max-width: 52ch;
font-size: var(--tx-4);
line-height: 1.7;
color: var(--ash);
}



.doc { max-width: 760px; }
.doc h2 {
margin: clamp(26px, 3.3vw, 38px) 0 10px;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: var(--tx-5);
letter-spacing: var(--k-bloc);
}
.doc p,
.doc li {
font-size: var(--tx-3);
line-height: 1.75;
color: #B7B7BE;
}
.doc p { margin: 0 0 11px; }
.doc ul { margin: 10px 0 14px; padding-left: 18px; }
.doc li { margin-bottom: 6px; }
.doc strong { color: var(--bone); font-weight: 500; }
.doc a { color: var(--bone); border-bottom: 1px solid var(--line); }
.doc a:hover { border-color: var(--bone); }
.doc__date {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
.doc__encart {
margin: 15px 0;
padding: 15px 17px;
border-left: 1px solid rgba(237, 234, 227, 0.3);
background: rgba(255, 255, 255, 0.022);
}
.doc__encart p:last-child { margin-bottom: 0; }
.doc__fin {
margin-top: clamp(32px, 4.5vw, 52px);
padding-top: 16px;
border-top: 1px solid var(--line);
font-size: var(--tx-2);
line-height: 1.7;
color: #7E7E86;
}


.merci { max-width: 560px; margin: 0 auto; text-align: center; }

.etapes {
margin: clamp(21px, 3.2vw, 34px) 0 0;
padding: 0;
list-style: none;
text-align: left;
}
.etapes { display: grid; gap: clamp(7px, 0.9vw, 10px); }
.etapes li {
display: grid;
grid-template-columns: 34px minmax(0, 1fr);
gap: 12px;
padding: clamp(12px, 1.5vw, 16px) clamp(13px, 1.6vw, 18px);
background: var(--pose);
box-shadow: inset 0 0 0 1px var(--line);
font-size: var(--tx-3);
line-height: 1.6;
color: var(--ash);
}
.etapes b {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
color: var(--bone);
font-weight: 400;
padding-top: 3px;
}
.etapes strong { color: var(--bone); font-weight: 500; }






.perdue {
min-height: 100svh;
display: flex;
flex-direction: column;
}
.perdue .foot { flex: 0 0 auto; }


.perdue .perdu {
position: relative;

flex: 1 1 auto;
min-height: 0;
display: flex;
flex-direction: column;
overflow: hidden;
padding: clamp(74px, 11vh, 104px) var(--gutter) clamp(18px, 3vh, 36px);
text-align: center;
}


.perdu__fond {
position: absolute;

inset: 0 0 auto 0;
height: 72%;
display: grid;
place-items: center;
pointer-events: none;
user-select: none;
opacity: 0.82;

--perdu-taille: min(46vw, 108vh);

-webkit-mask-image: linear-gradient(180deg,
#000 28%, rgba(0, 0, 0, 0.5) 54%, transparent 74%);
mask-image: linear-gradient(180deg,
#000 28%, rgba(0, 0, 0, 0.5) 54%, transparent 74%);
}
.perdu__geant {
grid-area: 1 / 1;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--perdu-taille);
line-height: 0.78;

letter-spacing: var(--k-affiche);
white-space: nowrap;
color: transparent;
background-image:

linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 8%),

linear-gradient(0deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0) 24%),

linear-gradient(177deg,
#F7F7F9 0%,
#C6C6CE 24%,
#7E7E88 54%,
#414149 82%,
#2B2B32 100%);
background-size: 100% 100%;
background-repeat: no-repeat;
-webkit-background-clip: text;
background-clip: text;
transform: scaleX(1.12);
}

.perdu__ovale {
grid-area: 1 / 1;

width:  calc(var(--perdu-taille) * 0.40);
height: calc(var(--perdu-taille) * 0.68);
border-radius: 999px;
background-color: var(--acier);
background-image: linear-gradient(180deg,
var(--acier-haut)  0%,
var(--acier-clair) 30%,
var(--acier)       62%,
var(--acier-bas)   86%,
var(--acier-haut)  100%);
}


.perdu__bas {
position: relative;
z-index: 2;

margin-top: auto;
max-width: 34rem;
margin-left: auto;
margin-right: auto;
}

.perdu__ref {
margin: 0;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-repere);
text-transform: uppercase;
color: var(--ash);
}
.perdu__titre {
margin: clamp(12px, 1.8vh, 20px) 0 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-9);
line-height: 1.04;
letter-spacing: var(--k-phare);
text-wrap: balance;
color: var(--bone);
}
.perdu__titre em {
font-style: normal;
color: var(--rouge-titre);
}
.perdu__intro {
margin: clamp(10px, 1.6vh, 18px) auto 0;
max-width: 46ch;
font-size: var(--tx-3);
line-height: 1.62;
color: var(--ash);
}
.perdu__bas .cle__ok { margin-top: clamp(18px, 3vh, 32px); }


@media (max-height: 620px) {

.perdu__fond { --perdu-taille: min(46vw, 76vh); }
.perdue .perdu { padding-top: clamp(64px, 9vh, 84px); }
}

body.mur {
min-height: 100svh;
display: flex;
flex-direction: column;
--mur-fond-h:  #101013;
--mur-fond-b:  var(--ink);
--mur-accent:  #DD0000;
--mur-carte-h: var(--laque-haut);
--mur-carte-b: var(--laque-bas);
--mur-oeil:    #060607;
background:
radial-gradient(120% 70% at 50% 0%, rgba(255, 255, 255, .025) 0%, transparent 60%),
linear-gradient(180deg, var(--mur-fond-h) 0%, var(--mur-fond-b) 100%);
color: var(--bone);
}
body.mur .foot { flex: 0 0 auto; }
.mur__salle {
flex: 1 1 auto;
min-height: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: clamp(14px, 2.2vh, 22px);
padding: clamp(74px, 10vh, 100px) var(--gutter) clamp(24px, 3.5vh, 40px);
}
.mur__cadre {
position: relative;
overflow: hidden;
width: min(100%, 46rem);
padding: clamp(30px, 4.6vh, 44px) clamp(20px, 4vw, 40px) clamp(26px, 4vh, 38px);
background: linear-gradient(180deg, var(--mur-carte-h) 0%, var(--mur-carte-b) 100%);
border: 1px solid var(--line);
border-radius: var(--r-lg);
box-shadow: var(--lueur-haut), var(--ombre-3);
text-align: center;
}
.mur__trame {
position: absolute;
inset: 0;
pointer-events: none;
background:
radial-gradient(115% 100% at 50% 42%, transparent 55%, rgba(0, 0, 0, .30) 100%),
repeating-linear-gradient(180deg, rgba(255, 255, 255, .024) 0 1px, transparent 1px 3px);
}
.mur__scan {
position: absolute;
inset: 0;
pointer-events: none;
will-change: transform;
animation: murScan 5.2s ease-in-out infinite alternate;
}
.mur__scan::before {
content: "";
position: absolute;
inset: 0 0 auto;
height: 34px;
background:
linear-gradient(180deg, rgba(221, 0, 0, .55) 0, rgba(221, 0, 0, .55) 1px, transparent 1px),
linear-gradient(180deg, rgba(221, 0, 0, .10) 0%, transparent 100%);
}
@keyframes murScan {
from { transform: translateY(2%); }
to   { transform: translateY(94%); }
}
.mur__coin {
position: absolute;
width: 22px;
height: 22px;
pointer-events: none;
border: 0 solid rgba(237, 234, 227, .5);
}
.mur__coin--hg { top: 10px;    left: 10px;   border-top-width: 2px; border-left-width: 2px; }
.mur__coin--hd { top: 10px;    right: 10px;  border-top-width: 2px; border-right-width: 2px; }
.mur__coin--bg { bottom: 10px; left: 10px;   border-bottom-width: 2px; border-left-width: 2px; }
.mur__coin--bd { bottom: 10px; right: 10px;  border-bottom-width: 2px; border-right-width: 2px; }
.mur__hud {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
margin: 0;
font-family: var(--f-mono);
font-size: 10px;
font-weight: 400;
letter-spacing: .14em;
text-transform: uppercase;
color: var(--ash);
white-space: nowrap;
}
.mur__hud--haut { margin-bottom: clamp(18px, 3vh, 28px); }
.mur__hud--bas  { margin-top:    clamp(18px, 3vh, 28px); }
.mur__vivant { display: inline-flex; align-items: center; gap: 7px; }
.mur__vivant i {
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--mur-accent);
animation: murVie 1.6s ease-in-out infinite;
}
@keyframes murVie {
0%, 100% { opacity: 1; }
50%      { opacity: .25; }
}
.mur__centre {
position: relative;
display: grid;
justify-items: center;
gap: clamp(10px, 1.8vh, 16px);
}
.mur__mire {
position: relative;
width: clamp(74px, 11vh, 92px);
aspect-ratio: 1;
display: grid;
place-items: center;
margin-bottom: 2px;
}
.mur__mire::before {
content: "";
position: absolute;
inset: 0;
border: 1px solid rgba(221, 0, 0, .30);
border-radius: 50%;
}
.mur__mire::after {
content: "";
position: absolute;
inset: 0;
background:
linear-gradient(var(--mur-accent), var(--mur-accent)) 50% 0    / 1px 7px no-repeat,
linear-gradient(var(--mur-accent), var(--mur-accent)) 50% 100% / 1px 7px no-repeat,
linear-gradient(var(--mur-accent), var(--mur-accent)) 0    50% / 7px 1px no-repeat,
linear-gradient(var(--mur-accent), var(--mur-accent)) 100% 50% / 7px 1px no-repeat;
opacity: .7;
}
.mur__cagoule { width: 68%; height: auto; display: block; }
.mur__oeil    { fill: var(--mur-oeil); }
.mur__titre {
margin: 0;
font-family: var(--f-display);
font-size: clamp(34px, 6vw, 54px);
font-weight: 700;
line-height: .96;
letter-spacing: .01em;
text-transform: uppercase;
background: linear-gradient(178deg, #FFFFFF 0%, #9C9CA3 46%, #2C2C31 100%);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.mur__etat {
margin: 0;
display: inline-flex;
align-items: center;
gap: 8px;
font-family: var(--f-mono);
font-size: 11px;
font-weight: 500;
letter-spacing: .16em;
text-transform: uppercase;
color: var(--mur-accent);
}
.mur__etat i {
width: 7px;
height: 7px;
border-radius: 50%;
background: currentColor;
animation: murVie 1.6s ease-in-out infinite;
}
.mur__cible {
margin: 2px 0 0;
padding: clamp(10px, 1.8vh, 15px) clamp(20px, 3.4vw, 32px);
background:
linear-gradient(var(--mur-accent), var(--mur-accent)) 0    0    / 15px 2px  no-repeat,
linear-gradient(var(--mur-accent), var(--mur-accent)) 0    0    / 2px  15px no-repeat,
linear-gradient(var(--mur-accent), var(--mur-accent)) 100% 0    / 15px 2px  no-repeat,
linear-gradient(var(--mur-accent), var(--mur-accent)) 100% 0    / 2px  15px no-repeat,
linear-gradient(var(--mur-accent), var(--mur-accent)) 0    100% / 15px 2px  no-repeat,
linear-gradient(var(--mur-accent), var(--mur-accent)) 0    100% / 2px  15px no-repeat,
linear-gradient(var(--mur-accent), var(--mur-accent)) 100% 100% / 15px 2px  no-repeat,
linear-gradient(var(--mur-accent), var(--mur-accent)) 100% 100% / 2px  15px no-repeat;
}
.mur__ip {
font-family: var(--f-mono);
font-size: clamp(17px, 3.2vw, 28px);
font-weight: 500;
letter-spacing: .06em;
color: var(--bone);
overflow-wrap: anywhere;
}
.mur__releve {
margin: 0;
font-family: var(--f-mono);
font-size: 10.5px;
letter-spacing: .1em;
text-transform: uppercase;
color: var(--ash);
line-height: 1.7;
max-width: 30rem;
}
.mur__note {
margin: 0;
max-width: 34rem;
text-align: center;
font-size: 13.5px;
line-height: 1.55;
color: var(--ash);
}
.mur__note b { color: var(--bone); font-weight: 600; }
.mur__tg {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 13px 26px;
border: 1px solid var(--line);
border-radius: var(--r-pill);
background: rgba(255, 255, 255, .04);
font-family: var(--f-mono);
font-size: 11px;
font-weight: 500;
letter-spacing: .12em;
text-transform: uppercase;
color: var(--bone);
text-decoration: none;
transition: border-color .25s var(--ease), background-color .25s var(--ease);
}
.mur__tg:hover { border-color: var(--mur-accent); background: rgba(221, 0, 0, .08); }
.mur__tg svg   { flex: 0 0 auto; }
@media (max-width: 520px) {
.mur__salle        { gap: 14px; padding-top: 72px; }
.mur__cadre        { padding: 26px 16px 22px; border-radius: var(--r-md); }
.mur__coin         { width: 16px; height: 16px; }
.mur__coin--hg,
.mur__coin--hd     { top: 8px; }
.mur__coin--bg,
.mur__coin--bd     { bottom: 8px; }
.mur__coin--hg,
.mur__coin--bg     { left: 8px; }
.mur__coin--hd,
.mur__coin--bd     { right: 8px; }
.mur__hud          { font-size: 8.5px; letter-spacing: .1em; }
.mur__hud--haut    { margin-bottom: 16px; }
.mur__hud--bas     { margin-top: 16px; }
.mur__mire         { width: 66px; }
.mur__titre        { font-size: clamp(30px, 9.6vw, 40px); }
.mur__releve       { font-size: 9.5px; }
.mur__note         { font-size: 13px; padding: 0 4px; }
.mur__tg           { width: 100%; justify-content: center; font-size: 10px;
letter-spacing: .08em; padding: 12px 14px; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
.mur__scan     { animation: none; transform: translateY(30%); }
.mur__vivant i,
.mur__etat i   { animation: none; }
}

.is-loading .wordmark,
.is-loading .stage,
.is-loading .hero__foot,
.is-loading .bar { opacity: 0; }


.hero__foot, .bar { opacity: 1; }


.wordmark, .stage, .hero__foot {
transition: opacity 1s var(--ease), transform 1.2s var(--ease);
}


.bar {
transition: opacity 1s var(--ease) 0.65s,
transform 1.2s var(--ease) 0.65s,
background 0.5s var(--ease),
border-color 0.5s var(--ease),
padding 0.5s var(--ease);
}
.is-loading .wordmark { transform: translate(-50%, -50%); }
.is-loading .stage    { transform: translateY(26px) scale(0.97); }
.stage { transition-delay: 0.15s; }
.hero__foot  { transition-delay: 0.55s; }


@media (scripting: none) {
.reveal        { opacity: 1 !important; transform: none !important; }
.is-loading .wordmark,
.is-loading .stage,
.is-loading .hero__foot,
.is-loading .bar { opacity: 1 !important; transform: none !important; }
}


@keyframes filetHero { to { opacity: 1; transform: none; } }

.is-loading .wordmark,
.is-loading .stage,
.is-loading .hero__foot,
.is-loading .bar { animation: filetHero 0.6s linear 3s forwards; }

@media (prefers-reduced-motion: reduce) {
.is-loading .wordmark,
.is-loading .stage,
.is-loading .hero__foot,
.is-loading .bar { animation-duration: 0.01s; }
}


.reveal {
opacity: 0;
transform: translateY(22px);
transition: opacity 0.9s var(--ease), transform 0.9s var(--ease);
}
.reveal.is-in { opacity: 1; transform: none; }


.interieure .reveal { opacity: 1; transform: translateY(16px); }
.interieure .reveal.is-in { transform: none; }





@media (max-width: 860px) {

}

@media (max-width: 520px) {


}

@media (max-width: 860px) {
.foot__grid { flex-direction: column; align-items: flex-start; gap: 16px; }


}

@media (max-width: 680px) {
.hero { padding-top: 84px; }
.stage { width: 100%; max-height: 56svh; }
.wordmark { transform: translate(-50%, -54%); }
.wordmark__main { font-size: clamp(40px, 17vw, 96px); }
.bar__nav { gap: 16px; }
}



@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
*, *::before, *::after {
animation-duration: 0.001ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.001ms !important;
}
.reveal { opacity: 1; transform: none; }
}

.gain.gain   { color: var(--gain); }
.perte.perte { color: var(--perte); }

@media (max-width: 720px) {


}

@media (max-width: 400px) {
.bar__nav {
gap: 12px;
flex-wrap: wrap;
justify-content: flex-end;
min-width: 0;
}
.bar__retour { font-size: var(--tx-1); gap: 6px; }
.minuteur { padding: 5px 9px 5px 8px; font-size: var(--tx-1); gap: 6px; }

.bar .logo { font-size: var(--tx-1); letter-spacing: var(--k-texte); }
}



.bar__nav a,
.foot__reseaux a,
.foot .wrap nav a,
.foot__liens a,
.doc a {
display: inline-flex;
align-items: center;
min-height: 24px;
}

@media (pointer: coarse) {
.bar__nav a,
.foot__reseaux a,
.foot__liens a { min-height: 44px; }

.mode { min-height: 44px; min-width: 44px; justify-content: center; }
.cle__ok, .presser { min-height: 48px; }


.bar .logo { display: inline-flex; align-items: center; min-height: 44px; }
}
.doc a { display: inline; }

.panneau {
border-radius: var(--r-xl);
}


.laque,
.jalon,
.mise,
.tabl,
.doc__encart,
.pack {
border-radius: var(--r-lg);
}



.etapes li {
border-radius: var(--r-md);
}



.skip { border-radius: var(--r-sm); }


.cue__track,
.chapter__rule,
.loader,
.loader__bar,



.plaque, .page, .vault, .hero, .foot, .bar, .recit, .clarte { border-radius: 0; }


.pack {
box-shadow: var(--lueur-haut), var(--ombre-2);
}

.panneau {
box-shadow: var(--lueur-haut), var(--ombre-3);
}


.plaque .pack {
box-shadow: var(--ombre-plaque);
}





.foot__dom {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
color: var(--ash);
opacity: .7;
}

@media (max-width: 560px) {
.chapter {
flex-wrap: wrap;
row-gap: 12px;
}
.chapter__label {
white-space: normal;
letter-spacing: var(--k-repere);
line-height: 1.5;
}

.chapter__rule { flex: 1 0 120px; }
}



.hero, .recit, .vault, .plaque, .page, .foot, .bar, .clarte {
padding-left: var(--marge-g);
padding-right: var(--marge-d);
}

.mise::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 3px;
background: var(--bone);
}


@media (max-width: 620px) {


.bar { padding-top: 10px; padding-bottom: 10px; }
.bar.is-stuck { padding-top: 8px; padding-bottom: 8px; }





.plaque--corps { padding-top: 22px; padding-bottom: 24px; }
.page { padding-top: 80px; padding-bottom: 30px; }

.foot { padding-top: 16px; padding-bottom: 16px; }


.chapter { margin-bottom: 16px; }
.bloc { margin-top: 28px; }
.etapes { margin-top: 18px; }
.page__intro { margin-bottom: 20px; }
.plaque--corps .page__intro { margin-bottom: 22px; }
.mise { margin-top: 16px; }
.note { margin-top: 11px; }
.doc h2 { margin-top: 20px; }
.duo { gap: 14px; }


.laque        { padding: 15px 15px; }

.jalon        { padding: 14px 14px; }
.etapes li    { padding: 11px 12px; }
.tabl         { padding: 9px 12px; }
.doc__encart  { margin: 12px 0; padding: 13px 15px; }
.panneau      { padding: 18px 16px 20px; }
.mur__cadre { padding: 18px 26px; }
.secret__titre   { margin-bottom: 13px; }
}


@media (max-width: 400px) {
.bar__nav { row-gap: 3px; }
.bar, .bar.is-stuck { padding-top: 6px; padding-bottom: 6px; }
}


@media (max-width: 380px) {
.page { padding-top: 92px; }
}


@media (max-width: 620px) {
.doc p,
.doc li      { line-height: 1.62; }

.page__intro { line-height: 1.6; }
.etapes li   { line-height: 1.5; }
.note        { line-height: 1.55; }


.tabl th,
.tabl td     { padding-top: 8px; padding-bottom: 8px; }
}





.etapes li,
.jalon,
.mise,
.tabl,
.doc__encart {
background: none;
box-shadow: none;
border-radius: 0;
}

.plaque { --eclat-rvb: 10, 10, 11; }
.plaque .laque,
.plaque .panneau,
.plaque .pack { --eclat-rvb: 237, 234, 227; }




@media (min-width: 861px) and (hover: hover) and (pointer: fine) {
.bar.is-stuck {
background: rgba(10, 10, 11, 0.62);
-webkit-backdrop-filter: blur(18px) saturate(160%);
backdrop-filter: blur(18px) saturate(160%);
}
}


.panneau {
box-shadow: var(--lueur-haut), var(--ombre-3),
0 0 100px -24px var(--eclat-lueur);
}


.laque,
.panneau,
.pack {
background-image: linear-gradient(178deg,
rgba(var(--eclat-rvb), 0.055) 0%,
rgba(var(--eclat-rvb), 0.014) 24%,
rgba(var(--eclat-rvb), 0) 56%);
}


@media (hover: hover) and (pointer: fine) {
.pack:hover,
.plaque .pack:hover {
transition: box-shadow 0.45s var(--ease), background 0.45s var(--ease);
}
}


@media (min-width: 1400px) {
.bloc { position: relative; }


}




.jalons::before {
background: linear-gradient(180deg,
var(--eclat) 0%,
var(--eclat-lueur) 14%,
var(--eclat-voile) 38%,
var(--line) 68%,
transparent 100%);
}


@media (prefers-reduced-motion: reduce) {
.pack { transition: none; }
.pack:hover { transform: none; }
}

@keyframes filetReveler { to { opacity: 1; } }
html:not(.a-revele) .reveal { animation: filetReveler 0.5s linear 2s forwards; }

@media (scripting: none) {
.reveal {
opacity: 1;
transform: none;
animation: none;
}
}

#cercle {
--eclat: var(--cercle, #EDEAE3);
--eclat-rvb: var(--cercle-rvb, 237, 234, 227);
}


.cercle {
display: grid;
justify-items: center;

row-gap: clamp(10px, 1.3vw, 14px);
margin-top: clamp(14px, 2.4vw, 30px);
text-align: center;
}
.cercle__scene { display: grid; justify-items: center; }


.roue {
--d:     clamp(238px, 33vw, 416px);
--bord:  clamp(13px, 1.75vw, 21px);

--siege: clamp(21px, 2.2vw, 28px);

--verre: max(1.25px, calc(var(--siege) * 0.055));

--r:     calc(var(--d) * 0.5 - var(--bord) - var(--siege) * 0.95);

position: relative;
width: var(--d);
height: var(--d);
border-radius: 50%;

touch-action: pan-y;
-webkit-user-select: none;
user-select: none;
-webkit-tap-highlight-color: transparent;
cursor: grab;
transform: scale(1);
transition: transform 0.45s var(--ease);
}
.roue.est-tenue {
cursor: grabbing;
transform: scale(1.014);
}



.vault { overflow-x: clip; }
.roue__halo {
position: absolute;
z-index: 0;
inset: -12%;
border-radius: 50%;
pointer-events: none;
opacity: 0;
background: radial-gradient(closest-side,
rgba(var(--eclat-rvb), 0.17) 0%,
rgba(var(--eclat-rvb), 0.055) 46%,
rgba(var(--eclat-rvb), 0) 76%);
transition: opacity 0.6s var(--ease);
}
.roue.a-lueur .roue__halo { opacity: 1; }
.roue.a-lueur.est-tenue .roue__halo { opacity: 1; filter: brightness(1.5); }


.roue::before {
content: '';
position: absolute;
z-index: 1;
inset: calc(var(--bord) - 1px);
border-radius: 50%;
background:
radial-gradient(96% 78% at 50% -12%,
rgba(255, 255, 255, 0.10) 0%,
rgba(255, 255, 255, 0.028) 38%,
rgba(255, 255, 255, 0) 66%),
radial-gradient(78% 78% at 50% 52%,
#121216 0%,
#0C0C0F 56%,
#060608 100%);
box-shadow:
inset 0 2px 5px rgba(0, 0, 0, 0.9),
inset 0 -1px 0 rgba(255, 255, 255, 0.05);
}


.roue__plateau {
position: absolute;
z-index: 2;
inset: 0;
border-radius: 50%;
transform: rotate(var(--rot, 0deg));
will-change: transform;
}


.roue__grad {
position: absolute;
inset: calc(var(--bord) + 3px);
border-radius: 50%;
background:
repeating-conic-gradient(from 0deg,
rgba(237, 234, 227, 0.42) 0deg 0.5deg,
rgba(237, 234, 227, 0) 0.5deg var(--pas, 36deg)),
repeating-conic-gradient(from 0deg,
rgba(237, 234, 227, 0.16) 0deg 0.24deg,
rgba(237, 234, 227, 0) 0.24deg calc(var(--pas, 36deg) / 5));
-webkit-mask: radial-gradient(closest-side,
transparent 0 86%, #000 87% 100%);
mask: radial-gradient(closest-side,
transparent 0 86%, #000 87% 100%);
}


.place {
position: absolute;
top: 50%;
left: 50%;
width: var(--siege);
height: var(--siege);
margin: calc(var(--siege) / -2) 0 0 calc(var(--siege) / -2);
border-radius: 50%;
transform: rotate(var(--a)) translateY(calc(var(--r) * -1));
}


.place__n {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
transform: rotate(calc((var(--rot, 0deg) + var(--a)) * -1));
font-family: var(--f-mono);
font-size: calc(var(--siege) * 0.42);
font-weight: 500;
font-variant-numeric: tabular-nums;
letter-spacing: 0;
line-height: 1;

text-shadow: 0 1px 0 rgba(0, 0, 0, 0.55), 0 -0.5px 0 rgba(255, 255, 255, 0.10);
pointer-events: none;
}

.place.est-libre .place__n { color: var(--eclat); }

.place.est-prise .place__n {
color: #0A0B0E;
text-shadow: none;
}

.place.est-visee .place__n { color: var(--eclat-vif); }


.place.est-prise {
background-color: var(--eclat);
background-image: none;
box-shadow:
inset 0 0 0 1px rgba(0, 0, 0, 0.30),
0 1px 3px rgba(0, 0, 0, 0.55);
}


.place.est-libre {
background-color: #0A0B0E;
background-image:
radial-gradient(closest-side,
rgba(var(--eclat-rvb), 0.07) 0%,
rgba(var(--eclat-rvb), 0.09) 54%,
rgba(var(--eclat-rvb), 0.26) 86%,
rgba(var(--eclat-rvb), 0) 100%);
box-shadow:
inset 0 0 0 var(--verre) var(--eclat),
inset 0 1.5px 3px rgba(255, 255, 255, 0.30),

0 0 9px rgba(var(--eclat-rvb), 0.24);
}

.roue.a-lueur .place.est-libre {
box-shadow:
inset 0 0 0 var(--verre) var(--eclat),
inset 0 1.5px 3px rgba(255, 255, 255, 0.34),
0 0 10px rgba(var(--eclat-rvb), 0.24);
}


.place.est-visee {
box-shadow:
inset 0 0 0 calc(var(--verre) * 1.3) var(--eclat-vif),
inset 0 1.5px 3px rgba(255, 255, 255, 0.6),
0 0 30px rgba(var(--eclat-rvb), 0.85);
}

.place.est-prise.est-visee {
box-shadow:
inset 0 0 0 2px rgba(0, 0, 0, 0.42),
0 0 22px rgba(var(--eclat-rvb), 0.55);
}


.roue__jauge {
position: absolute;

z-index: 4;
inset: 0;
border-radius: 50%;
pointer-events: none;

background: conic-gradient(from 0deg,
rgba(var(--eclat-rvb), 0.13) 0deg,
rgba(var(--eclat-rvb), 0.13) calc((1 - var(--libre, 1)) * 360deg),
rgba(var(--eclat-rvb), 0.85) calc((1 - var(--libre, 1)) * 360deg + 1deg),
rgba(var(--eclat-rvb), 0.85) 360deg);


-webkit-mask: radial-gradient(closest-side,
transparent 0 84.4%, #000 85.6% 89.2%, transparent 90.4% 100%);
mask: radial-gradient(closest-side,
transparent 0 84.4%, #000 85.6% 89.2%, transparent 90.4% 100%);

transition: background 0.8s var(--ease);
}

.roue.a-lueur .roue__jauge {
filter: drop-shadow(0 0 6px rgba(var(--eclat-rvb), 0.55));
}

.roue__biseau {
position: absolute;
z-index: 3;
inset: 0;
border-radius: 50%;
pointer-events: none;
background: conic-gradient(from 212deg,
#26262A   0deg,
#6A6A72  52deg,
#CFCFD2  94deg,
#7E7E86 138deg,
#2C2C31 196deg,
#56565E 262deg,
#A2A2A9 318deg,
#26262A 360deg);
-webkit-mask: radial-gradient(closest-side,
transparent 0 calc(100% - var(--bord)),
#000 calc(100% - var(--bord) + 0.5px) 100%);
mask: radial-gradient(closest-side,
transparent 0 calc(100% - var(--bord)),
#000 calc(100% - var(--bord) + 0.5px) 100%);
box-shadow:
inset 0 0 0 1px rgba(255, 255, 255, 0.10),
0 26px 54px -28px rgba(0, 0, 0, 0.98);
}


.roue__reflet {
position: absolute;
z-index: 4;
inset: 0;
border-radius: 50%;
pointer-events: none;
background:
radial-gradient(56% 44% at 29% 11%,
rgba(255, 255, 255, 0.17) 0%,
rgba(255, 255, 255, 0) 70%),
linear-gradient(198deg,
rgba(255, 255, 255, 0.055) 0%,
rgba(255, 255, 255, 0) 40%);
}


.roue__index {
position: absolute;
z-index: 5;
top: calc(var(--bord) * 0.26);
left: 50%;
width: 2px;

height: calc(var(--bord) * 0.74 + var(--siege) * 0.45 - 5px);
margin-left: -1px;
border-radius: 0;
pointer-events: none;
background: linear-gradient(180deg,
var(--eclat-vif) 0%,
var(--eclat) 46%,
rgba(var(--eclat-rvb), 0) 100%);
}
.roue.a-lueur .roue__index {
box-shadow: 0 0 12px rgba(var(--eclat-rvb), 0.9);
}


.roue__coeur {
position: absolute;
z-index: 6;
top: 50%;
left: 50%;
width: 35%;
aspect-ratio: 1;
transform: translate(-50%, -50%);
pointer-events: none;
}

.roue__coeur::before {
content: '';
position: absolute;
inset: -11%;
border-radius: 50%;
background: radial-gradient(closest-side,
rgba(255, 255, 255, 0.06) 0%,
rgba(255, 255, 255, 0.015) 62%,
rgba(255, 255, 255, 0) 100%);
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.16),
inset 0 0 0 1px rgba(255, 255, 255, 0.07),
0 0 26px rgba(0, 0, 0, 0.8);
}
.coeur__disque {
display: grid;
place-items: center;
width: 100%;
height: 100%;
border-radius: 50%;

position: relative;
z-index: 1;

background-image:
radial-gradient(34% 34% at 28% 17%,
rgba(255, 255, 255, 0.80) 0%,
rgba(255, 255, 255, 0) 74%),

linear-gradient(158deg,
#E4E4E1 0%,
var(--acier) 32%,
#ADADB2 60%,
#86868D 84%,
#797980 100%);
box-shadow:
inset 0 1.5px 0 rgba(255, 255, 255, 0.92),
inset 0 -2.5px 5px rgba(10, 10, 11, 0.42),
0 0 0 1px rgba(10, 10, 11, 0.72),
0 3px 5px rgba(0, 0, 0, 0.6),
0 20px 38px -16px rgba(0, 0, 0, 0.98);
transition: transform 0.5s var(--ease), box-shadow 0.5s var(--ease);
}
.roue.est-tenue .coeur__disque { transform: scale(1.035); }

.coeur__marque {
width: 58%;
fill: var(--encre);
opacity: 0.92;

filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.62));
}
.coeur__mot {
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-7);
letter-spacing: var(--k-titre);
color: var(--encre);
opacity: 0.9;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.62);
}









.tirage {
display: grid;
place-items: center;
min-height: clamp(56px, 6.4vw, 72px);
margin-top: clamp(14px, 2vw, 22px);
}
.tirage > * { grid-area: 1 / 1; }


.tirage__invite {
display: flex;
align-items: center;
gap: 9px;
margin: 0;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
line-height: 1;
color: var(--ash);
transition: opacity 0.3s var(--ease);
}
.tirage.est-lue .tirage__invite { opacity: 0; }
.tirage__giration {
width: 14px;
height: 14px;
flex: 0 0 auto;
animation: carteGiration 5s linear infinite;
}


.tirage__lu {
display: grid;
justify-items: center;
row-gap: 7px;
margin: 0;
opacity: 0;
transition: opacity 0.22s var(--ease);
}
.tirage.est-lue .tirage__lu { opacity: 1; }
.tirage__lu b {
font-family: var(--f-mono);
font-weight: 500;
font-size: clamp(32px, 3.6vw, 50px);
letter-spacing: 0.01em;
line-height: 1;
color: var(--eclat-vif);
font-variant-numeric: tabular-nums;
text-shadow: 0 0 24px rgba(var(--eclat-rvb), 0.45);
transition: opacity 0.2s var(--ease), transform 0.2s var(--ease);
}
.tirage__lu span {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
line-height: 1;
color: var(--ash);
}

.tirage__lu.est-prise b {
text-shadow: 0 0 24px rgba(var(--eclat-rvb), 0.28);
}
.tirage__lu.est-prise span { color: var(--bone); }


.tirage.tourne .tirage__lu b {
opacity: 0.42;
transform: scale(0.84);
}
.tirage.est-pose .tirage__lu b { animation: tirageClaque 0.42s var(--ease); }
@keyframes tirageClaque {
0%   { transform: scale(0.84); opacity: 0.45; }
55%  { transform: scale(1.06); opacity: 1; }
100% { transform: scale(1);    opacity: 1; }
}



.jure__phare {
margin: clamp(12px, 1.8vw, 20px) 0 0;
padding-bottom: 0;
border-bottom: 0;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 600;

font-size: clamp(19px, 1.7vw, 26px);
line-height: 1.32;
letter-spacing: var(--k-bloc);
color: var(--bone);
max-width: 26ch;
text-wrap: balance;
}



.vault {
--carte-fond:  var(--pose);
--carte-bord:  var(--line);
--carte-ombre: var(--lueur-haut);
}




.entrer {
position: relative;
display: inline-flex;
align-items: center;
gap: 10px;
padding: 0 0 9px;
border: 0;
border-radius: 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: var(--tx-4);
font-weight: 600;
letter-spacing: var(--k-texte);
line-height: 1;
text-decoration: none;
white-space: nowrap;
cursor: pointer;
background: none;
color: var(--bone);
box-shadow: none;
transition: color 0.3s var(--ease);
}
.entrer::after {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 1px;
background: var(--rouge);
transform-origin: left center;
transition: transform 0.4s var(--ease);
}

.entrer::before {
content: '';
position: absolute;
left: 0;
right: 0;
top: 50%;
height: 48px;
transform: translateY(-50%);
}
.entrer svg { transition: transform 0.35s var(--ease); }
.entrer:focus-visible { outline: 2px solid var(--bone); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) {
.entrer:hover { color: var(--eclat-vif); }
.entrer:hover::after { transform: scaleY(2.4); }
.entrer:hover svg { transform: translateY(3px); }
}


@media (max-width: 900px) {
.cercle { grid-template-columns: minmax(0, 1fr); justify-items: center; }
.roue   { --d: clamp(244px, 66vw, 360px); }

.jure__phare { max-width: none; }
}
@media (max-width: 760px) {


}


@media (prefers-reduced-motion: reduce) {
.tirage__giration { animation: none; }
.tableau__vif i { animation: none; }
.fiche__agir svg { transition: none; }
.tirage.est-pose .tirage__lu b { animation: none; }
.tirage.tourne .tirage__lu b { opacity: 1; transform: none; }
.roue,
.roue.est-tenue { transform: none; transition: none; }
.roue.a-lueur .place.est-libre { animation: none; }
.coeur__disque,
.roue__halo,
.entrer,
.entrer svg { transition: none; }
}





.rail-boite {
width: 100%;
margin-top: clamp(30px, 4vw, 48px);
}


.rail {
display: flex;
align-items: stretch;
gap: clamp(12px, 1.4vw, 16px);
margin: 0;
padding: 4px 0 2px;
list-style: none;
text-align: left;
overflow-x: auto;
overscroll-behavior-x: contain;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
scrollbar-width: none;
-webkit-overflow-scrolling: touch;
}
.rail::-webkit-scrollbar { display: none; }
.rail:focus-visible { outline: 2px solid var(--eclat); outline-offset: 6px; }


.rail > li {
flex: 0 0 min(288px, 76vw);
scroll-snap-align: start;
display: flex;
container-type: inline-size;
container-name: fiche;
}


.fiche {
--bone: var(--bc-texte);
--ash:  var(--bc-texte-2);
--line: var(--bc-filet);
--eclat:     var(--bc-texte);
--eclat-rvb: 237, 234, 227;

position: relative;
display: flex;
flex-direction: column;
width: 100%;
box-sizing: border-box;
padding: 18px 17px 17px;

border-radius: 0;
overflow: hidden;
color: var(--bc-texte);
background-image: none;
background-color: var(--fiche-plat, #191919);
box-shadow:
inset 0 1px 0 var(--bc-reflet),
inset 0 0 0 1px var(--bc-bord),
inset 0 -1px 0 var(--bc-tranche),
0 14px 34px -20px rgba(var(--bc-ombre-rvb), var(--bc-ombre-a)),
0 2px 8px -4px rgba(var(--bc-ombre-rvb), 0.5);
}
.fiche > * { position: relative; z-index: 2; }




.fiche__tete {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
margin: 0 0 4px;
}
.fiche__nom {
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-weight: 600;
font-size: 11.5px;
letter-spacing: 0.17em;
text-transform: uppercase;
line-height: 1.25;
color: var(--bc-texte);
}
.fiche__jeton {
flex: 0 0 auto;
font-family: var(--f-mono);
font-size: 8.5px;
letter-spacing: 0.2em;
line-height: 1;
color: var(--bc-texte-3);
font-variant-numeric: tabular-nums;
}




.fiche { --creux: rgba(0, 0, 0, 0.26); }


.fiche__corps {
flex: 1 0 auto;
display: flex;
flex-direction: column;
margin: 15px 0 0;
padding: 0;
list-style: none;
}


.dix {
justify-content: space-between;
row-gap: clamp(10px, 3%, 18px);
}
.dix__cap {
display: flex;
align-items: center;
gap: 11px;
margin: 0;
flex: 0 0 auto;
}
.dix__cap b {
font-family: var(--f-mono);
font-weight: 500;
font-size: 38px;
letter-spacing: 0.015em;
line-height: 1;
color: var(--bc-chiffre);
font-variant-numeric: tabular-nums;
text-shadow: 0 -1px 0 var(--bc-bosse), 0 1px 1px var(--bc-creux),
0 2px 3px var(--bc-creux);
}
.dix__cap span {
font-family: var(--f-mono);
font-size: 9px;
letter-spacing: 0.15em;
text-transform: uppercase;
line-height: 1.5;
color: var(--bc-texte-2);
}

.dix__grille {
flex: 1 1 auto;
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
grid-template-rows: repeat(2, minmax(38px, 1fr));
gap: 5px;
min-height: 86px;

max-height: 112px;
margin: 0;
padding: 0;
list-style: none;
}
.dix__place {
display: grid;
place-items: center;
border-radius: 0;
font-family: var(--f-mono);
font-size: 12px;
line-height: 1;
font-variant-numeric: tabular-nums;
}
.dix__place.est-libre {
color: var(--bc-texte);
background: var(--creux);
box-shadow: inset 0 0 0 1px var(--bc-bord), inset 0 1px 0 var(--bc-reflet);
}

.dix__place.est-prise {
color: var(--bc-bande);
background: var(--bc-texte);
box-shadow: none;
}

.dix__cles {
display: flex;
flex-wrap: wrap;
flex: 0 0 auto;
gap: 6px 14px;
margin: 0;
font-family: var(--f-mono);
font-size: 9.5px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--bc-texte-2);
}
.dix__cle { display: inline-flex; align-items: center; gap: 6px; }
.dix__cle i { width: 9px; height: 8px; flex: 0 0 auto; }
.dix__cle i.est-libre {
background: var(--creux);
box-shadow: inset 0 0 0 1px var(--bc-bord);
}
.dix__cle i.est-prise { background: var(--bc-texte); }


.voie {
--voie-jour: clamp(8px, 2.4%, 13px);
row-gap: var(--voie-jour);
}
.voie__station {
position: relative;
flex: 1 1 0;
display: flex;
flex-direction: column;
justify-content: center;
gap: 5px;
min-height: 0;
padding: 10px 13px 10px 33px;
border-radius: 0;
background: var(--creux);
box-shadow: inset 0 0 0 1px var(--bc-bord), inset 0 1px 0 var(--bc-reflet);
}


.voie__station::after {
content: '';
position: absolute;
top: calc(50% - 4.5px);
left: 13px;
width: 9px;
height: 9px;
border-radius: 50%;
background: var(--bc-texte);
}
.voie__station:not(:last-child)::before {
content: '';
position: absolute;
top: 100%;
left: 17px;
width: 1px;
height: var(--voie-jour);
background: var(--bc-filet);
}
.voie__cle {
display: block;
font-family: var(--f-mono);
font-size: 8.5px;
letter-spacing: 0.13em;
text-transform: uppercase;
line-height: 1.2;
color: var(--bc-texte);
}
.voie__mot {
margin: 0;
font-size: 12px;
line-height: 1.36;
color: var(--bc-texte-2);
text-wrap: pretty;
}


.tenue {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: repeat(2, minmax(0, 1fr));
}
.tenue > li {
display: flex;
flex-direction: column;
justify-content: center;
min-width: 0;
padding: 12px 11px;
}
.tenue > li:nth-child(odd)  { padding-left: 0;  border-right: 1px solid var(--bc-filet); }
.tenue > li:nth-child(even) { padding-right: 0; }
.tenue > li:nth-child(-n+2) { padding-top: 0;   border-bottom: 1px solid var(--bc-filet); }
.tenue > li:nth-child(n+3)  { padding-bottom: 0; }
.tenue__ico {
display: block;
flex: 0 0 auto;
width: 17px;
height: 17px;
margin-bottom: 9px;
fill: none;
stroke: var(--bc-texte);
stroke-width: 1.5;
stroke-linecap: round;
stroke-linejoin: round;
opacity: 0.75;
}
.tenue > li b {
display: block;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-weight: 600;
font-size: 12px;
letter-spacing: 0.01em;
line-height: 1.2;
color: var(--bc-texte);
}
.tenue > li span {
display: block;
margin-top: 5px;
font-size: 11px;
line-height: 1.34;
color: var(--bc-texte-2);
text-wrap: pretty;
}


.index > li {
display: grid;

grid-template-columns: 54px minmax(0, 1fr);
column-gap: 16px;
align-content: center;
align-items: center;
flex: 1 1 0;
min-height: 0;
}
.index__no {
font-family: var(--f-mono);
font-weight: 500;
font-size: 40px;
line-height: 0.94;
letter-spacing: 0.01em;
color: var(--bc-texte-3);
font-variant-numeric: tabular-nums;
text-shadow: 0 -1px 0 var(--bc-bosse), 0 1px 1px var(--bc-creux),
0 2px 3px var(--bc-creux);
}
.index__cle {
display: block;
margin-bottom: 8px;
font-family: var(--f-mono);
font-size: 8.5px;
letter-spacing: 0.2em;
text-transform: uppercase;
line-height: 1;
color: var(--bc-texte-3);
}
.index__mot {
margin: 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-weight: 600;

font-size: clamp(17px, 7.2cqi, 22px);
line-height: 1.26;
letter-spacing: -0.01em;
color: var(--bc-texte);
text-wrap: pretty;
}


.tableau {
border-radius: 0;
overflow: hidden;
background: var(--creux);
box-shadow: inset 0 0 0 1px var(--bc-bord);
}
.tableau__barre {
display: flex;
align-items: center;
justify-content: space-between;
flex: 0 0 auto;
gap: 8px;
margin: 0;
padding: 8px 10px;
border-bottom: 1px solid var(--bc-filet);
}
.tableau__nom {
font-family: var(--f-mono);
font-size: 8.5px;
letter-spacing: 0.14em;
text-transform: uppercase;
line-height: 1;
color: var(--bc-texte);
}
.tableau__vif {
display: inline-flex;
align-items: center;
gap: 5px;
flex: 0 0 auto;
font-family: var(--f-mono);
font-size: 8.5px;
letter-spacing: 0.12em;
text-transform: uppercase;
line-height: 1;
color: var(--bc-texte-2);
}
.tableau__vif i {
width: 5px;
height: 5px;
border-radius: 50%;
background: var(--bc-accent);
box-shadow: 0 0 0 2px rgba(221, 0, 0, 0.18);
animation: tableauVif 2.6s var(--ease) infinite;
}
@keyframes tableauVif { 0%, 100% { opacity: 1 } 50% { opacity: 0.3 } }

.tableau__courbe {
display: block;
flex: 1 1 auto;
width: 100%;
min-height: 36px;
max-height: 96px;
}
.tableau__trait {
fill: none;
stroke: var(--bc-texte);
stroke-width: 1.4;
stroke-linejoin: round;
opacity: 0.6;
vector-effect: non-scaling-stroke;
}
.tableau__aire { fill: var(--bc-texte); opacity: 0.05; stroke: none; }

.tableau__lignes {
display: flex;
flex-direction: column;
flex: 0 1 auto;
margin: 0;
border-top: 1px solid var(--bc-filet);
}
.tableau__lignes > div {
display: flex;
align-items: center;
justify-content: space-between;
flex: 1 1 0;
gap: 10px;
min-height: 30px;
padding: 6px 10px;
}
.tableau__lignes > div + div { border-top: 1px solid var(--bc-filet); }
.tableau__lignes dt { font-size: 11.5px; line-height: 1.2; color: var(--bc-texte-2); }
.tableau__lignes dd {
margin: 0;
font-family: var(--f-mono);
font-size: 12px;
letter-spacing: 0.16em;
line-height: 1;
color: var(--bc-texte);
}
.tableau__pied {
display: flex;
align-items: center;
flex: 0 0 auto;
gap: 7px;
margin: 0;
padding: 8px 10px;
border-top: 1px solid var(--bc-filet);
}
.tableau__pied svg {
width: 13px;
height: 13px;
flex: 0 0 auto;
fill: var(--bc-texte);
opacity: 0.62;
}
.tableau__pied span { font-size: 11px; line-height: 1.2; color: var(--bc-texte-2); }


.marche > li {
position: relative;
display: flex;
align-items: flex-start;
flex: 1 1 0;
gap: 11px;
min-height: 34px;
}
.marche > li:last-child { flex: 0 0 auto; }
.marche > li:not(:last-child)::after {
content: '';
position: absolute;
left: 10px;
top: 23px;
bottom: 0;
width: 1px;
background: var(--bc-filet);
}
.marche__cran {
display: grid;
place-items: center;
flex: 0 0 auto;
width: 21px;
height: 21px;
border-radius: 50%;
font-family: var(--f-mono);
font-size: 10px;
line-height: 1;
color: var(--bc-texte);
background: var(--creux);
box-shadow: inset 0 0 0 1px var(--bc-bord);
}
.marche > li:last-child .marche__cran {
color: #0C0C0F;
background: var(--bc-texte);
box-shadow: none;
}
.marche > li b {
padding-top: 3px;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-weight: 600;
font-size: 13px;
line-height: 1.3;
color: var(--bc-texte-2);
text-wrap: pretty;
}
.marche > li:last-child b { color: var(--bc-texte); }


.fiche__agir {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
margin-top: 13px;
padding-top: 13px;
border-top: 1px solid var(--bc-filet);
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-weight: 600;
font-size: 12.5px;
letter-spacing: 0.01em;
line-height: 1.2;
color: var(--bc-texte);
text-decoration: none;
}
.fiche__agir svg {
width: 15px;
height: 15px;
flex: 0 0 auto;
opacity: 0.6;
transition: transform 0.35s var(--ease), opacity 0.35s var(--ease);
}
.fiche__agir:focus-visible {
outline: 2px solid var(--bc-texte);
outline-offset: 3px;
border-radius: 0;
}
@media (hover: hover) and (pointer: fine) {
.fiche__agir:hover svg { transform: translateX(3px); opacity: 1; }
}


.fiche--franc::after { display: none; }
.fiche--franc::before {
content: '';
position: absolute;
inset: 0 0 auto;
height: 2px;
z-index: 4;
background: var(--bc-texte);
opacity: 0.28;
pointer-events: none;
}
.franc {
border-radius: 0;
padding: 0 13px;
box-shadow: inset 0 0 0 1px var(--bc-bord);
}
.franc > li {
display: flex;
align-items: center;
flex: 1 1 0;
min-height: 44px;
padding: 10px 0;
font-size: 13px;
line-height: 1.42;
color: var(--bc-texte);
text-wrap: pretty;
}
.franc > li + li { border-top: 1px solid var(--bc-filet); }


.fiche__dit {
margin: 16px 0 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-weight: 600;
font-size: 15px;
line-height: 1.34;
letter-spacing: var(--k-texte);
color: var(--bc-texte);
text-wrap: pretty;
}
.fiche__pied {
margin: 13px 0 0;
padding-top: 12px;
border-top: 1px solid var(--bc-filet);
font-size: 12px;
line-height: 1.45;
color: var(--bc-texte-2);
text-wrap: pretty;
}


@container fiche (max-width: 258px) {


.tenue { grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(4, minmax(0, 1fr)); }

.tenue > li:nth-child(odd)  { border-right: 0; }
.tenue > li:nth-child(-n+2) { border-bottom: 0; }
.tenue > li:nth-child(n) {
display: grid;
grid-template-columns: 17px minmax(0, 1fr);
align-content: center;
column-gap: 10px;
padding: 12px 0;
}
.tenue > li:nth-child(n) + li { border-top: 1px solid var(--bc-filet); }
.tenue > li:first-child { padding-top: 0; }
.tenue > li:last-child  { padding-bottom: 0; }
.tenue__ico { grid-row: 1 / 3; margin: 2px 0 0; }
.tenue > li span { margin-top: 3px; }


.index > li { grid-template-columns: 44px minmax(0, 1fr); column-gap: 13px; }
.index__no { font-size: 33px; }
.index__mot { font-size: clamp(16px, 7.2cqi, 19px); }
}



.rail-etat {
display: none;
align-items: center;
justify-content: center;
gap: clamp(13px, 1.7vw, 18px);
margin-top: clamp(18px, 2.2vw, 24px);
}
.rail.est-vive + .rail-etat { display: flex; }

.rail-compte {
flex: 0 0 auto;
display: inline-flex;
align-items: baseline;
gap: 0.5em;
margin: 0;
font-family: var(--f-mono);
font-size: clamp(14px, 1.15vw, 17px);
letter-spacing: var(--k-etiquette);
line-height: 1;
color: var(--ash);
font-variant-numeric: tabular-nums;
}
.rail-compte b { font-weight: 500; color: var(--bone); }
.rail-compte i {
font-style: normal;
font-size: 0.78em;
letter-spacing: 0.12em;
}

.rail-fleche {
width: 40px;
height: 40px;
display: grid;
place-items: center;
padding: 0;
border: 0;
border-radius: 0;
background: none;
color: var(--ash);
cursor: pointer;
transition: color 0.3s var(--ease), opacity 0.3s var(--ease);
}
.rail-fleche svg { transition: transform 0.3s var(--ease); }
.rail-fleche[disabled] { opacity: 0.22; cursor: default; }
@media (hover: hover) and (pointer: fine) {
.rail-fleche:not([disabled]):hover { color: var(--bone); }
.rail-fleche:not([disabled])[data-rail="-1"]:hover svg { transform: translateX(-2px); }
.rail-fleche:not([disabled])[data-rail="1"]:hover svg { transform: translateX(2px); }
}


@media (prefers-reduced-motion: reduce) {
.rail { scroll-behavior: auto; }
}





.cloture {
margin: clamp(30px, 3.6vw, 42px) 0 clamp(26px, 3.2vw, 38px);
padding: clamp(24px, 3vw, 34px) 0;
border-top: 1px solid var(--line);
border-bottom: 1px solid var(--line);
text-align: center;
}
.ferme {
margin: 0 auto;
max-width: 46ch;
}
.ferme b {
display: block;
margin-bottom: clamp(5px, 0.7vw, 8px);
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 700;

font-size: clamp(22px, 1.9vw, 29px);
line-height: 1.1;
letter-spacing: var(--k-bloc);
color: var(--bone);
}
.ferme span {
display: block;
font-size: var(--tx-2);
line-height: 1.45;
color: var(--ash);
text-wrap: pretty;
}



.agir {
max-width: 46ch;
margin: clamp(15px, 1.9vw, 22px) auto 0;
text-align: center;
}


.agir__regle {
display: block;
margin-top: clamp(9px, 1.1vw, 12px);
font-size: var(--tx-2);
line-height: 1.5;
color: var(--ash);
text-wrap: pretty;
}

.seuil {
display: grid;
grid-template-columns: minmax(0, 1fr) min(520px, 100%);
grid-template-areas:
'tete      tete'
'questions panneau';
column-gap: clamp(32px, 5vw, 84px);
align-items: start;
text-align: center;
}
.seuil > .entete { grid-area: tete; }
.seuil .panneau { grid-area: panneau; width: 100%; margin: 0; }

.seuil .questions {
grid-area: questions;
align-self: center;
margin: 0;
max-width: 560px;
justify-self: end;
width: 100%;
text-align: left;
}
@media (max-width: 980px) {
.seuil { display: block; }
.seuil .panneau { margin: 0 auto; }
.seuil .questions { margin: clamp(24px, 3.2vw, 38px) auto 0; }
}


.seuil > .entete { margin-bottom: clamp(26px, 3.4vw, 42px); }




.seuil__titre {
margin: 0 auto clamp(28px, 4.2vw, 48px);
max-width: 15ch;
}





.panneau {
position: relative;
max-width: 520px;
margin: 0 auto;

--pan-t: clamp(19px, 2.5vw, 27px);
--pan-x: clamp(17px, 2.3vw, 27px);
--pan-b: clamp(17px, 2.1vw, 23px);
padding: var(--pan-t) var(--pan-x) var(--pan-b);
background: #070709;
text-align: left;

border-radius: 0;

--creux: rgba(237, 234, 227, 0.045);
}



.panneau__fil {
position: absolute;
left: 0;
right: 0;
top: 0;
height: 1px;
overflow: hidden;
}

.panneau__fil i {
position: absolute;
inset: 0;
display: block;
opacity: 0;
background: linear-gradient(90deg, transparent, var(--eclat), transparent);
}
.is-turning .panneau__fil i {
opacity: 1;
animation: filPasse 1.05s linear infinite;
}
.is-open .panneau__fil i {
opacity: 1;
animation: none;
transform: none;
background: var(--eclat);
}
@keyframes filPasse {
from { transform: translateX(-101%); }
to   { transform: translateX(101%); }
}


.panneau__tete {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin: calc(-1 * var(--pan-t)) calc(-1 * var(--pan-x)) clamp(12px, 1.6vw, 16px);
padding: clamp(10px, 1.3vw, 13px) var(--pan-x);
background: var(--creux);
}
.panneau__nom {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-repere);
text-transform: uppercase;
color: var(--ash);
}
.panneau__etat {
display: inline-flex;
align-items: center;
gap: 7px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
.panneau__etat::before {
content: '';
width: 5px;
height: 5px;
border-radius: 50%;
background: var(--eclat);
box-shadow: 0 0 0 3px rgba(var(--eclat-rvb), 0.16);
}



.avis {
--avis-t: var(--eclat);                       
--avis-b: rgba(var(--eclat-rvb), 0.20);       
--avis-f: rgba(var(--eclat-rvb), 0.055);      
margin: 0;
padding: 10px 14px 11px;
border-radius: 0;
border: 1px solid var(--avis-b);
background: var(--avis-f);
text-align: center;
text-wrap: pretty;
font-size: var(--tx-2);
line-height: 1.5;
color: var(--ash);
}

.avis__t {
display: block;
color: var(--bone);
font-weight: 500;
}
.avis__d {
display: block;
max-width: 40ch;
margin-inline: auto;
}
.avis__t + .avis__d { margin-top: 3px; }


.avis--info {
--avis-t: var(--eclat);
--avis-b: rgba(var(--eclat-rvb), 0.20);
--avis-f: rgba(var(--eclat-rvb), 0.055);
}


.avis--ko {
--avis-t: var(--rouge);
--avis-b: rgba(201, 143, 143, 0.62);
--avis-f: rgba(201, 143, 143, 0.075);
}

.avis--ok {
--avis-t: var(--gain);
--avis-b: rgba(79, 201, 138, 0.42);
--avis-f: rgba(79, 201, 138, 0.075);
}


.avis--attente { --avis-t: var(--eclat); }
.avis--attente { animation: avisRespire 1.5s var(--ease) infinite; }

@keyframes avisRespire {
0%, 100% { border-color: rgba(var(--eclat-rvb), 0.34); }
50%      { border-color: rgba(var(--eclat-rvb), 0.14); }
}


.panneau__avis { margin-bottom: clamp(14px, 1.9vw, 18px); }



.volet { margin-top: 0; }
.volet[hidden] { display: none; }



.volet__grille { display: block; }


.ligne {
display: grid;
grid-template-columns: 17px minmax(0, 1fr);
align-items: center;
gap: 0 clamp(10px, 1.6vw, 14px);
margin: 0;
padding: clamp(9px, 1.2vw, 12px) 0;
border-bottom: 1px solid var(--line);
}
.volet__grille > .ligne:first-child { padding-top: 0; }


.ligne__signe {
width: 14px;
height: 14px;
fill: none;
stroke: var(--ash);
stroke-width: 1.4;
transition: stroke 0.25s var(--ease);
}
.ligne:focus-within .ligne__signe { stroke: #DD0000; }


.ligne__duo {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.ligne__duo input + input {
padding-left: clamp(10px, 1.6vw, 14px);
border-left: 1px solid var(--line);
}

.ligne input,
.ligne textarea {
width: 100%;
padding: 0;
border: 0;
border-radius: 0;
background: none;
color: var(--bone);
font-family: var(--f-body);

font-size: var(--tx-4);
line-height: 1.3;
transition: box-shadow 0.25s var(--ease);
}
.ligne textarea { resize: vertical; min-height: 54px; line-height: 1.6; }


.ligne input::placeholder,
.ligne textarea::placeholder { color: #3B3B43; }

.ligne input:focus,
.ligne textarea:focus { outline: none; }
.ligne:focus-within { border-bottom-color: #DD0000; }

.ligne.is-ko .ligne__signe { stroke: #DD0000; }
.ligne.is-ko {
border-bottom-color: #DD0000;
box-shadow: 0 1px 0 #DD0000;
}


.ligne--long { align-items: start; }
.ligne--long .ligne__signe { margin-top: 3px; }

.ligne--code input {
padding: 2px 0 4px;
font-family: var(--f-mono);
font-size: var(--tx-4);
letter-spacing: var(--k-bloc);
text-transform: uppercase;
}
.ligne--code input::placeholder { letter-spacing: var(--k-repere); color: #2F2F36; }



.volet__voie {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 8px 12px;
margin: clamp(13px, 1.8vw, 17px) calc(-1 * var(--pan-x)) calc(-1 * var(--pan-b));
padding: clamp(10px, 1.3vw, 13px) var(--pan-x);
background: var(--creux);
font-size: var(--tx-2);
line-height: 1.4;
color: var(--ash);
text-align: left;
}
.volet__autre {
appearance: none;
margin: 0;
padding: 0 0 2px;
border: 0;
border-bottom: 1px solid #DD0000;
border-radius: 0;
background: none;
color: var(--bone);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
cursor: pointer;
}
.volet__autre:focus-visible { outline: 2px solid var(--eclat); outline-offset: 3px; }


.presser {
display: block;
width: 100%;
margin-top: clamp(15px, 2.1vw, 19px);
padding: 13px 20px;
border: 1px solid var(--bone);
border-radius: 0;
background: var(--bone);
color: var(--encre);
font-family: var(--f-body);
font-size: var(--tx-3);
font-weight: 600;
letter-spacing: var(--k-texte);
cursor: pointer;
transition: background 0.25s var(--ease), border-color 0.25s var(--ease),
opacity 0.25s var(--ease), transform 0.12s ease-out;
}
.presser:hover { background: #FFFFFF; border-color: #FFFFFF; }
.presser:active { transform: scale(0.99); }
.presser:focus-visible { outline: 2px solid var(--eclat); outline-offset: 2px; }

.presser[disabled] { opacity: 0.48; cursor: default; }

#acces.is-turning .presser[disabled] { cursor: progress; }
:root:not(.est-froid) #acces.is-turning .presser[disabled] { opacity: 0.78; }

:root:not(.est-froid) #acces.is-open .presser[disabled] { opacity: 0.78; }
.presser[disabled]:hover { background: var(--bone); border-color: var(--bone); }
.presser[disabled]:active { transform: none; }


#acces.is-turning .panneau__etat::before {
animation: etatRespire 1.5s var(--ease) infinite;
}
@keyframes etatRespire {
0%, 100% { opacity: 1;    box-shadow: 0 0 0 3px rgba(var(--eclat-rvb), 0.16); }
50%      { opacity: 0.45; box-shadow: 0 0 0 5px rgba(var(--eclat-rvb), 0.05); }
}
#acces.is-open .panneau__etat::before {
background: var(--gain);
box-shadow: 0 0 0 3px rgba(79, 201, 138, 0.18);
}


.form__msg { margin: 0 0 clamp(12px, 1.6vw, 15px); }
.form__msg[hidden] { display: none; }


.questions {
max-width: 520px;
margin: clamp(24px, 3.2vw, 38px) auto 0;
}
.question { border-top: 1px solid var(--line); }
.question:last-child { border-bottom: 1px solid var(--line); }
.question summary {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: clamp(12px, 1.6vw, 15px) 2px;
cursor: pointer;
list-style: none;
font-size: var(--tx-3);
font-weight: 500;
color: var(--bone);
}
.question summary::-webkit-details-marker { display: none; }
.question summary::after {
content: '';
flex: 0 0 auto;
width: 11px;
height: 11px;
background:
linear-gradient(var(--rouge), var(--rouge)) 50% 50% / 11px 1.5px no-repeat,
linear-gradient(var(--rouge), var(--rouge)) 50% 50% / 1.5px 11px no-repeat;
transition: transform 0.3s var(--ease);
}
.question[open] summary::after { transform: rotate(45deg); }
.question p {
margin: 0;
padding: 0 2px clamp(12px, 1.6vw, 15px);
font-size: var(--tx-3);
line-height: 1.65;
color: var(--ash);
max-width: 58ch;
}
@media (prefers-reduced-motion: reduce) {
.question summary::after { transition: none; }
}



.pot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }


.plaque .panneau {
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.06),
0 34px 64px -32px rgba(10, 10, 11, 0.82),
0 5px 14px -7px rgba(10, 10, 11, 0.38),
0 0 120px -26px rgba(237, 234, 227, 0.32);
}


#acces.is-open .panneau {
box-shadow: var(--lueur-haut), var(--ombre-3),
0 0 0 1px rgba(var(--eclat-rvb), 0.5),
0 0 90px -18px var(--eclat-lueur);
}

@media (prefers-reduced-motion: reduce) {
.panneau__fil i { animation: none; }
.presser:active { transform: none; }

.avis--attente,
#acces.is-turning .panneau__etat::before { animation: none; }
}


.cle__ok {
display: inline-flex;
align-items: center;
gap: 10px;
margin-top: 22px;
padding: 12px 26px;
border: 1px solid rgba(237, 234, 227, 0.26);
border-radius: 999px;
background: none;
color: var(--bone);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
cursor: pointer;
}
.cle__ok svg { transition: transform 0.4s var(--ease); }
.cle__ok:hover { background: var(--bone); border-color: var(--bone); color: var(--ink); }
.cle__ok:hover svg { transform: translateX(4px); }
.cle__ok[disabled] { opacity: 0.4; cursor: default; }
.cle__ok[disabled]:hover { background: none; color: var(--bone); }


.cle__ok {
transition: transform 0.12s ease-out, background 0.4s var(--ease),
color 0.4s var(--ease), border-color 0.4s var(--ease);
}
.cle__ok:active { transform: scale(0.975); }
.cle__ok[disabled]:active { transform: none; }


.recepisse { padding: clamp(10px, 1.4vw, 16px) 0 4px; text-align: center; }
.recepisse__tampon {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 6px 12px;
border: 1px solid rgba(79, 201, 138, 0.4);
border-radius: 999px;
color: var(--gain);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
}
.recepisse__tampon::before {
content: '';
width: 5px;
height: 5px;
border-radius: 50%;
background: var(--gain);
box-shadow: 0 0 0 3px rgba(79, 201, 138, 0.16);
}
.recepisse__num {
display: block;
margin: 16px 0 4px;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-8);
line-height: 1;
letter-spacing: var(--k-phare);
font-variant-numeric: tabular-nums;
color: var(--eclat);
}
.recepisse__num small {
display: block;
margin-bottom: 8px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-repere);
text-transform: uppercase;
color: var(--ash);
}
.recepisse__mot {
margin: 10px auto 0;
max-width: 40ch;
font-size: var(--tx-3);
line-height: 1.6;
color: var(--ash);
}

.recepisse__pourquoi {
margin: clamp(14px, 1.8vw, 18px) auto 0;
max-width: 42ch;
font-size: var(--tx-3);
line-height: 1.55;
color: var(--ash);
white-space: pre-line;
text-wrap: balance;
}


.recepisse__suivre {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
margin-top: clamp(10px, 1.4vw, 13px);
padding: 11px 22px;
border: 1px solid var(--line);
border-radius: 0;
color: var(--bone);
font-size: var(--tx-2);
font-weight: 500;
text-decoration: none;
transition: border-color 0.25s var(--ease), background 0.25s var(--ease);
}

.recepisse__pourquoi::before {
content: '';
display: block;
width: 100%;
height: 1px;
margin-bottom: clamp(12px, 1.6vw, 16px);
background: var(--line);
}
.recepisse__suivre:hover,
.recepisse__suivre:focus-visible { border-color: var(--bone); background: var(--pose); }

.recit {
transition: background-color var(--co-pas) var(--co-courbe);
}
.coffre__tete {
max-width: 29ch;
margin-bottom: clamp(24px, 3.2vw, 44px);
}
.coffre {
--co-pad-x: clamp(14px, 1.8vw, 22px);
--co-index: clamp(42px, 4.4vw, 58px);
--co-gap:   clamp(12px, 1.5vw, 20px);
--co-texte: calc(var(--co-pad-x) + var(--co-index) + var(--co-gap));
--co-mur: calc(var(--co-pad-x) + var(--co-index) + var(--co-gap) / 2);
--co-pas: 0.3s;
--co-courbe: cubic-bezier(0.24, 0.30, 0.16, 1);
--co-vif: 0.18s;
--co-cadre:    transparent;
--co-cadre-2:  transparent;
--co-rime:     transparent;
--co-fond:     transparent;
--co-bande:    transparent;
--co-filet:    rgba(10, 10, 11, 0.11);
--co-rail:     transparent;
--co-gouttiere: transparent;
--co-vive:     transparent;
--co-ouverte:  transparent;
--co-tiroir:   transparent;
--co-creux:    none;
--co-ombre:    none;
--co-marque:   var(--eclat);
--co-marque-2: rgba(10, 10, 11, 0.16);
--co-trace:    rgba(10, 10, 11, 0.34);
--co-galet:        transparent;
--co-galet-bord:   transparent;
--co-galet-encre:  var(--ash);
--co-galet-ombre:  none;
--co-galet-vif:       transparent;
--co-galet-vif-bord:  transparent;
--co-galet-vif-encre: var(--co-marque);
position: relative;
isolation: isolate;
border: 1px solid var(--co-cadre);
border-radius: var(--r-lg);
background-color: var(--co-fond);
box-shadow: var(--co-ombre),
inset 0 0 0 1px var(--co-rime),
inset 0 1px 0 var(--co-cadre-2);
overflow: visible;
transition: background-color var(--co-pas) var(--co-courbe),
border-color     var(--co-pas) var(--co-courbe),
box-shadow       var(--co-pas) var(--co-courbe);
}
.parcours {
--pa-gap: clamp(10px, 1.2vw, 14px);
--pa-pad: clamp(16px, 2vw, 24px);
--ar-gout:  clamp(26px, 3.2vw, 40px);
--ar-noeud: 9px;
--ar-y: calc(var(--pa-pad) + 6px);
--ar-trait: var(--co-trace);
--ar-vif:   var(--titre-accent, var(--co-marque));
max-width: 46rem;
}
@media (max-width: 560px) { .parcours { --pa-pad: 16px; --ar-gout: 24px; } }
.parcours__arbre {
display: flex;
flex-direction: column;
gap: var(--pa-gap);
padding: 4px 0 8px var(--ar-gout);
}
.etape::before {
content: '';
position: absolute;
left: calc(-1 * var(--ar-gout));
top: calc(var(--ar-y) - var(--ar-noeud) / 2);
width: var(--ar-noeud);
height: var(--ar-noeud);
box-sizing: border-box;
border: 1px solid var(--ar-trait);
border-radius: 50%;
transition: background-color var(--co-vif) var(--co-courbe),
border-color     var(--co-vif) var(--co-courbe);
}
.etape.est-ouverte::before {
border-color: var(--ar-vif);
background-color: var(--ar-vif);
}
.etape::after {
content: '';
position: absolute;
left: calc(-1 * var(--ar-gout) + var(--ar-noeud) / 2 - 0.5px);
top: calc(var(--ar-y) + var(--ar-noeud) / 2 + 3px);
bottom: calc(-1 * (var(--pa-gap) + var(--ar-y)) + var(--ar-noeud) / 2 + 3px);
width: 1px;
background-color: var(--ar-trait);
}
.etape:last-child::after { content: none; }
.parcours { --ar-pas: 0.55s; }
.parcours.est-pliable .etape::before {
opacity: 0;
transform: scale(0.5);
transition: opacity var(--ar-pas) var(--co-courbe),
transform var(--ar-pas) var(--co-courbe),
background-color var(--co-vif) var(--co-courbe),
border-color var(--co-vif) var(--co-courbe);
}
.parcours.est-pliable .etape::after {
transform: scaleY(0);
transform-origin: 0 0;
transition: transform var(--ar-pas) var(--co-courbe) 0.12s;
}
.parcours.est-pliable .etape.est-vue::before { opacity: 1; transform: scale(1); }
.parcours.est-pliable .etape.est-vue::after { transform: scaleY(1); }
.etape {
--bone: var(--bc-texte);
--ash: var(--bc-texte-2);
--titre-accent: var(--bc-accent);
--co-filet: var(--bc-filet);
--co-marque-2: var(--bc-filet);
--co-galet-encre: var(--bc-texte-2);
--gain: #4FC98A;
--perte: #E2706E;
--et-jour: radial-gradient(120% 80% at 18% 0%, var(--bc-lumiere), transparent 60%);
position: relative;
display: flex;
flex-direction: column;
box-sizing: border-box;
padding: var(--pa-pad);
border-radius: var(--r-lg);
color: var(--bc-texte);
background-image:
repeating-linear-gradient(0deg,
var(--bc-grain) 0 1px, var(--bc-grain-bas) 1px 3px),
var(--et-jour),
var(--bc-fond);
box-shadow:
inset 0 1px 0 var(--bc-reflet),
inset 0 0 0 1px var(--bc-bord),
inset 0 -1px 0 var(--bc-tranche),
0 14px 34px -20px rgba(var(--bc-ombre-rvb), var(--bc-ombre-a)),
0 2px 8px -4px rgba(var(--bc-ombre-rvb), 0.5);
}
.etape[data-ambiance="debut"] {
--et-jour: radial-gradient(90% 65% at 0% 108%, var(--bc-lumiere), transparent 52%);
}
.etape[data-ambiance="declic"] {
--et-jour: radial-gradient(110% 85% at 102% 24%, var(--bc-lumiere), transparent 58%);
}
.etape[data-ambiance="montee"] {
--et-jour: radial-gradient(175% 130% at 50% -14%, var(--bc-lumiere), transparent 78%);
}
.etape[data-ambiance="chute"] {
--et-jour: linear-gradient(180deg,
rgba(var(--bc-ombre-rvb), 0.5), rgba(var(--bc-ombre-rvb), 0) 60%),
radial-gradient(80% 50% at 50% 118%, var(--bc-lumiere), transparent 46%);
}
.etape[data-ambiance="aujourdhui"] {
--et-jour: radial-gradient(130% 92% at 12% -10%, var(--bc-lumiere), transparent 64%);
}
.etape__titre { margin: 0; }
.etape__ouvrir {
display: block;
width: 100%;
margin: 0;
padding: 0;
border: 0;
background: none;
text-align: left;
font: inherit;
color: inherit;
cursor: default;
}
.parcours.est-pliable .etape__ouvrir { cursor: pointer; }
.parcours.est-pliable .etape:not(.est-ouverte) { cursor: pointer; }
.etape__ouvrir:focus-visible {
outline: 2px solid var(--titre-accent, var(--co-marque));
outline-offset: 4px;
border-radius: 2px;
}
.etape__tete {
display: flex;
align-items: baseline;
gap: clamp(9px, 1.1vw, 14px);
margin-bottom: clamp(8px, 1vw, 12px);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
line-height: 1;
}
.etape__no {
font-weight: 500;
letter-spacing: 0.06em;
font-variant-numeric: tabular-nums;
color: var(--titre-accent, var(--co-marque));
}
.etape__jalon { font-style: normal; color: var(--co-galet-encre); opacity: 0.85; }
.etape__mot {
display: block;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: var(--tx-5);
line-height: 1.24;
letter-spacing: var(--k-sous);
color: var(--bone);
text-wrap: balance;
}
@media (max-width: 700px) {
.etape__mot { min-height: calc(2 * 1.24em); }
}
.etape__recit {
display: grid;
grid-template-rows: 1fr;
}
.etape__pli { overflow: hidden; min-height: 0; }
.etape__pli .acte__texte {
padding-top: clamp(6px, 0.8vw, 10px);
padding-bottom: clamp(10px, 1.2vw, 14px);
font-size: clamp(12.5px, 1.05vw, 13.5px);
}
.parcours.est-pliable .etape:not(.est-ouverte) .etape__recit {
grid-template-rows: 0fr;
}
.parcours.est-pliable .etape:not(.est-ouverte) .etape__pli .acte__texte {
opacity: 0;
}
.etape__ligne {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
margin: 0;
padding-top: clamp(10px, 1.2vw, 14px);
border-top: 1px solid var(--co-filet);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
line-height: 1;
}
.etape__age { color: var(--co-galet-encre); opacity: 0.5; }
.etape__somme {
font-size: var(--tx-2);
letter-spacing: var(--k-texte);
font-variant-numeric: tabular-nums;
text-transform: none;
white-space: nowrap;
color: var(--bone);
}
.acte__texte {
margin: 0;
font-size: var(--tx-3);
line-height: 1.68;
color: var(--ash);
transition: color var(--co-pas) var(--co-courbe);
}
.acte__texte .lede {
color: var(--bone);
font-weight: 500;
}
.dit { margin: 0; text-wrap: pretty; }
.dit + .dit { margin-top: 0.68em; }
.ph { display: block; }
.dit--tete {
color: var(--bone);
font-weight: 500;
letter-spacing: var(--k-texte);
}
.dit--cadence {
display: grid;
padding-left: clamp(11px, 1.3vw, 16px);
border-left: 1px solid var(--co-marque-2);
transition: border-color var(--co-pas) var(--co-courbe);
}
.dit + .dit--cadence,
.dit--cadence + .dit { margin-top: 0.74em; }
.dit--cadence span {
display: block;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 500;
font-size: 1.05em;
line-height: 1.3;
letter-spacing: var(--k-sous);
color: var(--bone);
}
.somme {
font-family: var(--f-mono);
font-weight: 400;
font-size: 0.95em;
letter-spacing: var(--k-texte);
color: var(--bone);
white-space: nowrap;
}
.recit {
--co-jour-x: 0%;
--co-jour-y: -12%;
--co-nuit-f: 0.06;
--co-jour-sombre: 10, 10, 11;
--co-jour-pas: 1s;
}
.recit[data-ambiance="debut"]      { --co-jour-x: -28%; --co-jour-y:  18%; --co-nuit-f: 0.080; }
.recit[data-ambiance="declic"]     { --co-jour-x:  30%; --co-jour-y:  -2%; --co-nuit-f: 0.075; }
.recit[data-ambiance="montee"]     { --co-jour-x:   2%; --co-jour-y: -26%; --co-nuit-f: 0.040; }
.recit[data-ambiance="chute"]      { --co-jour-x:   0%; --co-jour-y:  32%; --co-nuit-f: 0.180; }
.recit[data-ambiance="aujourdhui"] { --co-jour-x: -10%; --co-jour-y: -20%; --co-nuit-f: 0.070; }
.recit__jour {
position: absolute;
inset: 0;
z-index: -1;
overflow: hidden;
pointer-events: none;
}
.recit__jour::before {
content: '';
position: absolute;
left: -5%;
top: -15%;
width: 110%;
height: 130%;
transition: opacity   var(--co-jour-pas) ease-in-out,
transform var(--co-jour-pas) ease-in-out;
background-image: radial-gradient(ellipse closest-side at 50% 50%,
rgba(var(--co-jour-sombre), 0.85)  0%,
rgba(var(--co-jour-sombre), 0.36) 40%,
rgba(var(--co-jour-sombre), 0)    74%);
opacity: var(--co-nuit-f);
transform: translate3d(calc(var(--co-jour-x) * -1),
calc(var(--co-jour-y) * -1), 0);
}
@media (prefers-reduced-motion: reduce) {
.parcours { --co-pas: 0.01ms; --co-vif: 0.01ms; --ar-pas: 0.01ms; }
.recit    { --co-jour-pas: 0.01ms; }
}

.doc__corps { min-width: 0; max-width: var(--mesure); }
.doc__corps h2 {
position: relative;
scroll-margin-top: calc(84px + 22px);
}
.doc__ancre {
margin-left: 0.4em;
border: 0;
font-family: var(--f-mono);
font-size: 0.62em;
color: var(--ash);
opacity: 0.5;
transition: opacity 0.24s var(--ease), color 0.24s var(--ease);
}
.doc__corps h2:hover .doc__ancre,
.doc__ancre:hover,
.doc__ancre:focus-visible { opacity: 1; color: var(--rouge); }
.doc__ancre:hover { border: 0; }
.doc__corps h2:target::before {
content: '';
position: absolute;
left: -13px;
top: 0.12em;
bottom: 0.12em;
width: 2px;
border-radius: 2px;
background: var(--rouge);
animation: docVise 2.4s var(--ease) forwards;
}
@keyframes docVise {
0%   { opacity: 0; transform: scaleY(0.2); }
14%  { opacity: 1; transform: scaleY(1); }
70%  { opacity: 1; }
100% { opacity: 0.24; }
}
@media (prefers-reduced-motion: reduce) {
.doc__corps h2:target::before { animation: none; opacity: 1; }
}
@media (max-width: 620px) {
.doc__corps h2 { scroll-margin-top: calc(68px + 16px); }
}

.merci__intro { margin-left: auto; margin-right: auto; }
.recu {
max-width: 430px;
margin: clamp(22px, 3.4vw, 34px) auto 0;
padding: clamp(16px, 2.1vw, 22px) clamp(17px, 2.3vw, 24px)
clamp(13px, 1.7vw, 17px);
text-align: left;
border: 1px solid var(--line);
border-radius: var(--r-sm);
background: rgba(var(--gl-translucide, 255, 255, 255), 0.026);
}
.recu__tete {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 14px;
padding-bottom: clamp(11px, 1.5vw, 15px);
margin-bottom: clamp(11px, 1.5vw, 15px);
border-bottom: 1px solid var(--line);
}
.recu__nom {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-repere);
text-transform: uppercase;
color: var(--ash);
}
.recu__etat {
display: inline-flex;
align-items: center;
gap: 7px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--gain);
}
.recu__etat i {
width: 6px;
height: 6px;
border-radius: 50%;
background: currentColor;
box-shadow: 0 0 0 3px color-mix(in srgb, var(--gain) 16%, transparent);
}
.recu__lignes { margin: 0; }
.recu__ligne {
display: flex;
align-items: baseline;
gap: 8px;
padding: clamp(6px, 0.85vw, 9px) 0;
}
.recu__ligne dt {
flex: 0 0 auto;
font-size: var(--tx-2);
color: var(--ash);
}
.recu__ligne::after {
content: '';
order: 1;
flex: 1 1 auto;
min-width: 18px;
height: 0;
transform: translateY(-0.24em);
border-bottom: 1px dotted var(--line);
}
.recu__ligne dd {
order: 2;
flex: 0 0 auto;
margin: 0;
font-family: var(--f-mono);
font-size: var(--tx-2);
letter-spacing: var(--k-serre);
font-variant-numeric: tabular-nums;
color: var(--bone);
}
.recu__ligne--fort { padding-top: clamp(8px, 1vw, 11px); }
.recu__ligne--fort dt { color: var(--bone); }
.recu__ligne--fort dd {
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-5);
letter-spacing: var(--k-bloc);
}
.recu__ligne--date {
margin-top: clamp(6px, 0.9vw, 9px);
padding-top: clamp(11px, 1.5vw, 14px);
border-top: 1px solid var(--line);
}
.recu__ligne--date dd { color: var(--ash); }
.recu__ligne--date dd span {
margin-left: 0.6em;
padding-left: 0.6em;
border-left: 1px solid var(--line);
opacity: 0.8;
}
.recu__pied {
margin: clamp(12px, 1.6vw, 16px) 0 0;
font-size: var(--tx-1);
line-height: 1.6;
color: var(--ash);
opacity: 0.82;
}
.suite__nom {
margin: 0 0 clamp(16px, 2.2vw, 22px);
text-align: left;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-repere);
text-transform: uppercase;
color: var(--ash);
}
.suite {
list-style: none;
margin: 0;
padding: 0;
text-align: left;
}
.suite__pas {
position: relative;
display: grid;
grid-template-columns: clamp(74px, 9vw, 104px) 1px minmax(0, 1fr);
gap: clamp(14px, 2vw, 24px);
padding: clamp(13px, 1.8vw, 19px) 0;
}
.suite__pas + .suite__pas { border-top: 1px solid var(--line); }
.suite__quand {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
line-height: 1.7;
color: var(--ash);
white-space: nowrap;
}
.suite__fil {
position: relative;
width: 1px;
background: var(--line);
margin: -1px 0 -1px;
}
.suite__fil::before {
content: '';
position: absolute;
left: 50%;
top: calc(clamp(13px, 1.8vw, 19px) * 0 + 0.62em);
width: 7px;
height: 7px;
margin-left: -3.5px;
border-radius: 50%;
border: 1px solid var(--line);
background: var(--ink, transparent);
}
.suite__quoi {
font-size: var(--tx-3);
line-height: 1.7;
color: var(--ash);
}
.suite__quoi strong { color: var(--bone); font-weight: 500; }
.suite__pas.est-vif .suite__quand { color: var(--rouge); }
.suite__pas.est-vif .suite__fil::before {
border-color: var(--rouge);
background: var(--rouge);
box-shadow: 0 0 0 4px color-mix(in srgb, var(--rouge) 14%, transparent);
}
.suite__pas.est-vif .suite__quoi { color: var(--bone); }
.suite__cta { margin-top: clamp(38px, 6vw, 58px); }
@media (max-width: 560px) {
.suite__pas {
grid-template-columns: minmax(0, 1fr);
gap: 5px;
}
.suite__fil { display: none; }
.suite__quand { font-size: var(--tx-1); }
.suite__pas.est-vif .suite__quand::before {
content: '';
display: inline-block;
width: 6px;
height: 6px;
margin-right: 7px;
border-radius: 50%;
background: var(--rouge);
vertical-align: 0.1em;
}
.recu { max-width: none; }
}

body.app {
--id-fond:      #08080A;
--id-fond-rvb:  8, 8, 10;
--id-surface:   #111116;
--id-surface-2: #1A1A21;
--id-voile-rvb: 237, 234, 227;
--id-bord:      rgba(237, 234, 227, 0.13);
--id-bord-2:    rgba(237, 234, 227, 0.21);
--id-filet:     rgba(237, 234, 227, 0.13);
--id-texte:     #EDEAE3;
--id-texte-2:   #9B9BA3;
--id-profond:   #5A0E0E;
--id-nuit:     #DD0000;
--id-nuit-rvb: 221, 0, 0;
--id-jour:     #990000;
--id-jour-rvb: 153, 0, 0;
--id-encre: #FFFFFF;
--id-hiver:   #0C1926;
--id-hiver-2: #15242F;
--ap-accent:     var(--id-nuit);
--ap-accent-rvb: var(--id-nuit-rvb);
--ap-encre:      var(--id-encre);
--ap-etq:        var(--ash);
--rouge-titre: var(--id-nuit);
--bone: var(--id-texte, #EDEAE3);
--ash:  var(--id-texte-2, #9B9BA3);
--line: var(--id-filet, rgba(237, 234, 227, 0.13));
--ink:  var(--id-fond, #0A0A0B);
--eclat:     var(--id-texte, #EDEAE3);
--eclat-rvb: var(--id-voile-rvb, 237, 234, 227);
--eclat-voile: rgba(var(--id-voile-rvb, 237, 234, 227), 0.15);
--eclat-lueur: rgba(var(--id-voile-rvb, 237, 234, 227), 0.36);
--ap-vers-sol-rvb:  230, 230, 228;
--ap-vers-ciel-rvb: var(--id-fond-rvb, 10, 10, 11);
--ap-vers-nuit-rvb: var(--id-fond-rvb, 10, 10, 11);
--ap-voile: var(--id-fond, #0A0A0B);
--f-display: 'Bricolage Grotesque', 'Archivo', 'Helvetica Neue', Arial, sans-serif;
--f-titre:   'Bricolage Grotesque', 'Archivo', 'Helvetica Neue', Arial, sans-serif;
--f-mono:    'Space Mono', 'DM Mono', ui-monospace, 'SFMono-Regular', monospace;
--ap-e-1: clamp(10px, 1.2vw, 14px);
--ap-e-2: var(--air-4);
--ap-e-3: var(--air-6);
background: var(--ap-voile);
color: var(--bone);
}
.ap-cadre {
width: min(1140px, calc(100% - var(--marge-g) - var(--marge-d)));
margin-inline: auto;
}
.ap-ciel {
--fond-c:      var(--id-fond, #0A0A0B);
--fond-img:    none;
--fond-taille: auto;
--fond-rep:    repeat;
--carte-fond:  var(--pose);
--carte-bord:  var(--line);
--carte-ombre: var(--lueur-haut);
--ap-btn-plein-txt: #0A0A0B;
color: var(--bone);
}
.ap-sol {
--bone: #101013;
--ash:  #4E4E56;
--line: rgba(10, 10, 11, 0.22);
--ink:  #EDEDEB;
--eclat:       #101013;
--eclat-vif:   #2C2C31;
--eclat-voile: rgba(10, 10, 11, 0.12);
--eclat-lueur: rgba(10, 10, 11, 0.26);
--gain:  #0A5730;
--perte: #990000;
--rouge: #990000;
--rouge-titre: var(--id-jour);
--ap-accent:     var(--id-jour);
--ap-accent-rvb: var(--id-jour-rvb);
--ap-encre:      #FFFFFF;
--ap-etq: var(--id-jour);
--fond-c: var(--acier);
--fond-img:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)' opacity='0.055'/%3E%3C/svg%3E"),
linear-gradient(180deg,
var(--acier-haut)  0%,
var(--acier-clair) 30%,
var(--acier)       62%,
var(--acier-bas)   86%,
var(--acier-haut)  100%);
--fond-taille: 200px 200px, 100% 1100px;
--fond-rep:    repeat, repeat-y;
--carte-fond:  rgba(255, 255, 255, 0.86);
--carte-bord:  var(--line);
--carte-ombre: var(--ombre-plaque);
--ap-btn-plein-txt: #F2F2F0;
color: var(--bone);
}
.ap-ecran {
position: relative;
z-index: 1;
padding-block: var(--air-7);
background-color: var(--fond-c);
background-image:  var(--fond-img);
background-size:   var(--fond-taille);
background-repeat: var(--fond-rep);
}
.app .foot { margin-top: -1px; border-top-color: transparent; }
body.app.page--a {
--id-nuit:     #649BDE;
--id-nuit-rvb: 100, 155, 222;
--id-jour:     #134A93;
--id-jour-rvb: 19, 74, 147;
--id-encre:    #0A0A0B;
}
body.app.page--b {
--id-nuit:     #DA7A86;
--id-nuit-rvb: 218, 122, 134;
--id-jour:     #7B1E2B;
--id-jour-rvb: 123, 30, 43;
--id-encre:    #0A0A0B;
}
body.app.page--c {
--id-nuit:     #6BC078;
--id-nuit-rvb: 107, 192, 120;
--id-jour:     #1F5C2E;
--id-jour-rvb: 31, 92, 46;
--id-encre:    #0A0A0B;
}
.ap-heros {
position: relative;
z-index: 1;
display: flex;
align-items: flex-end;
min-height: min(78svh, 780px);
padding-block: calc(76px + var(--air-7)) var(--air-7);
background-color: var(--fond-c);
background-image:  var(--fond-img);
background-size:   var(--fond-taille);
background-repeat: var(--fond-rep);
}
.ap-heros__corps {
position: relative;
z-index: 1;
}
.app .chapter__label::before { content: attr(data-nom); }
.app .chapter__label:empty:not([data-nom]) { display: none; }
.ap-heros .chapter { flex-wrap: wrap; row-gap: 8px; }
.ap-heros__etq {
font-family: var(--f-mono);
font-size: var(--tx-2);
letter-spacing: var(--k-repere);
text-transform: uppercase;
color: var(--ash);
white-space: nowrap;
}
.ap-heros__titre {
margin: 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-10);
line-height: var(--i-phare);
letter-spacing: var(--k-phare);
color: var(--ash);
text-wrap: balance;
}
.ap-heros__titre em {
display: block;
font-style: normal;
color: var(--rouge-titre);
}
.ap-heros__intro {
margin: var(--air-4) 0 0;
max-width: 54ch;
font-size: var(--tx-4);
line-height: 1.68;
color: var(--ash);
}
body.app { scroll-padding-top: 76px; }
.ap-chapitre { margin-bottom: var(--air-6); }
.ap-chapitre .chapter {
margin-bottom: clamp(22px, 3vw, 36px);
}
.ap-titre {
margin: 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-9);
line-height: var(--i-phare);
letter-spacing: var(--k-phare);
color: var(--bone);
text-wrap: balance;
}
.ap-titre em {
font-style: normal;
color: var(--rouge-titre);
}
.ap-chapitre__mot {
margin: var(--air-4) 0 0;
max-width: var(--mesure);
font-size: var(--tx-3);
line-height: 1.7;
color: var(--ash);
}
.ap-chapitre__mot strong { color: var(--bone); font-weight: 500; }
.ap-grille {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
gap: clamp(8px, 1vw, 12px);
}
.ap-carte {
position: relative;
padding: clamp(12px, 1.5vw, 17px) clamp(13px, 1.6vw, 18px);
border: 1px solid var(--carte-bord);
border-radius: var(--r-sm);
background: var(--carte-fond);
box-shadow: var(--carte-ombre);
}
.ap-carte__etq {
display: block;
margin-bottom: 7px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ap-etq);
}
.ap-carte__etq::before {
content: '';
display: inline-block;
width: 9px;
height: 2px;
margin-right: 8px;
vertical-align: 3px;
background: var(--ap-accent);
}
.ap-carte__titre {
margin: 0 0 5px;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: var(--tx-5);
letter-spacing: var(--k-sous);
color: var(--bone);
}
.ap-carte__texte {
margin: 0;
font-size: var(--tx-3);
line-height: 1.68;
color: var(--ash);
}
.ap-carte__texte strong,
.ap-carte__texte b { color: var(--bone); font-weight: 500; }
.ap-carte__texte a {
color: var(--bone);
border-bottom: 1px solid var(--line);
}
.interieure .ap-carte.ap-carte--regle {
--ca-x: clamp(12px, 1.5vw, 16px);
display: flex;
flex-direction: column;
padding: 0;
overflow: hidden;
}
.ap-carte--regle .ap-carte__tete {
padding: clamp(11px, 1.4vw, 14px) var(--ca-x) clamp(12px, 1.5vw, 16px);
background: color-mix(in srgb, var(--bone) 5%, transparent);
border-bottom: 1px solid var(--line);
}
.ap-ciel .ap-carte--regle .ap-carte__etq { color: var(--bone); }
.ap-carte--regle .ap-carte__etq { margin-bottom: 9px; }
.ap-carte--regle .ap-carte__titre {
margin: 0;
line-height: 1.22;
text-wrap: balance;
}
.interieure .ap-carte--regle .ap-carte__note {
flex: 1 1 auto;
margin: 0;
padding: clamp(10px, 1.2vw, 13px) var(--ca-x) clamp(11px, 1.4vw, 15px);
border: 0;
font-size: var(--tx-2);
line-height: 1.58;
color: var(--ash);
}
.ap-pas {
position: relative;
list-style: none;
margin: 0;
padding: 0;
}
.ap-pas::before {
content: '';
position: absolute;
left: 17px;
top: 10px;
bottom: 10px;
width: 1px;
background: var(--line);
}
.ap-pas::after {
content: '';
position: absolute;
left: 17px;
top: 10px;
height: calc(var(--trace, 0%) * 0.96);
max-height: calc(100% - 20px);
width: 1px;
background: var(--ap-accent);
}
.ap-pas > li {
position: relative;
display: grid;
grid-template-columns: minmax(36px, max-content) minmax(0, 1fr);
gap: clamp(12px, 1.6vw, 20px);
padding: clamp(12px, 1.5vw, 16px) 0;
}
.ap-pas__borne {
position: relative;
z-index: 1;
align-self: start;
justify-self: start;
display: inline-grid;
place-items: center;
min-width: 36px;
height: 36px;
padding: 0 10px;
border: 1px solid var(--line);
border-radius: 999px;
background: var(--fond-c);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: 0.04em;
font-variant-numeric: tabular-nums;
white-space: nowrap;
color: var(--bone);
}
li.est-atteint .ap-pas__borne {
border-color: var(--ap-accent);
color: var(--ap-accent);
}
.ap-ciel li.est-atteint .ap-pas__borne { color: var(--eclat); }
.ap-pas__quoi {
font-size: var(--tx-3);
line-height: 1.7;
color: var(--ash);
max-width: var(--mesure);
}
.ap-pas__quoi strong { color: var(--bone); font-weight: 500; }
.ap-pas__titre {
display: block;
margin: 4px 0 6px;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: var(--tx-5);
letter-spacing: var(--k-sous);
color: var(--bone);
}
.ap-pas__an {
display: inline-block;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-repere);
text-transform: uppercase;
color: var(--ap-etq);
}
.ap-details {
border: 0;
border-top: 1px solid var(--line);
border-radius: 0;
background: none;
box-shadow: none;
}
.ap-details + .ap-details { margin-top: 0; }
.ap-details:last-of-type { border-bottom: 1px solid var(--line); }
.ap-details__q {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: clamp(8px, 1vw, 11px) 2px;
cursor: pointer;
list-style: none;
font-size: var(--tx-3);
color: var(--bone);
font-weight: 500;
}
.ap-details__q::-webkit-details-marker { display: none; }
.ap-details__q::after {
content: '';
flex: 0 0 auto;
width: 11px;
height: 11px;
background:
linear-gradient(var(--ap-accent), var(--ap-accent)) 50% 50% / 11px 1.5px no-repeat,
linear-gradient(var(--ap-accent), var(--ap-accent)) 50% 50% / 1.5px 11px no-repeat;
transition: transform 0.3s var(--ease);
}
.ap-details[open] > .ap-details__q::after { transform: rotate(45deg); }
.ap-details__r {
padding: 0 2px clamp(8px, 1vw, 11px);
font-size: var(--tx-3);
line-height: 1.65;
color: var(--ash);
max-width: 58ch;
}
.ap-details__r strong { color: var(--bone); font-weight: 500; }
.ap-details__r a { color: var(--bone); border-bottom: 1px solid var(--line); }
.ap-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
min-height: 40px;
padding: 0 clamp(16px, 2.1vw, 22px);
border: 1px solid transparent;
border-radius: var(--r-sm);
font-family: var(--f-mono);
font-size: var(--tx-2);
letter-spacing: var(--k-serre);
text-transform: uppercase;
white-space: nowrap;
cursor: pointer;
transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease),
background 0.25s var(--ease), color 0.25s var(--ease);
}
.ap-btn:active { transform: scale(0.98); }
.ap-btn svg { flex: 0 0 auto; }
.ap-btn--plein {
background: var(--bone);
color: var(--ap-btn-plein-txt, #0A0A0B);
box-shadow: 0 16px 38px -18px rgba(0, 0, 0, 0.55);
}
.ap-btn--plein:hover,
.ap-btn--plein:focus-visible { box-shadow: 0 18px 44px -16px rgba(0, 0, 0, 0.6); }
.ap-btn--accent {
background: var(--ap-accent);
color: var(--ap-encre, #FFFFFF);
box-shadow: 0 16px 38px -16px rgba(var(--ap-accent-rvb), 0.5);
}
.ap-btn--accent:hover,
.ap-btn--accent:focus-visible { filter: brightness(1.08); }
.ap-btn--ligne {
border-color: var(--line);
color: var(--bone);
background: transparent;
}
.ap-btn--ligne:hover,
.ap-btn--ligne:focus-visible { border-color: var(--ash); }
.ap-mention {
margin: 10px 0 0;
font-size: var(--tx-2);
line-height: 1.6;
color: var(--ash);
}
.ap-mention a { color: var(--bone); border-bottom: 1px solid var(--line); }
.ap-duo {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
gap: clamp(10px, 1.3vw, 16px);
}
.ap-duo__part { padding: 0; overflow: hidden; }
.ap-duo__tete {
display: flex;
align-items: center;
gap: 9px;
padding: clamp(12px, 1.6vw, 15px) clamp(16px, 2vw, 22px);
border-bottom: 1px solid var(--line);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-repere);
text-transform: uppercase;
color: var(--ash);
}
.ap-duo__tete--toi { color: var(--ap-etq); }
.ap-duo__tete--toi::before {
content: '';
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--ap-accent);
}
.ap-duo__liste {
list-style: none;
margin: 0;
padding: clamp(8px, 1vw, 12px) clamp(16px, 2vw, 22px) clamp(14px, 1.8vw, 18px);
}
.ap-duo__liste li {
position: relative;
padding: clamp(8px, 1.1vw, 11px) 0 clamp(8px, 1.1vw, 11px) 18px;
font-size: var(--tx-3);
line-height: 1.66;
color: var(--ash);
}
.ap-duo__liste li + li { border-top: 1px solid var(--line); }
.ap-duo__liste li::before {
content: '';
position: absolute;
left: 0;
top: calc(clamp(8px, 1.1vw, 11px) + 0.72em);
width: 9px;
height: 1px;
background: var(--ap-accent);
}
.ap-duo__liste strong { color: var(--bone); font-weight: 500; }
.interieure .ap-piste + .ap-duo,
.interieure .ap-piste + .ap-mention,
.interieure .ap-piste + .ap-chapitre__mot {
margin-top: clamp(20px, 2.4vw, 30px);
padding-top: clamp(17px, 2vw, 24px);
border-top: 1px solid var(--line);
}
.ap-exergue {
margin: 0;
padding: clamp(4px, 0.5vw, 6px) 0 clamp(4px, 0.5vw, 6px) clamp(18px, 2.4vw, 26px);
border-left: 2px solid var(--ap-accent);
max-width: 46ch;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: var(--tx-5);
line-height: 1.42;
letter-spacing: var(--k-sous);
color: var(--bone);
text-wrap: pretty;
}
.ap-fin {
padding: clamp(18px, 2.2vw, 26px) clamp(15px, 1.9vw, 22px);
border: 1px solid var(--carte-bord);
border-radius: var(--r-sm);
background: var(--carte-fond);
box-shadow: var(--carte-ombre);
}
.ap-fin__titre {
margin: 0 0 8px;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-7);
line-height: 1.1;
letter-spacing: var(--k-titre);
color: var(--bone);
}
.ap-fin__mot {
margin: 0 0 var(--air-4);
max-width: 52ch;
font-size: var(--tx-3);
line-height: 1.7;
color: var(--ash);
}
.ap-fin__actions {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 12px;
}
body.app .reveal {
opacity: 1;
transform: none;
transition: none;
animation: none;
}
@media (scripting: none) {
.app .chapter__rule { transform: none; transition: none; }
}
@media (prefers-reduced-motion: reduce) {
.app .chapter__rule { transform: none; transition: none; }
}
@media (max-width: 720px) {
.ap-heros { min-height: min(70svh, 640px); }
.ap-heros__titre { font-size: clamp(34px, 10vw, 44px); }
.ap-fin__actions { flex-direction: column; align-items: stretch; }
.ap-fin__actions .ap-btn { width: 100%; }
}
.ap-heros__maj {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
white-space: nowrap;
}
.ap-piste {
position: relative;
min-width: 0;
max-width: 100%;
}
.swiper.ap-piste {
display: block;
margin-inline: 0;
width: 100%;
}
.ap-piste .swiper-pagination.swiper-pagination-lock { display: none; }
.ap-piste:has([data-piste="prec"].swiper-button-disabled):has([data-piste="suiv"].swiper-button-disabled)
.ap-piste__cap { display: none; }
.ap-piste:not(.swiper-initialized) .ap-piste__liste {
display: grid;
gap: clamp(8px, 1vw, 12px);
grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
align-items: stretch;
list-style: none;
margin: 0;
padding: 0;
}
.ap-piste.swiper-initialized { overflow: hidden; }
.ap-piste.swiper-initialized .ap-piste__liste {
display: flex;
list-style: none;
margin: 0;
padding: 0;
align-items: stretch;
}
.ap-piste.swiper-initialized .swiper-slide {
flex: 0 0 auto;
height: auto;
width: clamp(238px, 80%, 322px);
display: flex;
flex-direction: column;
}
.ap-piste.swiper-initialized .swiper-slide > * { width: 100%; }
.ap-piste .swiper-pagination {
position: static;
display: flex;
justify-content: center;
gap: 7px;
padding: 13px 0 2px;
}
.ap-piste:not(.swiper-initialized) .swiper-pagination { display: none; }
.ap-piste .swiper-pagination-bullet {
width: 6px;
height: 6px;
border-radius: var(--r-pill);
background: var(--line);
opacity: 1;
transition: width 0.35s var(--ease), background 0.35s var(--ease);
}
.ap-piste .swiper-pagination-bullet-active {
width: 22px;
border-radius: 4px;
background: var(--ap-accent);
}
.ap-piste__cap {
display: none;
gap: 6px;
justify-content: flex-end;
margin-bottom: 9px;
}
.ap-piste.swiper-initialized .ap-piste__cap { display: flex; }
.ap-piste__fl {
display: inline-flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
padding: 0;
border: 1px solid var(--line);
border-radius: var(--r-sm);
background: none;
color: var(--ash);
cursor: pointer;
transition: color 0.3s var(--ease), border-color 0.3s var(--ease),
opacity 0.3s var(--ease);
}
.ap-piste__fl:hover,
.ap-piste__fl:focus-visible { color: var(--bone); border-color: var(--ash); }
.ap-piste__fl.swiper-button-disabled { opacity: 0.34; cursor: default; }
.ap-piste__fl svg { width: 13px; height: 13px; }
@media (hover: none), (max-width: 700px) {
.ap-piste.swiper-initialized .ap-piste__cap { display: none; }
}
.app .phrase { display: block; }
.app .phrase + .phrase { margin-top: 3px; }
body.app main > section + section {
border-top: 1px solid var(--ap-trait, var(--line));
}
body.app .ap-ciel { --ap-trait: rgba(237, 234, 227, 0.20); }
body.app .ap-sol  { --ap-trait: rgba(10, 10, 11, 0.22); }
html.est-froid body.app .ap-ciel { --ap-trait: rgba(11, 15, 20, 0.18); }
html.est-froid body.app .ap-sol  { --ap-trait: rgba(11, 15, 20, 0.16); }
body.app .chapter__rule {
background-image: linear-gradient(90deg,
color-mix(in srgb, var(--bone) 24%, transparent), transparent);
background-size: 100% 100%;
background-position: 0 0;
}

body.page--hub .hub-sec {
padding-block: clamp(34px, 4.2vw, 58px);
}
body.page--hub .ap-cadre {
width: min(900px, calc(100% - var(--marge-g) - var(--marge-d)));
}
body.page--hub .hub-sec--tete {
padding-top: calc(76px + clamp(30px, 3.6vw, 52px));
}
body.page--hub .hub-kick {
display: block;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
body.page--hub .hub-titre {
margin: clamp(16px, 2vw, 26px) 0 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: clamp(34px, 5.4vw, 62px);
line-height: 1.02;
letter-spacing: var(--k-phare);
color: var(--bone);
text-wrap: balance;
}
body.page--hub .hub-titre em {
display: block;
margin-top: clamp(10px, 1.2vw, 16px);
font-family: var(--f-body);
font-style: normal;
font-variation-settings: normal;
font-weight: 400;
font-size: clamp(15px, 1.5vw, 20px);
line-height: 1.3;
letter-spacing: var(--k-sous);
color: var(--ash);
}
body.page--hub .hub-lead {
margin: clamp(18px, 2.2vw, 28px) 0 0;
max-width: 54ch;
font-size: var(--tx-4);
line-height: 1.5;
color: var(--ash);
text-wrap: pretty;
}
body.page--hub .chap {
display: flex;
align-items: center;
gap: clamp(11px, 1.6vw, 17px);
margin-bottom: clamp(24px, 3vw, 40px);
}
body.page--hub .chap__lab {
font-family: var(--f-mono);
font-size: var(--tx-2);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--bone);
white-space: nowrap;
}
body.page--hub .chap__filet {
flex: 1;
height: 1px;
background: linear-gradient(90deg,
color-mix(in srgb, var(--bone) 24%, transparent), transparent);
}
body.page--hub .pk { margin-top: 0; }
body.page--hub .pk__nom {
align-self: end;
margin-top: 0;
margin-bottom: 9px;
font-size: var(--tx-1);
color: color-mix(in srgb, currentColor 62%, transparent);
}
body.page--hub .pk__val {
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: clamp(22px, 2.3vw, 32px);
letter-spacing: -0.022em;
font-variant-numeric: normal;
white-space: normal;
}
body.page--hub .pk__note {
margin-top: 10px;
font-size: var(--tx-2);
}
@media (max-width: 900px) {
body.page--hub .pk__no { grid-row: 1 / span 3; }
body.page--hub .pk__nom { align-self: start; margin-bottom: 4px; }
body.page--hub .pk__val { font-size: 21px; }
body.page--hub .pk__note { margin-top: 5px; }
}
body.page--hub .hub-tete-sec {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: clamp(16px, 3vw, 40px);
flex-wrap: wrap;
}
body.page--hub .hub-h2 {
margin: 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: clamp(22px, 3.2vw, 36px);
line-height: 1.1;
letter-spacing: var(--k-titre);
color: var(--bone);
text-wrap: balance;
}
body.page--hub .hub-mot {
margin: 0;
max-width: 40ch;
font-size: var(--tx-2);
line-height: 1.45;
color: var(--ash);
text-wrap: pretty;
}
body.page--hub .hub-ech {
position: relative;
margin: clamp(30px, 4vw, 48px) 0 0;
height: 66px;
}
body.page--hub .hub-ech__rail {
position: absolute;
left: 0;
right: 0;
top: 33px;
height: 1px;
background: var(--line);
}
body.page--hub .hub-ech__plein {
position: absolute;
left: 0;
top: 0;
height: 1px;
width: 0;
background: linear-gradient(90deg, transparent, var(--ash) 18%, var(--bone));
transition: width 1.15s var(--ease);
}
body.page--hub .hub-ech.is-in .hub-ech__plein { width: 100%; }
body.page--hub .hub-ech__m {
position: absolute;
top: 0;
left: var(--part, 0%);
transform: translateX(-50%);
text-align: center;
white-space: nowrap;
}
body.page--hub .hub-ech__m--fin {
transform: translateX(-100%);
text-align: right;
}
body.page--hub .hub-ech__nom {
display: block;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: var(--tx-2);
letter-spacing: var(--k-sous);
color: var(--bone);
}
body.page--hub .hub-ech__pt {
display: block;
width: 7px;
height: 7px;
margin: 12px auto 0;
border-radius: 50%;
background: var(--bone);
transform: scale(0);
transition: transform 0.5s var(--ease) var(--d, 0s);
}
body.page--hub .hub-ech__m--fin .hub-ech__pt { margin-right: 0; }
body.page--hub .hub-ech.is-in .hub-ech__pt { transform: scale(1); }
body.page--hub .hub-ech__val {
display: block;
margin-top: 11px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-texte);
font-variant-numeric: tabular-nums;
color: var(--ash);
}
body.page--hub .hub-ech__lg {
margin: 14px 0 0;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-serre);
text-transform: uppercase;
color: var(--ash);
}
@media (scripting: none), (prefers-reduced-motion: reduce) {
body.page--hub .hub-ech__plein { width: 100%; transition: none; }
body.page--hub .hub-ech__pt { transform: scale(1); transition: none; }
}
.ap-portes { position: relative; overflow: hidden; margin-top: clamp(26px, 3.4vw, 40px); }
.ap-portes:not(.swiper-initialized) {
width: min(900px, calc(100% - var(--marge-g) - var(--marge-d)));
margin-inline: auto;
}
.ap-portes__liste {
list-style: none;
margin: 0;
padding: 0;
}
.ap-portes:not(.swiper-initialized) .ap-portes__liste {
display: flex;
flex-direction: column;
gap: clamp(10px, 1.3vw, 16px);
}
@media (min-width: 881px) {
.ap-portes:not(.swiper-initialized) .ap-portes__liste {
flex-direction: row;
align-items: stretch;
}
}
.ap-portes:not(.swiper-initialized) .ap-porte { height: auto; }
.ap-portes .ap-porte { display: flex; }
.ap-porte {
position: relative;
min-width: 0;
flex: 1 1 0;
transition: flex-grow 0.72s var(--ease);
}
.ap-porte__lien {
position: relative;
display: flex;
width: 100%;
overflow: hidden;
border: 1px solid var(--carte-bord);
border-radius: var(--r-sm);
background: var(--carte-fond);
box-shadow: var(--carte-ombre);
text-decoration: none;
color: var(--bone);
outline-offset: 3px;
transition: box-shadow 0.5s var(--ease), border-color 0.5s var(--ease);
}
.ap-porte__lien:hover,
.ap-porte__lien:focus-visible {
--carte-etat-bord: color-mix(in srgb, var(--ap-accent) 45%, transparent);
}
@media (hover: hover) and (pointer: fine) and (min-width: 881px) {
.ap-portes__liste:has(.ap-porte__lien:hover) .ap-porte:has(.ap-porte__lien:hover),
.ap-portes__liste:has(.ap-porte__lien:focus-visible) .ap-porte:has(.ap-porte__lien:focus-visible) {
flex-grow: 1.32;
}
}
.ap-porte__corps {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
width: 100%;
min-width: clamp(200px, 19vw, 280px);
padding: 0;
}
.ap-porte__id {
display: block;
padding: clamp(12px, 1.4vw, 16px) clamp(13px, 1.5vw, 18px) clamp(11px, 1.3vw, 15px);
}
.ap-porte__etq {
display: block;
margin-bottom: 4px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-serre);
text-transform: uppercase;
color: var(--ap-etq);
}
.ap-porte__titre {
margin: 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-6);
line-height: 1.1;
letter-spacing: var(--k-titre);
color: var(--bone);
}
.ap-porte__phare {
display: block;
padding: clamp(11px, 1.3vw, 15px) clamp(12px, 1.4vw, 17px) clamp(12px, 1.4vw, 16px);
background: var(--ph-creux, rgba(0, 0, 0, 0.30));
border-top: 1px solid var(--line);
border-bottom: 1px solid var(--line);
box-shadow: inset 0 1px 4px var(--ph-creux-ombre, rgba(0, 0, 0, 0.35));
}
.ap-porte__phare b {
display: block;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: clamp(29px, 3.2vw, 40px);
line-height: 1.04;
letter-spacing: var(--k-phare);
font-variant-numeric: tabular-nums;
background: linear-gradient(180deg, var(--ph-a, #FFFFFF), var(--ph-b, #8E97A2));
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.ap-porte__phare > span {
display: block;
margin-top: 5px;
max-width: 40ch;
font-size: var(--tx-1);
line-height: 1.4;
letter-spacing: var(--k-texte);
text-transform: none;
color: var(--ash);
text-wrap: pretty;
}
.ap-porte__reperes {
margin: 0;
padding: 4px clamp(12px, 1.4vw, 17px);
font-family: var(--f-mono);
font-size: var(--tx-1);
}
.ap-porte__reperes > div {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 10px;
padding: 5px 0;
border-bottom: 1px solid var(--line);
}
.ap-porte__reperes > div:last-child { border-bottom: 0; }
.ap-porte__reperes dt {
letter-spacing: var(--k-serre);
text-transform: uppercase;
color: var(--ash);
}
.ap-porte__reperes dd {
margin: 0;
font-weight: 700;
font-variant-numeric: tabular-nums;
letter-spacing: var(--k-texte);
color: var(--bone);
text-align: right;
}
.ap-porte__texte {
margin: 0;
padding: clamp(9px, 1.1vw, 13px) clamp(13px, 1.5vw, 18px) clamp(12px, 1.4vw, 16px);
max-width: 46ch;
font-size: var(--tx-2);
line-height: 1.45;
color: var(--ash);
}
.ap-porte__cta {
display: flex;
align-items: center;
gap: 8px;
margin-top: auto;
padding: clamp(10px, 1.2vw, 14px) clamp(12px, 1.4vw, 17px) clamp(12px, 1.4vw, 16px);
border-top: 1px solid var(--line);
font-family: var(--f-mono);
font-size: var(--tx-1);
font-weight: 700;
letter-spacing: var(--k-serre);
text-transform: uppercase;
color: var(--bone);
}
.ap-porte__cta svg { flex: 0 0 auto; color: var(--ap-accent); transition: transform 0.42s var(--ease); }
.ap-porte__lien:hover .ap-porte__cta svg,
.ap-porte__lien:focus-visible .ap-porte__cta svg { transform: translateX(5px); }
@media (max-width: 880px) {
.ap-porte__corps { min-width: 0; }
}
.ap-portes .swiper-pagination {
position: static;
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
padding: 10px 0 2px;
color: var(--bone);
}
.ap-portes .swiper-pagination-bullet {
width: 20px;
height: 2px;
margin: 0;
border-radius: 0;
background: currentColor;
opacity: 0.22;
transition: opacity 0.3s var(--ease), background 0.3s var(--ease);
}
.ap-portes .swiper-pagination-bullet-active {
opacity: 1;
background: var(--ap-accent);
}
.ap-portes.swiper-initialized { padding-inline: var(--marge-g) var(--marge-d); }
.ap-portes.swiper-initialized .swiper-wrapper { align-items: stretch; }
.ap-portes.swiper-initialized .ap-porte {
flex: 0 0 auto;
transition: none;
}
.ap-portes.swiper-initialized .swiper-slide { height: auto; }
body.page--hub .hub-fin {
display: flex;
align-items: center;
justify-content: space-between;
gap: clamp(18px, 3vw, 44px);
flex-wrap: wrap;
}
body.page--hub .hub-fin__mot {
margin: 0;
max-width: 42ch;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: clamp(17px, 2vw, 24px);
line-height: 1.25;
letter-spacing: var(--k-bloc);
color: var(--bone);
text-wrap: balance;
}
body.page--hub .hub-cta {
display: inline-flex;
align-items: center;
gap: 9px;
padding: 14px 22px;
border-radius: var(--r-sm, 12px);
background: var(--bone);
color: var(--hub-cta-txt, var(--ap-btn-plein-txt, #0A0A0B));
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-4);
letter-spacing: var(--k-sous);
text-decoration: none;
white-space: nowrap;
outline-offset: 3px;
transition: box-shadow 0.42s var(--ease), transform 0.2s var(--ease);
}
body.page--hub .ap-sol { --hub-cta-txt: #F2F2F0; }
html.est-froid body.page--hub .ap-sol { --hub-cta-txt: #FFFFFF; }
body.page--hub .hub-cta:hover,
body.page--hub .hub-cta:focus-visible {
box-shadow: 0 18px 44px -16px rgba(0, 0, 0, 0.6);
}
body.page--hub .hub-cta:active { transform: scale(0.99); }
body.page--hub .hub-cta svg { flex: 0 0 auto; }

.ap-packs { position: relative; overflow: hidden; }
.ap-packs__liste {
list-style: none;
margin: 0;
padding: 0;
}
.ap-packs:not(.swiper-initialized) .ap-packs__liste {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: clamp(12px, 1.6vw, 18px);
align-items: stretch;
}
@media (max-width: 720px) {
.ap-packs:not(.swiper-initialized) .ap-packs__liste {
grid-template-columns: 1fr;
}
}
.ap-pack { display: flex; min-width: 0; }
.ap-pack__carte {
--pk-x: clamp(12px, 1.5vw, 16px);
display: flex;
flex-direction: column;
width: 100%;
padding: 0;
border: 1px solid var(--carte-bord);
border-radius: var(--r-sm);
background: var(--carte-fond);
box-shadow: var(--carte-ombre);
overflow: hidden;
transition: border-color 0.5s var(--ease);
}
.ap-pack__carte:hover {
--carte-etat-bord: color-mix(in srgb, var(--ap-accent) 45%, transparent);
}
.ap-pack__titre {
margin: 0;
padding: clamp(10px, 1.2vw, 13px) var(--pk-x);
background: color-mix(in srgb, var(--bone) 5%, transparent);
border-bottom: 1px solid var(--line);
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-6);
line-height: 1;
letter-spacing: var(--k-bloc);
font-variant-numeric: tabular-nums;
color: var(--bone);
}
.ap-pack__eur {
margin-left: 3px;
font-size: 0.55em;
font-variation-settings: 'wdth' 100, 'wght' 600;
color: var(--ash);
}
.ap-pack__duo {
display: grid;
grid-template-columns: 1fr 1fr;
margin: 0;
border-bottom: 1px solid var(--line);
}
.ap-pack__duo > div {
min-width: 0;
padding: clamp(9px, 1.1vw, 12px) var(--pk-x);
}
.ap-pack__duo > div + div { border-left: 1px solid var(--line); }
.ap-pack__duo dt {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
.ap-pack__duo dd { margin: clamp(5px, 0.8vw, 8px) 0 0; }
.ap-pack__duo dd b {
display: block;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-5);
line-height: 1.05;
letter-spacing: var(--k-phare);
font-variant-numeric: tabular-nums;
color: var(--bone);
}
.ap-pack__par {
font-size: 0.5em;
letter-spacing: 0;
}
.ap-pack__duo dd > span {
display: block;
margin-top: 3px;
font-size: var(--tx-1);
line-height: 1.5;
color: var(--ash);
}
.ap-pack__plus {
list-style: none;
flex: 1 0 auto;
align-content: start;
display: grid;
gap: clamp(6px, 0.8vw, 8px);
margin: 0;
padding: clamp(10px, 1.3vw, 13px) var(--pk-x);
}
.ap-pack__plus li {
position: relative;
padding-left: 22px;
font-size: var(--tx-2);
line-height: 1.55;
color: var(--bone);
}
.ap-pack__plus li::before {
content: '✓';
position: absolute;
left: 0;
top: 0;
font-weight: 700;
color: var(--gain);
}
.ap-pack__cta {
margin: 0 var(--pk-x);
width: auto;
}
.ap-pack__dm {
display: block;
margin: clamp(8px, 1vw, 10px) var(--pk-x) clamp(10px, 1.3vw, 13px);
text-align: center;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
transition: color 0.3s var(--ease);
}
.ap-pack__dm:hover { color: var(--bone); }
.ap-packs__note { margin-top: clamp(14px, 1.9vw, 18px); }
.ap-packs .swiper-pagination {
position: static;
display: flex;
justify-content: center;
gap: 7px;
padding: 14px 0 2px;
}
.ap-packs .swiper-pagination-bullet {
width: 7px;
height: 7px;
margin: 0;
border-radius: 50%;
background: var(--line);
opacity: 1;
transition: background 0.3s var(--ease), width 0.3s var(--ease);
}
.ap-packs .swiper-pagination-bullet-active {
width: 22px;
border-radius: 4px;
background: var(--ap-accent);
}
.ap-packs.swiper-initialized .swiper-wrapper { align-items: stretch; }
.ap-packs.swiper-initialized .ap-pack { flex: 0 0 auto; }
.ap-packs.swiper-initialized .swiper-slide { height: auto; }
.ap-branche {
display: block;
position: relative;
margin: clamp(10px, 1.4vw, 14px) 0 0;
padding-left: clamp(13px, 1.8vw, 18px);
border-left: 1px solid var(--ap-accent);
}
.ap-branche__si {
display: block;
margin-bottom: 3px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ap-etq);
}
.ap-resultats { margin-top: clamp(22px, 3vw, 34px); overflow-x: auto; }
.ap-sous {
margin: 0 0 4px;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-5);
letter-spacing: var(--k-sous);
color: var(--bone);
}
.ap-resultats .ap-chapitre__mot { margin: 0 0 clamp(10px, 1.4vw, 14px); }
.ap-registre { width: 100%; border-collapse: collapse; font-size: var(--tx-2); }
.ap-registre th,
.ap-registre td {
padding: clamp(8px, 1.1vw, 11px) 0;
border-top: 1px solid var(--line);
text-align: left;
vertical-align: baseline;
}
.ap-registre thead th { border-top: 0; padding-top: 0; }
.ap-registre tbody tr:last-child td { border-bottom: 1px solid var(--line); }
.ap-registre th {
font-family: var(--f-mono);
font-weight: 400;
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
.ap-registre td + td,
.ap-registre th + th { padding-left: 14px; }
.ap-registre th.num { text-align: right; }
.ap-registre td.num {
font-family: var(--f-mono);
font-size: var(--tx-3);
font-variant-numeric: tabular-nums;
text-align: right;
white-space: nowrap;
}
.ap-registre .mois { font-weight: 600; color: var(--bone); white-space: nowrap; }
.ap-registre .note { color: var(--ash); }
@media (max-width: 640px) {
.ap-registre .note,
.ap-registre th:last-child { display: none; }
.ap-registre td + td,
.ap-registre th + th { padding-left: 10px; }
}

.ap-fiches {
display: grid;
gap: clamp(8px, 1vw, 12px);
align-items: stretch;
}
.ap-fiches--compte  { grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); }
.ap-fiches--villes  { grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); }
.ap-fiches--echelle { grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)); }
.ap-fiches + .ap-mention { margin-top: clamp(14px, 1.9vw, 18px); }
.ap-fiche {
--fi-x: clamp(11px, 1.3vw, 15px);
display: flex;
flex-direction: column;
border: 1px solid var(--carte-bord);
border-radius: var(--r-sm);
background: var(--carte-fond);
box-shadow: var(--carte-ombre);
overflow: hidden;
}
.ap-fiche--fort {
--carte-etat-bord: color-mix(in srgb, var(--ap-accent) 45%, transparent);
}
.ap-fiche__tete {
margin: 0;
padding: clamp(9px, 1.1vw, 12px) var(--fi-x);
background: color-mix(in srgb, var(--bone) 5%, transparent);
border-bottom: 1px solid var(--line);
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-4);
line-height: 1.1;
color: var(--bone);
}
.ap-fiche__tete span {
display: block;
margin-top: 4px;
font-family: var(--f-mono);
font-variation-settings: normal;
font-weight: 400;
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
.ap-fiche__lignes {
flex: 1 0 auto;
margin: 0;
padding: 4px var(--fi-x);
}
.ap-fiche__lignes > div {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
padding: clamp(6px, 0.8vw, 8px) 0;
border-top: 1px solid var(--line);
}
.ap-fiche__lignes > div:first-child { border-top: 0; }
.ap-fiche__lignes dt {
font-size: var(--tx-2);
line-height: 1.5;
color: var(--ash);
}
.ap-fiche__lignes dd {
margin: 0;
text-align: right;
white-space: nowrap;
font-variant-numeric: tabular-nums;
color: var(--bone);
}
.ap-fiche__lignes dd b { font-weight: 600; font-size: var(--tx-3); }
.ap-fiche__bilan {
margin: auto 0 0;
padding: clamp(10px, 1.4vw, 14px) var(--fi-x);
background: color-mix(in srgb, var(--bone) 5%, transparent);
border-top: 1px solid var(--line);
}
.ap-fiche__bilan > div {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
padding: 3px 0;
}
.ap-fiche__bilan dt {
font-size: var(--tx-2);
line-height: 1.5;
color: var(--ash);
}
.ap-fiche__bilan dd {
margin: 0;
text-align: right;
white-space: nowrap;
font-variant-numeric: tabular-nums;
}
.ap-fiche__bilan dd b { font-weight: 700; font-size: var(--tx-3); }
.ap-fiche__bilan > div:last-child dd b {
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-5);
line-height: 1.05;
letter-spacing: var(--k-phare);
}
.ap-fiche__ecart {
display: inline-block;
margin-left: 7px;
padding: 1px 7px;
border: 1px solid color-mix(in srgb, var(--gain) 35%, transparent);
border-radius: 999px;
font-style: normal;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: 0;
color: var(--gain);
white-space: nowrap;
}

.ap-pilotes {
border: 1px solid var(--carte-bord);
border-radius: var(--r-sm);
background: var(--carte-fond);
box-shadow: var(--carte-ombre);
overflow: hidden;
}
.ap-pilote {
display: grid;
grid-template-columns: clamp(150px, 17vw, 205px) 1fr;
gap: clamp(14px, 2vw, 26px);
padding: clamp(16px, 2.2vw, 22px) clamp(16px, 2.2vw, 24px);
}
.ap-pilote + .ap-pilote { border-top: 1px solid var(--line); }
.ap-pilote--plancher { box-shadow: inset 3px 0 0 var(--ap-accent); }
.ap-pilote__cible b {
display: block;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: var(--tx-6);
line-height: 1;
letter-spacing: var(--k-phare);
font-variant-numeric: tabular-nums;
}
.ap-pilote__cible > span {
display: block;
margin-top: 6px;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
.ap-pilote__quoi h3 {
margin: 0 0 5px;
font-size: var(--tx-3);
font-weight: 600;
line-height: 1.35;
color: var(--bone);
}
.ap-pilote__quoi p {
margin: 0;
font-size: var(--tx-2);
line-height: 1.6;
color: var(--ash);
max-width: 52ch;
}
@media (max-width: 620px) {
.ap-pilote { grid-template-columns: 1fr; gap: 9px; }
}

.accueil .recit,
.accueil .vault,
.accueil .plaque--corps {
padding-top:    var(--air-7);
padding-bottom: var(--air-7);
}
.accueil .clarte { padding-top: var(--air-7); }
.accueil .raccord--decoupe:not(.hero) {
padding-bottom: max(var(--air-7), calc(var(--dec-h) + clamp(20px, 2.4vw, 32px)));
}
.accueil .chapter { margin-bottom: var(--air-6); }
.accueil .recit .chapter { margin-bottom: var(--air-5); }
.accueil .coffre      { margin-top: var(--air-4); }
.accueil .acte__texte { max-width: var(--mesure); }
html[data-anim="0"] *,
html[data-anim="0"] *::before,
html[data-anim="0"] *::after{
animation-duration:.001ms !important;
animation-iteration-count:1 !important;
transition-duration:.001ms !important;
scroll-behavior:auto !important;
}

.accueil .clarte,
.accueil .recit,
.accueil .vault,
.accueil .plaque--corps {
--tx-4:  clamp(13px, 1.15vw, 15px);
--tx-5:  clamp(14px, 1.4vw, 16.5px);
--tx-6:  clamp(15px, 1.5vw, 18px);
--tx-7:  clamp(16px, 1.7vw, 20px);
--tx-8:  clamp(18px, 2vw, 22px);
--tx-9:  clamp(20px, 2.2vw, 26px);
--tx-10: clamp(20px, 2.2vw, 26px);
--air-2: clamp(8px, 1vw, 11px);
--air-3: clamp(11px, 1.4vw, 15px);
--air-4: clamp(14px, 1.8vw, 19px);
--air-5: clamp(16px, 2.1vw, 23px);
--air-6: clamp(19px, 2.5vw, 27px);
--air-7: clamp(64px, 8vw, 112px);
--dec-h: clamp(22px, 2.6vw, 34px);
}
.accueil .raccord--decoupe:not(.hero) {
padding-bottom: calc(var(--dec-h) + var(--air-7) / 2);
}
.accueil .chapter,
.accueil .recit .chapter { margin-bottom: var(--air-5); }
.accueil .clarte__titre,
.accueil .coffre__tete,
.accueil .seuil__titre  { margin-bottom: var(--air-5); }
.accueil .secret__titre { margin: 0 0 var(--air-5); }
.accueil .coffre       { margin-top: 0; }
.accueil .cercle       { margin-top: 0; }
.accueil .clarte__faces { margin-top: var(--air-5); }
.accueil .clarte__faces { gap: clamp(20px, 2.6vw, 36px); }
.accueil .barre {
margin-top: 0;
row-gap: calc(var(--air-2) - 2px);
}
.accueil .barre__li { line-height: 1.2; }
.accueil .fil {
--fil-h: var(--air-7);
margin: var(--air-3) 0;
}
.accueil .passerelle { margin: var(--air-5) 0 0; }
.accueil .clarte__faces .clarte__non { margin-top: var(--air-3); }
.accueil .cercle { row-gap: clamp(14px, 1.9vw, 20px); }
.accueil .roue { --d: clamp(240px, 26vw, 360px); }
.accueil .seuil {
grid-template-columns: minmax(0, 1fr) min(456px, 100%);
column-gap: clamp(26px, 3.4vw, 54px);
}
.accueil .panneau {
max-width: 456px;
--pan-t: var(--air-4);
--pan-x: var(--air-4);
--pan-b: var(--air-4);
}
.accueil .panneau__tete { margin-bottom: var(--air-3); }
.accueil .avis { padding: 10px 14px 11px; }
.accueil .panneau__avis { margin-bottom: var(--air-3); }
.accueil .ligne { padding-top: clamp(8px, 1vw, 11px); padding-bottom: clamp(8px, 1vw, 11px); }
.accueil .ligne input,
.accueil .ligne textarea { font-size: var(--tx-4); }
@media (pointer: coarse) {
.accueil .ligne input,
.accueil .ligne textarea { font-size: 14px; }
}
.accueil .ligne--code input { padding: 2px 0 4px; }
.accueil .ligne textarea {
height: clamp(52px, 5.4vw, 64px);
min-height: 48px;
line-height: 1.45;
}
.accueil .presser {
margin-top: var(--air-3);
padding: 10px 18px;
}
.accueil .form__msg { margin-bottom: var(--air-3); }
.accueil .questions { margin-top: var(--air-4); }
.accueil .seuil .questions { margin-top: 0; max-width: 456px; }
.accueil .question summary { padding: clamp(8px, 1vw, 11px) 2px; }
.accueil .question p { padding-bottom: clamp(8px, 1vw, 11px); }
@media (max-width: 900px) {
.accueil .roue { --d: clamp(230px, 66vw, 300px); }
}
@media (max-width: 980px) {
.accueil .seuil .questions { margin-top: clamp(30px, 4.8vw, 46px); }
}

.accueil .clarte,
.accueil .vault  { --titre-accent: #DD0000; }
.accueil .plaque { --titre-accent: #990000; }
.accueil .entete { margin-bottom: var(--air-5); }
.accueil .entete__sur {
display: flex;
align-items: baseline;
gap: 0.9em;
margin: 0 0 clamp(7px, 0.9vw, 10px);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
line-height: 1;
color: var(--ash);
}
.accueil .entete__sur b {
font-weight: 500;
letter-spacing: 0.06em;
font-variant-numeric: tabular-nums;
color: var(--titre-accent);
}
.accueil .entete .tete { margin: 0; }
.accueil .tete {
color: var(--bone);
letter-spacing: -0.032em;
line-height: 1.02;
}
.accueil .tete em {
display: block;
margin-top: 0.36em;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 500;
font-weight: 500;
font-size: 0.58em;
letter-spacing: -0.012em;
line-height: 1.3;
color: var(--ash);
max-width: 40ch;
}
.accueil .tete--cime em { font-size: 0.56em; }
.accueil .seuil .entete__sur b,
.accueil .vault .entete__sur b {
font-size: clamp(30px, calc(14px + 1.95vw), 42px);
}
.accueil .vault .entete .secret__titre {
font-size: clamp(21px, calc(17px + 1.05vw), 31px);
max-width: none;
white-space: nowrap;
}
.accueil .seuil .entete .seuil__titre {
font-size: clamp(21px, calc(17px + 1.05vw), 31px);
}
.accueil .seuil .entete { text-align: center; }
.accueil .entete .seuil__titre {
margin-left: auto;
margin-right: auto;
max-width: 20ch;
text-align: center;
}
.accueil .entete .seuil__titre em { margin-left: auto; margin-right: auto; }

.accueil .entete__sur {
display: block;
margin: 0 0 clamp(9px, 1.1vw, 13px);
}
.accueil .entete__sur b {
display: block;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-weight: 700;
font-size: clamp(40px, 4.6vw, 66px);
line-height: 0.88;
letter-spacing: 0.015em;
font-variant-numeric: tabular-nums;
color: var(--titre-accent);
}
@supports (-webkit-text-stroke: 1px red) {
.accueil .entete__sur b {
color: transparent;
-webkit-text-stroke: 1.5px var(--titre-accent);
}
}
.accueil .entete__sur span {
display: block;
margin-top: clamp(8px, 1vw, 11px);
}
.accueil .entete .tete {
max-width: 17ch;
text-wrap: balance;
}
@media (max-width: 1099px) {
.accueil .entete { text-align: center; }
.accueil .entete .tete { margin-left: auto; margin-right: auto; }
.accueil .entete .tete em { margin-left: auto; margin-right: auto; }
.accueil .seuil__titre { text-align: center; }
.accueil .passerelle { justify-items: center; }
}
@media (max-width: 880px) {
.accueil .clarte__faces { text-align: center; }
}
@media (min-width: 1100px) {
.accueil .clarte > .wrap,
.accueil .recit > .wrap {
display: grid;
grid-template-columns: clamp(215px, 20vw, 280px) minmax(0, 1fr);
grid-template-rows: repeat(9, auto);
column-gap: clamp(48px, 5.5vw, 96px);
}
.accueil .clarte > .wrap > :not(.entete):not(.decoupe),
.accueil .recit > .wrap > :not(.entete):not(.decoupe) {
grid-column: 2;
}
.accueil .clarte .entete,
.accueil .recit .entete,
.accueil .seuil .entete {
grid-column: 1;
grid-row: 1 / -1;
margin-bottom: 0;
position: sticky;
top: clamp(88px, 12vh, 132px);
align-self: start;
}
.accueil .entete .tete { font-size: clamp(23px, 1.95vw, 30px); }
.accueil .parcours { max-width: none; }
.accueil .wrap.seuil {
grid-template-columns: minmax(0, 1fr) min(500px, 100%);
grid-template-areas:
'tete      tete'
'questions panneau';
grid-template-rows: none;
column-gap: clamp(40px, 4.5vw, 76px);
text-align: left;
}
.accueil .seuil .entete {
grid-area: tete;
position: static;
text-align: center;
margin-bottom: clamp(26px, 3vw, 44px);
}
.accueil .seuil .questions {
align-self: start;
justify-self: start;
max-width: 470px;
}
}
.accueil .vault .entete { text-align: center; }
.accueil .vault .entete .tete,
.accueil .vault .entete .tete em {
margin-left: auto;
margin-right: auto;
}
.accueil .vault .passerelle { justify-items: center; }

@property --bc-ry {
syntax: '<number>';
inherits: true;
initial-value: 0;
}
.accueil .carte3d--clair,
.accueil .etape,
.accueil .panneau,
.accueil .fiche,
body.interieure {
--bc-fond:       linear-gradient(135deg, #0A0A0A 0%, #1A1A1A 25%, #0F0F0F 50%, #1F1F1F 75%, #0A0A0A 100%);
--bc-lumiere:    rgba(255, 255, 255, 0.05);
--bc-texte:      #EDEAE3;
--bc-texte-2:    rgba(237, 234, 227, 0.62);
--bc-texte-3:    rgba(237, 234, 227, 0.40);
--bc-filet:      rgba(255, 255, 255, 0.15);
--bc-bord:       rgba(255, 255, 255, 0.09);
--bc-reflet:     rgba(255, 255, 255, 0.13);
--bc-tranche:    rgba(0, 0, 0, 0.55);
--bc-accent:     #DD0000;
--bc-chiffre:    #EDEAE3;
--bc-bosse:      transparent;
--bc-creux:      rgba(0, 0, 0, 0.55);
--bc-bande:      #050506;
--bc-ombre-rvb:  0, 0, 0;
--bc-ombre-a:    0.75;
--bc-sheen:      rgba(255, 255, 255, 0.30);
--bc-grain:      rgba(255, 255, 255, 0.022);
--bc-grain-bas:  rgba(0, 0, 0, 0.020);
--bc-puce:       linear-gradient(140deg, #EFEEE9 0%, #B7B6B0 50%, #DEDDD7 100%);
--bc-puce-trait: rgba(10, 10, 11, 0.34);
--bc-puce-bord:  rgba(10, 10, 11, 0.22);
--bc-guilloche:  rgba(255, 255, 255, 0.042);
--bc-holo-a:     0.66;
--bc-sig:        linear-gradient(178deg, #EAE9E4 0%, #D6D5CF 100%);
--bc-sig-texte:  #17171C;
--bc-sig-hachure: rgba(10, 10, 11, 0.055);
--bc-sig-bord:   rgba(10, 10, 11, 0.18);
}
.accueil .carte3d {
position: relative;
width: 100%;
max-width: 288px;
container-type: inline-size;
perspective: 1150px;
outline: none;
cursor: grab;
touch-action: pan-y;
user-select: none;
-webkit-user-select: none;
-webkit-tap-highlight-color: transparent;
}
.accueil .carte3d.est-tenue { cursor: grabbing; }
.accueil .carte3d:focus-visible .carte3d__corps {
outline: 2px solid var(--bc-accent);
outline-offset: 8px;
border-radius: 3.7cqi;
}
.accueil .carte3d::after {
content: '';
position: absolute;
left: 7%;
right: 7%;
bottom: -6%;
height: 20%;
border-radius: 50%;
background: rgba(var(--bc-ombre-rvb), var(--bc-ombre-a));
filter: blur(16px);
z-index: -1;
pointer-events: none;
}
.accueil .carte3d__corps {
position: relative;
display: grid;
aspect-ratio: 1.586;
transform-style: preserve-3d;
transform: rotateX(0deg) rotateY(0deg);
will-change: transform;
}
.accueil .carte3d__face {
grid-area: 1 / 1;
position: relative;
display: flex;
flex-direction: column;
box-sizing: border-box;
min-width: 0;
padding: 5.6cqi 6cqi;
border-radius: 3.7cqi;
background-image:
repeating-linear-gradient(0deg,
var(--bc-grain) 0 1px, var(--bc-grain-bas) 1px 3px),
radial-gradient(120% 80% at 18% 0%, var(--bc-lumiere), transparent 60%),
var(--bc-fond);
color: var(--bc-texte);
box-shadow:
inset 0 1px 0 var(--bc-reflet),
inset 0 0 0 1px var(--bc-bord),
inset 0 -1px 0 var(--bc-tranche);
clip-path: inset(0 round 3.7cqi);
transform: translateZ(0.5px);
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
}
.accueil .carte3d__face--verso {
transform: rotateY(180deg) translateZ(0.5px);
padding-top: 4.8cqi;
padding-bottom: 4.6cqi;
}
.accueil .carte3d__face::after {
content: '';
position: absolute;
inset: 0;
pointer-events: none;
background-image: linear-gradient(104deg, transparent 43%, var(--bc-sheen) 50%, transparent 57%);
background-size: 220% 100%;
background-repeat: no-repeat;
background-position: calc(var(--bc-ry, 0) * 0.6% - 40%) 0;
opacity: 0.32;
}
.accueil .carte3d__tete {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 3cqi;
}
.accueil .carte3d__acces {
flex: 0 1 auto;
min-width: 0;
font-family: var(--f-mono);
font-size: clamp(6px, 2.05cqi, 8.5px);
letter-spacing: 0.2em;
text-transform: uppercase;
line-height: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: var(--bc-texte-3);
}
.accueil .carte3d__nom {
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-weight: 600;
font-size: clamp(8.5px, 3.3cqi, 11px);
letter-spacing: 0.17em;
text-transform: uppercase;
line-height: 1;
white-space: nowrap;
color: var(--bc-texte);
text-shadow: 0 -1px 0 var(--bc-bosse), 0 1px 1px var(--bc-creux);
}
.accueil .carte3d__nom b { font-weight: 600; }
.accueil .carte3d__nom i { font-style: normal; color: var(--bc-accent); }
.accueil .carte3d__sous {
display: block;
margin-top: 2.2cqi;
font-family: var(--f-mono);
font-size: clamp(6px, 2.15cqi, 8.5px);
letter-spacing: 0.17em;
text-transform: uppercase;
line-height: 1;
color: var(--bc-texte-3);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.accueil .carte3d__marque {
flex: 0 0 auto;
width: 8.2cqi;
height: 8.2cqi;
margin-bottom: 0.55cqi;
fill: var(--bc-chiffre);
opacity: 0.86;
}
.accueil .carte3d__ligne {
display: flex;
align-items: center;
gap: 3.6cqi;
margin-top: 8.4cqi;
}
.accueil .carte3d__puce {
display: block;
position: relative;
flex: 0 0 auto;
width: 13.6cqi;
height: 10.5cqi;
border-radius: 1.2cqi;
background:
linear-gradient(var(--bc-puce-trait), var(--bc-puce-trait)) 0 33%   / 100% 0.42cqi no-repeat,
linear-gradient(var(--bc-puce-trait), var(--bc-puce-trait)) 0 67%   / 100% 0.42cqi no-repeat,
linear-gradient(var(--bc-puce-trait), var(--bc-puce-trait)) 33% 0    / 0.42cqi 33% no-repeat,
linear-gradient(var(--bc-puce-trait), var(--bc-puce-trait)) 67% 0    / 0.42cqi 33% no-repeat,
linear-gradient(var(--bc-puce-trait), var(--bc-puce-trait)) 33% 100% / 0.42cqi 33% no-repeat,
linear-gradient(var(--bc-puce-trait), var(--bc-puce-trait)) 67% 100% / 0.42cqi 33% no-repeat,
var(--bc-puce);
box-shadow:
inset 0 0 0 1px var(--bc-puce-bord),
inset 0 1px 0 rgba(255, 255, 255, 0.6),
inset 0 -1px 0 rgba(10, 10, 11, 0.06);
}
.accueil .carte3d__ondes {
flex: 0 0 auto;
width: 6.4cqi;
height: 6.4cqi;
fill: none;
stroke: currentColor;
stroke-width: 1.7;
stroke-linecap: round;
opacity: 0.46;
}
.accueil .carte3d__chiffre {
margin: 6.4cqi 0 0;
}
.accueil .carte3d__chiffre b {
display: block;
font-family: var(--f-mono);
font-weight: 500;
font-size: clamp(17px, 7.4cqi, 24px);
letter-spacing: 0.015em;
word-spacing: -0.26em;
line-height: 1;
font-variant-numeric: tabular-nums;
color: var(--bc-chiffre);
text-shadow: 0 -1px 0 var(--bc-bosse), 0 1px 1px var(--bc-creux),
0 2px 3px var(--bc-creux);
}
.accueil .carte3d__pied {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 4cqi;
margin-top: auto;
}
.accueil .carte3d__titulaire {
min-width: 0;
margin: 0;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-weight: 600;
font-size: clamp(9px, 3.9cqi, 14px);
letter-spacing: 0.07em;
line-height: 1;
text-transform: uppercase;
color: var(--bc-texte);
white-space: nowrap;
text-shadow: 0 -1px 0 var(--bc-bosse), 0 1px 1px var(--bc-creux);
}
.accueil .carte3d__face--verso > * { position: relative; z-index: 1; }
.accueil .carte3d__bande {
display: block;
flex: 0 0 auto;
height: 10cqi;
margin: 0 -6cqi;
background-image:
repeating-linear-gradient(90deg,
rgba(255, 255, 255, 0.014) 0 1px, transparent 1px 2px),
linear-gradient(180deg,
rgba(255, 255, 255, 0.05) 0%,
rgba(255, 255, 255, 0) 26%,
rgba(0, 0, 0, 0.45) 100%),
linear-gradient(var(--bc-bande), var(--bc-bande));
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.16),
inset 0 -1px 0 rgba(0, 0, 0, 0.8),
0 1px 0 rgba(255, 255, 255, 0.07),
0 3px 6px -2px rgba(0, 0, 0, 0.8);
}
.accueil .carte3d__face--verso .carte3d__guilloche {
position: absolute;
inset: 0;
z-index: 0;
width: 100%;
height: 100%;
pointer-events: none;
}
.accueil .carte3d__guilloche ellipse {
fill: none;
stroke: var(--bc-guilloche);
stroke-width: 0.25;
}
.accueil .carte3d__holo {
flex: 0 0 auto;
align-self: stretch;
width: 16cqi;
border-radius: 0.8cqi;
background-image:
repeating-linear-gradient(112deg,
rgba(255, 255, 255, 0.26) 0 0.6px, rgba(255, 255, 255, 0) 0.6px 2.2px),
linear-gradient(112deg,
#4FD3FF 0%, #9C7BFF 20%, #FF7FBE 40%, #FFC96B 60%, #58EFB6 80%, #4FD3FF 100%);
background-size: auto, 340% 100%;
background-position: 0 0, calc(50% - var(--bc-ry, 0) * 0.85%) 0;
background-repeat: repeat, repeat;
opacity: var(--bc-holo-a);
mix-blend-mode: screen;
box-shadow:
inset 0 0 0 1px rgba(255, 255, 255, 0.22),
inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
.accueil .carte3d__rangee {
display: flex;
align-items: stretch;
gap: 2.4cqi;
margin-top: 3cqi;
flex: 1 1 auto;
min-height: 0;
}
.accueil .carte3d__releve {
flex: 1 1 auto;
min-width: 0;
min-height: 0;
margin: 0;
padding: 1.8cqi 2.2cqi;
border-radius: 0.8cqi;
background-image:
repeating-linear-gradient(118deg,
transparent 0 2.6px, var(--bc-sig-hachure) 2.6px 3.6px),
var(--bc-sig);
box-shadow:
inset 0 0 0 1px var(--bc-sig-bord),
inset 0 1px 0 rgba(255, 255, 255, 0.7),
0 1px 3px rgba(0, 0, 0, 0.45);
display: grid;
grid-template-rows: auto minmax(0, 1fr) auto;
gap: 1.3cqi;
}
.accueil .carte3d__legende {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 2cqi;
margin: 0;
font-family: var(--f-mono);
font-size: clamp(6px, 2.05cqi, 8px);
letter-spacing: 0.14em;
text-transform: uppercase;
line-height: 1;
white-space: nowrap;
color: var(--bc-sig-texte);
}
.accueil .carte3d__legende span { opacity: 0.66; }
.accueil .carte3d__legende b { font-weight: 500; opacity: 0.42; }
.accueil .carte3d__graphe {
position: relative;
display: flex;
align-items: stretch;
gap: 2.2cqi;
min-height: 17cqi;
}
.accueil .carte3d__graphe::before {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: var(--zero);
height: 1px;
margin-bottom: -0.5px;
background-color: rgba(10, 10, 11, 0.24);
}
.accueil .carte3d__col {
position: relative;
flex: 1 1 0;
min-width: 0;
}
.accueil .carte3d__col i {
position: absolute;
left: 0;
right: 0;
bottom: min(var(--zero), var(--fin));
height: max(1.5px, calc(max(var(--zero), var(--fin)) - min(var(--zero), var(--fin))));
border-radius: 0.2cqi;
background-color: rgba(10, 10, 11, 0.38);
}
.accueil .carte3d__col:last-child i { background-color: rgba(10, 10, 11, 0.66); }
.accueil .carte3d__ans {
display: flex;
gap: 2.2cqi;
margin: 0;
padding: 0;
list-style: none;
font-family: var(--f-mono);
font-size: clamp(6px, 2.05cqi, 8px);
letter-spacing: 0.08em;
line-height: 1;
color: var(--bc-sig-texte);
opacity: 0.5;
}
.accueil .carte3d__ans li {
flex: 1 1 0;
min-width: 0;
text-align: center;
}
.accueil .carte3d__pied-dos {
display: flex;
align-items: center;
justify-content: space-between;
gap: 3cqi;
margin: 2.4cqi 0 0;
padding: 0;
}
.accueil .carte3d__emetteur {
margin: 0;
padding: 0;
font-family: var(--f-mono);
font-size: clamp(6px, 2.1cqi, 8.5px);
letter-spacing: 0.2em;
text-transform: uppercase;
line-height: 1;
color: var(--bc-texte-3);
white-space: nowrap;
}
.accueil .carte3d__code {
flex: 0 0 auto;
width: 18cqi;
height: 6cqi;
display: grid;
place-items: center;
border-radius: 0.6cqi;
background-image:
repeating-linear-gradient(74deg,
rgba(255, 255, 255, 0.11) 0 0.5px, rgba(255, 255, 255, 0) 0.5px 2px),
linear-gradient(rgba(10, 10, 11, 0.17), rgba(10, 10, 11, 0.05)),
var(--bc-puce);
box-shadow:
inset 0 0 0 1px var(--bc-puce-bord),
inset 0 1px 0 rgba(255, 255, 255, 0.55),
0 1px 2px rgba(0, 0, 0, 0.5);
}
.accueil .carte3d__code i {
font-style: normal;
font-family: var(--f-mono);
font-weight: 500;
font-size: clamp(5px, 1.8cqi, 7.5px);
letter-spacing: 0.24em;
text-indent: 0.24em;
text-transform: uppercase;
line-height: 1;
color: var(--bc-puce-trait);
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
.accueil .carte3d:not(.est-vif) { perspective: none; cursor: default; }
.accueil .carte3d:not(.est-vif)::after { content: none; }
.accueil .carte3d:not(.est-vif) .carte3d__corps { aspect-ratio: auto; transform: none; }
.accueil .carte3d:not(.est-vif) .carte3d__face { grid-area: auto; transform: none; }
.accueil .carte3d:not(.est-vif) .carte3d__face::after { display: none; }
.accueil .carte3d:not(.est-vif) .carte3d__face--verso { margin-top: 12px; }
.accueil .carte3d__mode {
--mode-bord: rgba(237, 234, 227, 0.16);
display: none;
width: 100%;
max-width: 288px;
margin: clamp(10px, 1.3vw, 14px) auto 0;
padding: 8px 12px;
align-items: center;
justify-content: space-between;
gap: 12px;
border: 1px solid var(--mode-bord);
border-radius: 9px;
font-family: var(--f-mono);
font-size: min(var(--tx-1), 10px);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
line-height: 1;
color: var(--ash);
user-select: none;
}
.accueil .carte3d.est-vif + .carte3d__mode { display: flex; }
.accueil .carte3d__geste,
.accueil .carte3d__etat {
display: flex;
align-items: center;
gap: 7px;
white-space: nowrap;
}
.accueil .carte3d__geste { color: var(--bone); }
.accueil .carte3d__etat i {
width: 5px;
height: 5px;
flex: 0 0 auto;
border-radius: 50%;
background: currentColor;
animation: carteTemoin 2.6s ease-in-out infinite;
}
@keyframes carteTemoin { 0%, 100% { opacity: 0.35; } 50% { opacity: 1; } }
.accueil .carte3d__giration {
width: 13px;
height: 13px;
flex: 0 0 auto;
fill: none;
stroke: currentColor;
stroke-width: 1.7;
stroke-linecap: round;
animation: carteGiration 5s linear infinite;
}
@keyframes carteGiration { to { transform: rotate(360deg); } }
.accueil .clarte__face--carte {
display: grid;
justify-items: center;
align-self: center;
padding: 0;
}
@media (prefers-reduced-motion: reduce) {
.accueil .carte3d__face::after { display: none; }
.accueil .carte3d__face--verso::before { animation: none; }
.accueil .carte3d__giration { animation: none; }
.accueil .carte3d__etat i { animation: none; opacity: 0.7; }
}

.interieure,
.perdue {
--app-no:         clamp(40px, 4.6vw, 66px);
--app-air-sec:  clamp(38px, 4.6vw, 58px);
--app-air-bloc: clamp(20px, 2.3vw, 28px);
--app-air-rang: clamp(11px, 1.2vw, 14px);
--app-air-fin:  clamp(6px, 0.7vw, 8px);
--app-rail:  clamp(215px, 21vw, 300px);
--app-gout:  clamp(48px, 5.5vw, 96px);
--app-large: 1140px;
--app-colle: clamp(88px, 12vh, 132px);
--app-pad:   clamp(15px, 1.8vw, 21px);
--app-pad-l: clamp(16px, 2vw, 24px);
}
.interieure .wrap {
width: min(var(--app-large), calc(100% - var(--marge-g) - var(--marge-d)));
max-width: none;
margin-inline: auto;
}
.interieure .doc { max-width: none; }
.interieure .chapter {
display: block;
margin-bottom: clamp(10px, 1.2vw, 14px);
}
.interieure .chapter__rule { display: none; }
@supports (-webkit-text-stroke: 1px red) {
}
.interieure { --app-no-teinte: var(--id-nuit, #DD0000); }
.interieure .ap-sol,
.interieure .plaque { --app-no-teinte: var(--id-jour, #990000); }
.interieure.page--doc .plaque--corps { --app-no-teinte: #DD0000; }
.est-froid .interieure.page--doc .plaque--corps { --app-no-teinte: #990000; }
.est-froid .interieure { --app-no-teinte: var(--id-jour, #990000); }
.interieure .chapter__label {
display: block;
margin-top: clamp(8px, 1vw, 11px);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
line-height: 1.3;
color: var(--ash);
white-space: normal;
}
.interieure .ap-titre {
font-size: var(--app-titre-sec);
line-height: 1.06;
letter-spacing: -0.028em;
max-width: 20ch;
text-wrap: balance;
}
.interieure .ap-chapitre { margin-bottom: var(--app-air-bloc); }
.interieure .ap-chapitre .chapter { margin-bottom: clamp(10px, 1.2vw, 14px); }
.interieure .ap-chapitre__mot {
margin-top: clamp(12px, 1.4vw, 16px);
font-size: var(--tx-3);
line-height: 1.65;
max-width: 58ch;
}
.interieure .ap-heros {
display: block;
min-height: 0;
padding-block: calc(76px + var(--app-air-sec)) var(--app-air-sec);
}
.interieure .ap-heros .chapter { flex-wrap: nowrap; row-gap: 0; }
.interieure .ap-heros__etq {
display: block;
margin-top: 5px;
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
white-space: normal;
}
.interieure .ap-ecran { padding-block: var(--app-air-sec); }
@media (min-width: 1100px) {
.interieure .ap-ecran > .ap-cadre:has(> .ap-chapitre) {
display: grid;
grid-template-columns: var(--app-rail) minmax(0, 1fr);
grid-template-rows: repeat(12, auto);
column-gap: var(--app-gout);
align-items: start;
}
.interieure .ap-ecran > .ap-cadre:has(> .ap-chapitre) > :not(.ap-chapitre):not(.decoupe) {
grid-column: 2;
}
.interieure .ap-ecran > .ap-cadre > .ap-chapitre {
grid-column: 1;
grid-row: 1 / -1;
margin-bottom: 0;
position: sticky;
top: var(--app-colle);
align-self: start;
}
.interieure .ap-ecran > .ap-cadre > .ap-chapitre .ap-chapitre__mot {
max-width: none;
font-size: var(--tx-2);
line-height: 1.6;
}
}
.interieure .ap-carte {
padding: var(--app-pad) var(--app-pad-l);
border-radius: var(--r-sm);
}
.interieure .ap-grille { gap: clamp(9px, 1.1vw, 13px); }
.interieure .ap-grille {
grid-template-columns: repeat(auto-fit, minmax(min(228px, 100%), 1fr));
}
.interieure .ap-carte__titre {
font-size: var(--app-titre-bloc);
margin-bottom: 6px;
}
.interieure .ap-carte__texte { font-size: var(--tx-3); line-height: 1.62; }
.interieure .page--tete {
padding-block: calc(76px + var(--app-air-sec)) var(--app-air-sec);
}
.interieure .page--tete .page__titre {
font-size: var(--app-titre-page);
line-height: 1.04;
letter-spacing: -0.03em;
max-width: 20ch;
}
.interieure .page--tete .page__titre em { margin-top: 0.08em; }
.interieure .page--tete .doc__date { margin-bottom: 7px; }
.interieure .plaque--corps { padding-block: var(--app-air-sec); }
.interieure .doc h2 {
margin: var(--app-air-bloc) 0 clamp(7px, 0.9vw, 10px);
font-size: var(--app-titre-bloc);
letter-spacing: -0.018em;
line-height: 1.25;
}
.interieure .doc__corps > h2:first-child { margin-top: 0; }
.interieure .doc p,
.interieure .doc li { font-size: var(--tx-3); line-height: 1.7; }
.interieure .doc p { margin-bottom: 9px; }
.interieure .doc ul { margin: 8px 0 12px; padding-left: 17px; }
.interieure .doc li { margin-bottom: 5px; }
.interieure .doc__encart {
margin: clamp(11px, 1.3vw, 15px) 0;
padding: var(--app-pad) var(--app-pad-l);
border: 1px solid var(--carte-bord, var(--line));
border-left: 2px solid var(--rouge);
border-radius: var(--r-md);
background: var(--carte-fond, rgba(255, 255, 255, 0.04));
box-shadow: none;
}
.interieure .doc__fin {
margin-top: var(--app-air-bloc);
padding-top: clamp(12px, 1.4vw, 16px);
}
.interieure .merci {
text-align: left;
}
.interieure.page--recu .page--tete { padding-bottom: var(--app-air-bloc); }
.interieure .merci__intro,
.interieure .page__intro {
margin-inline: 0;
max-width: 62ch;
font-size: var(--tx-3);
line-height: 1.68;
}
.interieure .suite__nom {
margin: 0 0 clamp(12px, 1.4vw, 16px);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
.interieure .suite__cta {
margin-inline: 0;
margin-top: var(--app-air-bloc);
width: fit-content;
}
@media (min-width: 1100px) {
.interieure.page--recu .page--tete .merci {
display: grid;
grid-template-columns: minmax(0, 1fr) min(430px, 42%);
column-gap: var(--app-gout);
align-items: start;
}
.interieure.page--recu .page--tete .merci > :not(.recu) { grid-column: 1; }
.interieure.page--recu .page--tete .merci > .recu {
grid-column: 2;
grid-row: 1 / span 4;
margin-top: 0;
}
.interieure.page--recu .plaque--corps .merci {
display: grid;
grid-template-columns: var(--app-rail) minmax(0, 1fr);
column-gap: var(--app-gout);
align-items: start;
}
.interieure.page--recu .plaque--corps .merci > * { grid-column: 2; }
.interieure.page--recu .plaque--corps .merci > .suite__nom {
grid-column: 1;
grid-row: 1 / -1;
position: sticky;
top: var(--app-colle);
margin-bottom: 0;
}
}
.perdue .perdu__titre {
font-size: var(--app-titre-page);
line-height: 1.05;
letter-spacing: -0.03em;
}
.perdue .perdu__ref {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
}
.perdue .perdu__intro { font-size: var(--tx-3); line-height: 1.68; }
@media (max-width: 1099px) {
.interieure .ap-heros,
.interieure .page--tete {
padding-block: calc(68px + var(--app-air-bloc)) var(--app-air-bloc);
}
.interieure .ap-ecran,
.interieure .plaque--corps { padding-block: var(--app-air-bloc); }
.interieure .ap-heros__titre,
.interieure .page--tete .page__titre { max-width: 100%; }
.interieure .ap-titre { max-width: 100%; }
}
.interieure .ap-ecran,
.interieure .ap-heros,
.interieure .plaque,
.interieure .page--tete,
.perdue .page {
--tx-4:  clamp(13px, 1.15vw, 15px);
--tx-5:  clamp(14px, 1.4vw, 16.5px);
--tx-6:  clamp(15px, 1.5vw, 18px);
--tx-7:  clamp(16px, 1.7vw, 20px);
--tx-8:  clamp(18px, 2vw, 22px);
--tx-9:  clamp(20px, 2.2vw, 26px);
--tx-10: clamp(20px, 2.2vw, 26px);
--air-2: clamp(8px, 1vw, 11px);
--air-3: clamp(11px, 1.4vw, 15px);
--air-4: clamp(14px, 1.8vw, 19px);
--air-5: clamp(16px, 2.1vw, 23px);
--air-6: clamp(19px, 2.5vw, 27px);
--air-7: clamp(64px, 8vw, 112px);
--dec-h: clamp(22px, 2.6vw, 34px);
}
.interieure .ap-ecran,
.interieure .plaque--corps {
padding-top: var(--air-7);
padding-bottom: calc(var(--dec-h) + var(--air-7) / 2);
}
.interieure .ap-heros,
.interieure .page--tete {
padding-top: calc(76px + var(--air-7) / 2);
padding-bottom: calc(var(--dec-h) + var(--air-7) / 2);
}
.interieure .ap-chapitre { margin-bottom: var(--air-5); }
.interieure .chapter     { margin-bottom: var(--air-5); }
.interieure .ap-titre    { margin: 0 0 var(--air-5); }
.interieure .ap-chapitre__mot { margin: 0; }
.interieure .ap-ecran,
.interieure .ap-heros,
.interieure .plaque,
.interieure .page--tete,
.perdue .page {
--app-titre-page: var(--tx-10);
--app-titre-sec:  var(--tx-9);
--app-titre-bloc: var(--tx-7);
}
body.interieure {
--metal-grain:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)' opacity='0.05'/%3E%3C/svg%3E");
}
body.interieure {
--carte-fond:
var(--metal-grain),
linear-gradient(158deg,
rgba(var(--id-voile-rvb, 255, 255, 255), 0.038)  0%,
rgba(var(--id-voile-rvb, 255, 255, 255), 0.020) 14%,
rgba(var(--id-voile-rvb, 255, 255, 255), 0.009) 30%,
rgba(var(--id-voile-rvb, 255, 255, 255), 0.009) 76%,
rgba(var(--id-voile-rvb, 255, 255, 255), 0.020) 100%),
linear-gradient(var(--id-surface, #121216), var(--id-surface, #121216));
--carte-bord:  var(--id-bord, rgba(255, 255, 255, 0.14));
--carte-ombre:
inset 0 1px 0 rgba(var(--id-voile-rvb, 255, 255, 255), 0.15),
inset 0 -1px 0 rgba(0, 0, 0, 0.55),
0 24px 50px -28px rgba(0, 0, 0, 0.96);
--carte-fort-fond:
var(--metal-grain),
linear-gradient(158deg,
rgba(var(--id-voile-rvb, 255, 255, 255), 0.045)  0%,
rgba(var(--id-voile-rvb, 255, 255, 255), 0.022) 14%,
rgba(var(--id-voile-rvb, 255, 255, 255), 0.010) 30%,
rgba(var(--id-voile-rvb, 255, 255, 255), 0.010) 76%,
rgba(var(--id-voile-rvb, 255, 255, 255), 0.024) 100%),
linear-gradient(var(--id-surface-2, #17171C), var(--id-surface-2, #17171C));
--carte-fort-bord: var(--id-bord-2, rgba(255, 255, 255, 0.20));
--tuile-fond:  rgba(var(--id-voile-rvb, 255, 255, 255), 0.042);
--tuile-bord:  rgba(var(--id-voile-rvb, 255, 255, 255), 0.10);
}
html.est-froid body.interieure {
--carte-fond:
var(--metal-grain),
linear-gradient(158deg,
rgba(255, 255, 255, 0.96)  0%,
rgba(255, 255, 255, 0.86) 26%,
rgba(255, 255, 255, 0.74) 58%,
rgba(255, 255, 255, 0.70) 82%,
rgba(255, 255, 255, 0.80) 100%);
--carte-bord:  rgba(255, 255, 255, 0.92);
--carte-ombre:
inset 0 1px 0 rgba(255, 255, 255, 0.95),
inset 0 -1px 0 rgba(11, 27, 38, 0.06),
0 20px 44px -28px rgba(11, 27, 38, 0.42);
--carte-fort-fond:
var(--metal-grain),
linear-gradient(158deg,
#FFFFFF  0%,
rgba(255, 255, 255, 0.96) 30%,
rgba(255, 255, 255, 0.90) 62%,
rgba(255, 255, 255, 0.92) 100%);
--carte-fort-bord: rgba(255, 255, 255, 1);
--tuile-fond: rgba(255, 255, 255, 0.62);
--tuile-bord: rgba(11, 27, 38, 0.08);
}
body.interieure .plaque {
--carte-fond: linear-gradient(158deg,
rgba(255, 255, 255, 0.98) 0%,
rgba(255, 255, 255, 0.88) 55%,
rgba(255, 255, 255, 0.82) 100%);
--carte-bord: rgba(255, 255, 255, 0.9);
--carte-ombre:
inset 0 1px 0 rgba(255, 255, 255, 1),
0 18px 40px -26px rgba(10, 10, 11, 0.35);
--carte-fort-fond: #FFFFFF;
--carte-fort-bord: rgba(255, 255, 255, 1);
--tuile-fond: rgba(255, 255, 255, 0.72);
--tuile-bord: rgba(10, 10, 11, 0.10);
}
body.interieure .ap-carte,
body.interieure .ap-pack__carte,
body.interieure .ap-porte__lien,
body.interieure .ap-fiche,
body.interieure .ap-pilotes,
body.interieure .ap-fin,
body.interieure .ap-appel,
body.interieure .doc__article {
background: var(--carte-fond);
border: 1px solid var(--carte-etat-bord, var(--carte-bord));
box-shadow: var(--carte-ombre);
}
.interieure .doc__article {
position: relative;
margin: 0 0 var(--air-4);
padding: var(--air-5) var(--air-5) var(--air-5);
scroll-margin-top: calc(var(--app-colle) + var(--air-4));
}
.interieure .doc__article:last-of-type { margin-bottom: 0; }
.interieure .doc__article > h2 {
display: block;
margin: 0 0 var(--air-3);
padding: 0;
border: 0;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 600;
font-size: var(--tx-7);
line-height: 1.25;
letter-spacing: var(--k-bloc);
color: var(--bone);
}
.interieure .doc__art {
display: inline-block;
margin-right: 0.46em;
vertical-align: baseline;
font-family: var(--f-display);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-weight: 700;
font-size: var(--tx-9);
line-height: 1;
letter-spacing: 0.015em;
font-variant-numeric: tabular-nums;
color: var(--app-no-teinte);
}
@supports (-webkit-text-stroke: 1px red) {
.interieure .doc__art {
color: transparent;
-webkit-text-stroke: 1.4px var(--app-no-teinte);
}
}
.interieure .doc__nom { display: inline; }
.interieure .doc__article .doc__ancre {
opacity: 0;
transition: opacity 120ms linear;
}
.interieure .doc__article:hover .doc__ancre,
.interieure .doc__article .doc__ancre:focus-visible { opacity: 1; }
.interieure .doc p,
.interieure .doc li {
font-size: var(--tx-4);
line-height: 1.72;
color: var(--ash);
}
.interieure .doc__article > p  { margin: 0 0 var(--air-2); max-width: var(--mesure); }
.interieure .doc__article > ul { margin: var(--air-2) 0 var(--air-3); max-width: var(--mesure); }
.interieure .doc li { margin-bottom: 5px; }
.interieure .doc__article > p:last-child,
.interieure .doc__article > ul:last-child { margin-bottom: 0; }
.interieure .doc__encart {
margin: var(--air-3) 0;
padding: var(--air-3) var(--air-4);
border: 0;
border-left: 2px solid var(--app-no-teinte);
border-radius: 0 var(--r-md) var(--r-md) 0;
background: rgba(var(--eclat-rvb, 153, 0, 0), 0.045);
box-shadow: none;
max-width: var(--mesure);
}
.interieure .doc__encart p:last-child { margin-bottom: 0; }
.interieure .doc__fin {
margin-top: var(--air-5);
padding-top: var(--air-4);
border-top: 1px solid var(--line);
font-size: var(--tx-3);
}
.interieure .doc__date { margin: 0 0 var(--air-3); }
@media (max-width: 1099px) {
.interieure .doc__article {
padding: var(--air-4) var(--air-4);
margin-bottom: var(--air-3);
}
.interieure .doc__article .doc__ancre { opacity: 1; }
}
html body.interieure.page--doc .plaque--corps {
--bone: inherit;
--ash:  inherit;
--line: inherit;
--ink:  inherit;
--eclat:       inherit;
--eclat-vif:   inherit;
--eclat-rvb:   inherit;
--eclat-voile: inherit;
--eclat-lueur: inherit;
--gain:  inherit;
--perte: inherit;
--rouge: inherit;
--rouge-titre: inherit;
--pose:      inherit;
--pose-fort: inherit;
--carte-fond:      inherit;
--carte-bord:      inherit;
--carte-ombre:     inherit;
--carte-fort-fond: inherit;
--carte-fort-bord: inherit;
--tuile-fond:      inherit;
--tuile-bord:      inherit;
--fond-c:      inherit;
--fond-img:    inherit;
--fond-taille: inherit;
--fond-rep:    inherit;
color: inherit;
background-color: transparent;
background-image: none;
}
html body.interieure.page--doc .plaque--corps::before,
html body.interieure.page--doc .plaque--corps::after { content: none; }
html body.interieure.page--doc .page--tete::before,
html body.interieure.page--doc .plaque--corps::before { content: none; }
html body.interieure.page--doc { background-color: #0A0A0B; }
html.est-froid body.interieure.page--doc {
background-color: var(--ciel-bas);
background-image: linear-gradient(180deg,
var(--ciel-median)   0%,
var(--ciel-bas)     58%,
var(--horizon)     100%);
background-repeat: no-repeat;
background-size: 100% 100%;
}
html body.interieure.page--doc .page--tete {
background-color: transparent;
background-image: none;
}
html body.interieure.page--doc > footer,
html body.interieure.page--doc .pied { background-color: #0A0A0B; }
html.est-froid body.interieure.page--doc > footer,
html.est-froid body.interieure.page--doc .pied {
background-color: var(--horizon);
}
body.interieure .ap-ciel {
--carte-fond:
repeating-linear-gradient(0deg,
var(--bc-grain) 0 1px, var(--bc-grain-bas) 1px 3px),
radial-gradient(120% 80% at 18% 0%, var(--bc-lumiere), transparent 60%),
var(--bc-fond);
--carte-bord:  var(--bc-bord);
--carte-ombre:
inset 0 1px 0 var(--bc-reflet),
inset 0 -1px 0 var(--bc-tranche),
0 14px 34px -20px rgba(var(--bc-ombre-rvb), var(--bc-ombre-a)),
0 2px 8px -4px rgba(var(--bc-ombre-rvb), 0.5);
--carte-fort-fond:
var(--carte-fond);
--carte-fort-bord: var(--id-bord-2, rgba(255, 255, 255, 0.20));
--pose:      rgba(var(--id-voile-rvb, 255, 255, 255), 0.030);
--pose-fort: rgba(var(--id-voile-rvb, 255, 255, 255), 0.055);
--tuile-fond: rgba(var(--id-voile-rvb, 255, 255, 255), 0.032);
--tuile-bord: rgba(var(--id-voile-rvb, 255, 255, 255), 0.09);
}
body.interieure .ap-sol {
--carte-fond: linear-gradient(158deg,
rgba(255, 255, 255, 0.99)  0%,
rgba(255, 255, 255, 0.90) 55%,
rgba(255, 255, 255, 0.84) 100%);
--carte-bord: rgba(255, 255, 255, 0.92);
--carte-ombre:
inset 0 1px 0 rgba(255, 255, 255, 1),
0 18px 40px -26px rgba(10, 10, 11, 0.34);
--carte-fort-fond: #FFFFFF;
--carte-fort-bord: #FFFFFF;
--tuile-fond: rgba(255, 255, 255, 0.72);
--tuile-bord: rgba(10, 10, 11, 0.10);
}
html.est-froid body.interieure .ap-ciel {
--carte-fond:
var(--metal-grain),
linear-gradient(158deg,
rgba(255, 255, 255, 0.94)  0%,
rgba(255, 255, 255, 0.82) 26%,
rgba(255, 255, 255, 0.70) 58%,
rgba(255, 255, 255, 0.66) 82%,
rgba(255, 255, 255, 0.76) 100%);
--carte-bord:  rgba(255, 255, 255, 0.90);
--carte-ombre:
inset 0 1px 0 rgba(255, 255, 255, 0.95),
inset 0 -1px 0 rgba(11, 27, 38, 0.05),
0 20px 44px -28px rgba(11, 27, 38, 0.40);
--carte-fort-fond: linear-gradient(158deg,
#FFFFFF 0%, rgba(255, 255, 255, 0.94) 60%, rgba(255, 255, 255, 0.90) 100%);
--carte-fort-bord: #FFFFFF;
--tuile-fond: rgba(255, 255, 255, 0.60);
--tuile-bord: rgba(11, 27, 38, 0.08);
}
html.est-froid body.interieure .ap-sol {
--carte-fond: linear-gradient(158deg,
#FFFFFF 0%, rgba(255, 255, 255, 0.96) 55%, rgba(255, 255, 255, 0.92) 100%);
--carte-bord: #FFFFFF;
--carte-ombre:
inset 0 1px 0 rgba(255, 255, 255, 1),
0 18px 40px -26px rgba(11, 27, 38, 0.30);
--carte-fort-fond: #FFFFFF;
--carte-fort-bord: #FFFFFF;
--tuile-fond: rgba(255, 255, 255, 0.76);
--tuile-bord: rgba(11, 27, 38, 0.08);
}
html.est-froid body.interieure.page--doc {
--bone: var(--gl-texte);
--ash:  var(--gl-texte-2);
--ink:  var(--plan-tenu);
--line: rgba(11, 15, 20, 0.15);
--rouge:       var(--gl-accent);
--rouge-titre: var(--gl-accent);
--eclat:       var(--gl-accent);
--eclat-vif:   var(--rouge-nuit);
--eclat-rvb:   153, 0, 0;
--eclat-voile: rgba(153, 0, 0, 0.055);
--eclat-lueur: rgba(153, 0, 0, 0.30);
--gain:  #0A5730;
--perte: var(--gl-accent);
--ap-accent:     var(--gl-accent);
--ap-accent-rvb: 153, 0, 0;
--ap-etq:        var(--gl-accent);
--ap-btn-plein-txt: #F1F7FB;
}
body.interieure .bar {
gap: clamp(10px, 1.2vw, 16px);
padding-block: 8px;
padding-inline: max(var(--marge-g), calc((100% - var(--app-large)) / 2));
}
body.interieure .bar.is-stuck {
padding-top: 8px;
padding-bottom: 8px;
background: #0A0A0B;
border-bottom-color: rgba(255, 255, 255, 0.10);
}
html.est-froid body.interieure .bar.is-stuck {
background: var(--ciel-median);
border-bottom-color: rgba(11, 27, 38, 0.12);
}
body.interieure .bar__retour {
gap: 7px;
font-family: var(--f-mono);
font-size: 10.5px;
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
transition: color 140ms linear;
}
body.interieure .bar__retour:hover { color: var(--bone); }
body.interieure .bar__retour svg { width: 11px; height: 11px; }
body.interieure .minuteur {
padding: 4px 9px;
font-size: 10.5px;
border-radius: var(--r-pill);
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.09);
}
html.est-froid body.interieure .minuteur {
background: rgba(255, 255, 255, 0.5);
border-color: rgba(11, 27, 38, 0.10);
}
body.interieure .bar .mode {
width: 26px;
height: 26px;
padding: 0;
}
body.interieure .ap-ciel .ap-carte,
body.interieure .ap-ciel .ap-pack__carte,
body.interieure .ap-ciel .ap-porte__lien,
body.interieure .ap-ciel .ap-fiche,
body.interieure .ap-ciel .ap-pilotes,
body.interieure .ap-ciel .ap-fin,
body.interieure .ap-ciel .ap-appel {
--carte-fond: var(--carte-fort-fond);
--carte-bord: var(--carte-fort-bord);
--carte-ombre:
inset 0 1px 0 rgba(255, 255, 255, 0.17),
inset 0 -1px 0 rgba(0, 0, 0, 0.45),
0 22px 46px -26px rgba(0, 0, 0, 0.92);
--ap-etq: var(--ash);
--ph-a: #FFFFFF;
--ph-b: #8E97A2;
--ph-creux:       rgba(0, 0, 0, 0.30);
--ph-creux-ombre: rgba(0, 0, 0, 0.35);
}
body.interieure.page--doc .doc__article {
--bone: #101013;
--ash:  #4E4E56;
--line: rgba(10, 10, 11, 0.22);
--ink:  #EDEDEB;
--eclat:       #101013;
--eclat-vif:   #2C2C31;
--eclat-voile: rgba(10, 10, 11, 0.12);
--eclat-lueur: rgba(10, 10, 11, 0.26);
--gain:  #0A5730;
--perte: #990000;
--rouge: #990000;
--rouge-titre: var(--id-jour);
--ap-accent:     var(--id-jour);
--ap-accent-rvb: var(--id-jour-rvb);
--ap-encre:      #FFFFFF;
--ap-etq: var(--id-jour);
color: var(--bone);
}
body.interieure .ap-sol .ap-carte,
body.interieure .ap-sol .ap-pack__carte,
body.interieure .ap-sol .ap-porte__lien,
body.interieure .ap-sol .ap-fiche,
body.interieure .ap-sol .ap-pilotes,
body.interieure .ap-sol .ap-fin,
body.interieure .ap-sol .ap-appel {
--carte-fond:
repeating-linear-gradient(0deg,
var(--bc-grain) 0 1px, var(--bc-grain-bas) 1px 3px),
radial-gradient(120% 80% at 18% 0%, var(--bc-lumiere), transparent 60%),
var(--bc-fond);
--carte-bord: var(--id-bord-2, rgba(255, 255, 255, 0.16));
--carte-ombre:
inset 0 1px 0 rgba(255, 255, 255, 0.10),
inset 0 -1px 0 rgba(0, 0, 0, 0.50);
--bone: #EDEAE3;
--ash:  #A6A6AD;
--line: rgba(237, 234, 227, 0.13);
--ink:  #0A0A0B;
--eclat:       #EDEAE3;
--eclat-vif:   #FFFFFF;
--eclat-rvb:   237, 234, 227;
--eclat-voile: rgba(237, 234, 227, 0.15);
--eclat-lueur: rgba(237, 234, 227, 0.36);
--gain:  #4FC98A;
--perte: #E2706E;
--rouge: #DD0000;
--rouge-titre: var(--bone);
--app-no-teinte: #DD0000;
--ap-accent:     var(--id-nuit);
--ap-accent-rvb: var(--id-nuit-rvb);
--ap-encre:      var(--id-encre, #FFFFFF);
--ap-etq:        var(--ash);
--ap-btn-plein-txt: #0A0A0B;
--pose:      rgba(var(--id-voile-rvb, 255, 255, 255), 0.030);
--pose-fort: rgba(var(--id-voile-rvb, 255, 255, 255), 0.055);
--tuile-fond: rgba(var(--id-voile-rvb, 255, 255, 255), 0.032);
--tuile-bord: rgba(var(--id-voile-rvb, 255, 255, 255), 0.09);
color: var(--bone);
}
html.est-froid body.interieure .ap-ciel .ap-carte,
html.est-froid body.interieure .ap-ciel .ap-pack__carte,
html.est-froid body.interieure .ap-ciel .ap-porte__lien,
html.est-froid body.interieure .ap-ciel .ap-fiche,
html.est-froid body.interieure .ap-ciel .ap-pilotes,
html.est-froid body.interieure .ap-ciel .ap-fin,
html.est-froid body.interieure .ap-ciel .ap-appel,
html.est-froid body.interieure .ap-sol .ap-carte,
html.est-froid body.interieure .ap-sol .ap-pack__carte,
html.est-froid body.interieure .ap-sol .ap-porte__lien,
html.est-froid body.interieure .ap-sol .ap-fiche,
html.est-froid body.interieure .ap-sol .ap-pilotes,
html.est-froid body.interieure .ap-sol .ap-fin,
html.est-froid body.interieure .ap-sol .ap-appel {
--carte-fond:
repeating-linear-gradient(0deg,
var(--bc-grain) 0 1px, var(--bc-grain-bas) 1px 3px),
radial-gradient(120% 80% at 18% 0%, var(--bc-lumiere), transparent 60%),
var(--bc-fond);
--carte-bord: var(--id-bord-2, rgba(255, 255, 255, 0.20));
--carte-ombre: inset 0 1px 0 rgba(255, 255, 255, 0.10);
--bone: #EDF3F9;
--ash:  #A7B8C7;
--line: rgba(237, 243, 249, 0.16);
--ink:  var(--nuit);
--eclat:       #EDF3F9;
--eclat-vif:   #FFFFFF;
--eclat-rvb:   237, 243, 249;
--eclat-voile: rgba(237, 243, 249, 0.14);
--eclat-lueur: rgba(237, 243, 249, 0.34);
--gain:  #4FC98A;
--perte: #E88A88;
--rouge: #DD0000;
--rouge-titre: var(--bone);
--app-no-teinte: #DD0000;
--ap-accent:     var(--id-nuit);
--ap-accent-rvb: var(--id-nuit-rvb);
--ap-encre:      var(--id-encre, #FFFFFF);
--ap-etq:        var(--ash);
--ap-btn-plein-txt: var(--nuit);
--pose:      rgba(var(--id-voile-rvb, 255, 255, 255), 0.032);
--pose-fort: rgba(var(--id-voile-rvb, 255, 255, 255), 0.058);
--tuile-fond: rgba(var(--id-voile-rvb, 255, 255, 255), 0.032);
--tuile-bord: rgba(var(--id-voile-rvb, 255, 255, 255), 0.09);
--ph-a: #FFFFFF;
--ph-b: #9DAFC0;
--ph-creux:       rgba(0, 0, 0, 0.28);
--ph-creux-ombre: rgba(0, 0, 0, 0.34);
color: var(--bone);
}
html.est-froid body.interieure.page--doc .doc__article {
--bone: var(--gl-texte);
--ash:  var(--gl-texte-2);
--line: rgba(11, 15, 20, 0.13);
color: var(--gl-texte);
}
body.interieure .ap-carte,
body.interieure .ap-pilotes,
body.interieure .ap-appel { padding: var(--air-3); }
body.interieure .ap-pack__carte,
body.interieure .ap-fiche { padding: 0; }
body.interieure .doc__article {
padding: var(--air-4) var(--air-4);
margin-bottom: var(--air-3);
}
body.interieure .ap-heros__corps {
padding: 0;
border: 0;
border-radius: 0;
background: none;
box-shadow: none;
color: inherit;
}
body.interieure .ap-heros__corps > .chapter {
display: flex;
align-items: center;
gap: clamp(9px, 1.1vw, 14px);
margin: 0 0 clamp(20px, 2.4vw, 32px);
padding-left: clamp(10px, 1.1vw, 14px);
border-left: 2px solid var(--app-no-teinte);
min-height: 14px;
}
body.interieure .ap-heros__corps > .chapter > .chapter__label {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--bone);
white-space: nowrap;
}
body.interieure .ap-heros__corps > .chapter > .chapter__rule {
display: block;
flex: 1 1 auto;
min-width: 20px;
height: 1px;
background: var(--line);
}
body.interieure .ap-heros__corps > .chapter > .ap-heros__etq,
body.interieure .ap-heros__corps > .chapter > .ap-heros__maj {
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
white-space: nowrap;
}
body.interieure .ap-heros__titre {
margin: 0;
max-width: 26ch;
font-family: var(--f-titre);
font-variation-settings: 'wdth' 100, 'wght' 700;
font-size: clamp(34px, 5.4vw, 62px);
line-height: 1.02;
letter-spacing: var(--k-phare);
color: var(--bone);
text-wrap: balance;
}
body.interieure .ap-heros__titre em {
display: block;
margin-top: clamp(10px, 1.2vw, 16px);
font-family: var(--f-body);
font-style: normal;
font-variation-settings: normal;
font-weight: 400;
font-size: clamp(15px, 1.5vw, 20px);
line-height: 1.3;
letter-spacing: var(--k-sous);
color: var(--ash);
}
body.interieure .ap-heros__intro {
margin: clamp(18px, 2.2vw, 28px) 0 0;
max-width: 54ch;
font-size: var(--tx-4);
line-height: 1.5;
color: var(--ash);
}
body.interieure.page--doc .page--tete .doc {
padding: 0;
border: 0;
border-radius: 0;
background: none;
box-shadow: none;
color: inherit;
}
body.interieure.page--doc .page--tete .doc__date {
display: block;
margin: 0 0 clamp(12px, 1.4vw, 18px);
padding: 0;
border: 0;
box-shadow: none;
text-align: left;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
body.interieure.page--doc .page--tete .page__titre {
margin: 0;
max-width: 18ch;
font-size: clamp(30px, 3.8vw, 52px);
line-height: 1.03;
letter-spacing: -0.03em;
color: var(--bone);
text-shadow: none;
}
body.interieure.page--doc .doc__article {
margin: 0;
padding: var(--air-5) 0 0;
border: 0;
border-top: 1px solid var(--line);
border-radius: 0;
background: none;
box-shadow: none;
color: inherit;
scroll-margin-top: calc(52px + var(--air-4));
}
body.interieure.page--doc .doc__article + .doc__article { margin-top: var(--air-5); }
body.interieure.page--doc .doc__article:first-child {
padding-top: 0;
border-top: 0;
}
body.interieure.page--doc .doc__article > h2 {
margin: 0 0 var(--air-3);
font-size: var(--tx-7);
line-height: 1.25;
color: var(--bone);
}
body.interieure.page--doc .doc__art {
display: inline-block;
margin-right: 0.5em;
font-family: var(--f-mono);
font-variation-settings: normal;
font-weight: 500;
font-size: 0.82em;
line-height: 1;
letter-spacing: 0.02em;
font-variant-numeric: tabular-nums;
color: var(--app-no-teinte);
-webkit-text-stroke: 0;
}
@supports (-webkit-text-stroke: 1px red) {
body.interieure.page--doc .doc__art {
color: var(--app-no-teinte);
-webkit-text-stroke: 0;
}
}
body.interieure.page--doc .doc__article > p,
body.interieure.page--doc .doc__article > ul,
body.interieure.page--doc .doc__article > ol { max-width: 74ch; }
body.interieure.page--doc .doc p,
body.interieure.page--doc .doc li {
font-size: var(--tx-4);
line-height: 1.75;
color: var(--ash);
}
body.interieure.page--doc .doc__article > p { margin: 0 0 var(--air-2); }
body.interieure.page--doc .doc__encart {
margin: var(--air-3) 0;
padding: 0 0 0 var(--air-3);
border: 0;
border-left: 2px solid var(--app-no-teinte);
border-radius: 0;
background: none;
box-shadow: none;
max-width: 72ch;
}
body.interieure.page--doc .doc__fin {
margin-top: var(--air-5);
padding-top: var(--air-4);
border-top: 1px solid var(--line);
max-width: 74ch;
}
@media (max-width: 1099px) {
body.interieure.page--doc .doc__article { padding-top: var(--air-4); }
body.interieure.page--doc .doc__article + .doc__article { margin-top: var(--air-4); }
}
body.interieure .bar { padding-block: 7px; }
body.interieure .bar.is-stuck { padding-top: 7px; padding-bottom: 7px; }
body.interieure .bar__retour {
gap: 6px;
font-size: 9.5px;
letter-spacing: 0.10em;
color: var(--ash);
opacity: 0.85;
}
body.interieure .bar__retour:hover { color: var(--bone); opacity: 1; }
body.interieure .bar__retour svg { width: 9px; height: 9px; }
body.interieure .minuteur {
padding: 3px 8px;
font-size: 9.5px;
letter-spacing: 0.08em;
}
body.interieure .bar .mode { width: 24px; height: 24px; }
body.interieure .ap-heros,
body.interieure .page--tete {
padding-top: calc(39px + clamp(30px, 2.9vw, 42px));
padding-bottom: calc(var(--dec-h) + clamp(10px, 1.2vw, 17px));
}
body.interieure .ap-heros__corps > .chapter > .chapter__rule {
background: rgba(255, 255, 255, 0.16);
}
html.est-froid body.interieure .ap-heros__corps > .chapter > .chapter__rule {
background: rgba(11, 27, 38, 0.16);
}
body.interieure.page--doc .page--tete { padding-bottom: var(--air-6); }
body.interieure.page--doc .plaque--corps { padding-top: var(--air-5); }
body.interieure.page--doc .doc__article {
--bone: inherit;
--ash:  inherit;
--line: inherit;
--ink:  inherit;
--eclat:       inherit;
--eclat-vif:   inherit;
--eclat-rvb:   inherit;
--eclat-voile: inherit;
--eclat-lueur: inherit;
--gain:  inherit;
--perte: inherit;
--rouge: inherit;
--rouge-titre: inherit;
--pose:      inherit;
--pose-fort: inherit;
--ap-accent:     inherit;
--ap-accent-rvb: inherit;
--ap-etq:        inherit;
--ap-btn-plein-txt: inherit;
color: inherit;
}
body.interieure .ap-heros__corps > .chapter {
justify-content: flex-start;
}
body.interieure .ap-heros__corps > .chapter > .chapter__rule {
flex: 1 1 0%;
width: auto;
min-width: 20px;
}
body.interieure .ap-heros__corps > .chapter > .ap-heros__etq,
body.interieure .ap-heros__corps > .chapter > .ap-heros__maj {
margin: 0;
flex: 0 0 auto;
}
body.interieure .ap-heros__corps > .chapter > .chapter__rule {
transform: none;
transition: none;
background-image: none;
background-color: rgba(255, 255, 255, 0.16);
}
html.est-froid body.interieure .ap-heros__corps > .chapter > .chapter__rule {
background-color: rgba(11, 27, 38, 0.16);
}
html.est-froid body.interieure.page--doc .doc__article {
background-color: transparent;
background-image: none;
border: 0;
border-radius: 0;
box-shadow: none;
color: inherit;
}
html.est-froid body.interieure.page--doc .doc__article {
border-top: 1px solid var(--line);
}
html.est-froid body.interieure.page--doc .doc__article:first-child {
border-top: 0;
}
body.interieure.page--doc .page--tete .doc {
position: relative;
padding: 0 0 0 clamp(12px, 1.3vw, 17px);
border-left: 2px solid var(--app-no-teinte);
}
body.interieure.page--doc .page--tete .doc__date {
display: flex;
align-items: center;
gap: clamp(10px, 1.2vw, 15px);
margin: 0 0 clamp(14px, 1.6vw, 20px);
padding: 0;
border: 0;
box-shadow: none;
text-align: left;
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
white-space: nowrap;
}
body.interieure.page--doc .page--tete .doc__date::after {
content: "";
flex: 1 1 0%;
height: 1px;
background: var(--line);
}
body.interieure.page--doc .page--tete .page__titre {
margin: 0;
max-width: 17ch;
font-size: clamp(32px, 4.4vw, 62px);
line-height: 1.0;
letter-spacing: -0.034em;
color: var(--bone);
text-shadow: none;
}
body.interieure.page--doc .doc__corps { max-width: none; }
body.interieure.page--doc .doc__article > p,
body.interieure.page--doc .doc__article > ul,
body.interieure.page--doc .doc__article > ol,
body.interieure.page--doc .doc__encart,
body.interieure.page--doc .doc__fin { max-width: 78ch; }
body.interieure.page--doc .page--tete .doc {
padding-left: 0;
border-left: 0;
}
body.interieure.page--doc .page--tete .doc::before {
content: "";
position: absolute;
top: 2px;
bottom: 2px;
left: calc(-1 * clamp(11px, 1.2vw, 16px));
width: 2px;
border-radius: 2px;
background: var(--app-no-teinte);
}
body.interieure .ap-fin {
--fin-lueur:  0.20;
--fin-relief: 0.04;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
column-gap: clamp(26px, 3.6vw, 64px);
padding: clamp(26px, 3.2vw, 42px) clamp(22px, 2.8vw, 38px);
border-radius: var(--r-lg);
background:
radial-gradient(128% 168% at 97% -10%,
rgba(var(--ap-accent-rvb), var(--fin-lueur)) 0%,
rgba(var(--ap-accent-rvb), calc(var(--fin-lueur) * 0.28)) 30%,
rgba(var(--ap-accent-rvb), 0) 58%) 0 0 / 100% 100% no-repeat,
linear-gradient(118deg,
color-mix(in srgb, var(--bone) calc(var(--fin-relief) * 100%), transparent) 0%,
color-mix(in srgb, var(--bone) calc(var(--fin-relief) * 26%), transparent) 18%,
transparent 40%) 0 0 / 100% 100% no-repeat,
var(--carte-fond);
box-shadow:
inset 0 1px 0 color-mix(in srgb, var(--bone) 22%, transparent),
var(--carte-ombre);
}
body.interieure .ap-fin__titre {
grid-column: 1;
grid-row: 1;
margin: 0 0 10px;
}
body.interieure .ap-fin__mot {
grid-column: 1;
grid-row: 2;
margin: 0;
}
body.interieure .ap-fin__actions {
grid-column: 2;
grid-row: 1 / span 2;
justify-content: flex-end;
}
@media (max-width: 900px) {
body.interieure .ap-fin {
grid-template-columns: minmax(0, 1fr);
}
body.interieure .ap-fin__titre,
body.interieure .ap-fin__mot,
body.interieure .ap-fin__actions {
grid-column: 1;
}
body.interieure .ap-fin__mot     { grid-row: 2; margin-bottom: clamp(16px, 2.6vw, 24px); }
body.interieure .ap-fin__actions { grid-row: 3; justify-content: flex-start; }
}
body:not(.accueil) .bar .mode {
--bsc-fond:    rgba(255, 255, 255, 0.075);
--bsc-lustre:  rgba(255, 255, 255, 0.16);
--bsc-filet:   rgba(237, 234, 227, 0.20);
--bsc-ombre:   rgba(0, 0, 0, 0.45);
--bsc-encre:   var(--ash);
position: relative;
isolation: isolate;
justify-content: center;
border-radius: 999px;
border: 1px solid var(--bsc-filet);
color: var(--bsc-encre);
background:
radial-gradient(126% 126% at 50% -6%,
var(--bsc-lustre) 0%,
rgba(255, 255, 255, 0) 58%) 0 0 / 100% 100% no-repeat,
var(--bsc-fond);
box-shadow:
inset 0 1px 0 var(--bsc-lustre),
0 1px 2px var(--bsc-ombre);
transition: border-color 200ms var(--ease), box-shadow 200ms var(--ease),
color 200ms var(--ease);
}
html.est-froid body:not(.accueil) .bar .mode {
--bsc-fond:    #0A1622;
--bsc-lustre:  rgba(255, 255, 255, 0.16);
--bsc-filet:   rgba(10, 22, 34, 0.55);
--bsc-ombre:   rgba(11, 27, 38, 0.28);
--bsc-encre:   #DCE8F0;
}
body:not(.accueil) .bar .mode[aria-pressed="true"] {
--bsc-filet:  rgba(220, 232, 240, 0.34);
--bsc-encre:  #F2F7FA;
}
body:not(.accueil) .bar .mode:hover {
--bsc-filet: rgba(237, 234, 227, 0.42);
}
html:not(.est-froid) body:not(.accueil) .bar .mode:hover {
--bsc-filet:  rgba(237, 234, 227, 0.34);
--bsc-encre:  var(--bone);
}
body:not(.accueil):not(.interieure) .bar .mode {
width: 26px;
height: 26px;
padding: 0;
}
body:not(.accueil) .bar .mode .mode__i svg { width: 12px; height: 12px; }

body.interieure .pk {
--pk-filet:  color-mix(in srgb, var(--bone) 15%, transparent);
--pk-rail:   color-mix(in srgb, var(--bone) 26%, transparent);
--pk-jalon:  22px;
--pk-gout:   clamp(16px, 1.8vw, 26px);
grid-column: 1 / -1;
margin-top: clamp(22px, 2.6vw, 34px);
color: var(--bone);
}
body.interieure .pk__liste {
display: grid;
grid-auto-flow: column;
grid-auto-columns: minmax(0, 1fr);
grid-template-rows: auto auto auto auto;
margin: 0;
padding: 0;
list-style: none;
}
body.interieure .pk__pas {
position: relative;
overflow: hidden;
display: grid;
grid-row: 1 / -1;
grid-template-rows: subgrid;
row-gap: 0;
--pk-pad-g: 0px;
padding-left: var(--pk-pad-g);
padding-right: var(--pk-gout);
border-right: 1px solid var(--pk-filet);
}
body.interieure .pk__pas + .pk__pas { --pk-pad-g: var(--pk-gout); }
body.interieure .pk__pas:last-child {
padding-right: 0;
border-right: 0;
}
body.interieure .pk__no {
position: relative;
z-index: 1;
justify-self: start;
display: inline-grid;
place-items: center;
width: var(--pk-jalon);
height: var(--pk-jalon);
margin-bottom: 14px;
border-radius: 50%;
border: 1px solid var(--pk-rail);
font-family: var(--f-mono);
font-size: 9.5px;
letter-spacing: 0.06em;
line-height: 1;
color: color-mix(in srgb, var(--bone) 78%, transparent);
}
body.interieure .pk__pas::before {
content: '';
position: absolute;
top: calc(var(--pk-jalon) / 2);
left: calc(var(--pk-pad-g) + var(--pk-jalon));
right: 0;
height: 1px;
background: var(--pk-rail);
}
body.interieure .pk__pas:last-child::before {
background: linear-gradient(90deg,
var(--pk-rail) 0%,
var(--pk-rail) 38%,
transparent 100%);
}
body.interieure .pk__pas::after {
content: '';
position: absolute;
top: var(--pk-jalon);
left: calc(var(--pk-pad-g) + var(--pk-jalon) / 2 - 0.5px);
width: 1px;
height: 14px;
background: var(--pk-rail);
}
body.interieure .pk__pas--phare .pk__no {
border-color: var(--ap-accent, var(--rouge));
background: var(--ap-accent, var(--rouge));
color: var(--ap-encre, #F6EFEF);
}
body.interieure .pk__val {
align-self: end;
font-weight: 600;
font-size: clamp(22px, 2.2vw, 30px);
line-height: 1;
letter-spacing: -0.02em;
font-variant-numeric: tabular-nums;
white-space: nowrap;
}
body.interieure .pk__val sup {
font-size: 0.52em;
vertical-align: super;
line-height: 0;
}
body.interieure .pk .pk__val.gain.gain { color: inherit; }
body.interieure .pk__nom {
margin-top: 9px;
font-family: var(--f-mono);
font-size: 10px;
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
line-height: 1.45;
color: color-mix(in srgb, currentColor 80%, transparent);
transition: color 180ms linear;
}
body.interieure .pk__note {
margin-top: 5px;
font-size: 12px;
line-height: 1.45;
color: color-mix(in srgb, currentColor 74%, transparent);
}
@media (hover: hover) and (pointer: fine) {
body.interieure .pk__pas:hover .pk__nom { color: currentColor; }
}
@supports not (grid-template-rows: subgrid) {
body.interieure .pk__liste { grid-template-rows: none; }
body.interieure .pk__pas {
display: block;
grid-row: auto;
grid-template-rows: none;
}
body.interieure .pk__val { display: block; }
}
@media (max-width: 900px) {
body.interieure .pk__liste {
grid-auto-flow: row;
grid-auto-columns: auto;
grid-template-rows: none;
grid-template-columns: minmax(0, 1fr);
}
body.interieure .pk__pas {
grid-row: auto;
grid-template-rows: none;
grid-template-columns: var(--pk-jalon) minmax(0, 1fr);
column-gap: 14px;
--pk-pad-g: 0px;
padding: 0 0 clamp(14px, 3vw, 20px) 0;
border-right: 0;
}
body.interieure .pk__pas:last-child { padding-bottom: 0; }
body.interieure .pk__no {
grid-column: 1;
grid-row: 1 / span 3;
align-self: start;
margin-bottom: 0;
}
body.interieure .pk__val,
body.interieure .pk__nom,
body.interieure .pk__note { grid-column: 2; }
body.interieure .pk__val { align-self: start; }
body.interieure .pk__nom { margin-top: 6px; }
body.interieure .pk__pas::before {
top: var(--pk-jalon);
bottom: 0;
left: calc(var(--pk-jalon) / 2 - 0.5px);
right: auto;
width: 1px;
height: auto;
background: var(--pk-rail);
}
body.interieure .pk__pas:last-child::before {
background: linear-gradient(180deg,
var(--pk-rail) 0%, transparent 100%);
bottom: auto;
height: 16px;
}
body.interieure .pk__pas::after { content: none; }
}
@media (prefers-reduced-motion: reduce) {
body.interieure .pk__nom { transition: none; }
}
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) {
body.interieure .pk__pas { --d: 0s; }
body.interieure .pk__pas:nth-child(2) { --d: 0.24s; }
body.interieure .pk__pas:nth-child(3) { --d: 0.48s; }
body.interieure .pk__pas:nth-child(4) { --d: 0.72s; }
body.interieure .pk__no {
opacity: 0;
transform: scale(0.5);
transition:
opacity   0.50s var(--ease) var(--d),
transform 0.66s var(--ease) var(--d);
animation: pkPose 0.4s linear 2s forwards;
}
body.interieure .pk.is-in .pk__no { opacity: 1; transform: scale(1); }
body.interieure .pk__pas::before {
transform: scaleX(0);
transform-origin: left center;
transition: transform 0.80s var(--ease) calc(var(--d) + 0.24s);
animation: pkFiletX 0.4s linear 2s forwards;
}
body.interieure .pk.is-in .pk__pas::before { transform: scaleX(1); }
body.interieure .pk__pas::after {
transform: scaleY(0);
transform-origin: center top;
transition: transform 0.36s var(--ease) calc(var(--d) + 0.70s);
animation: pkFiletY 0.4s linear 2s forwards;
}
body.interieure .pk.is-in .pk__pas::after { transform: scaleY(1); }
body.interieure .pk__pas {
border-right-color: transparent;
transition: border-right-color 0.6s linear calc(var(--d) + 0.34s);
}
body.interieure .pk.is-in .pk__pas { border-right-color: var(--pk-filet); }
body.interieure .pk__val,
body.interieure .pk__nom,
body.interieure .pk__note {
opacity: 0;
transform: translateY(9px);
transition:
opacity   0.55s var(--ease) var(--dt),
transform 0.62s var(--ease) var(--dt);
animation: pkOuvrir 0.4s linear 2s forwards;
}
body.interieure .pk__val  { --dt: calc(var(--d) + 0.44s); }
body.interieure .pk__nom  { --dt: calc(var(--d) + 0.34s); }
body.interieure .pk__note { --dt: calc(var(--d) + 0.54s); }
body.interieure .pk.is-in .pk__val,
body.interieure .pk.is-in .pk__nom,
body.interieure .pk.is-in .pk__note { opacity: 1; transform: none; }
body.interieure .pk__pas--phare .pk__no {
border-color: var(--pk-rail);
background: transparent;
color: color-mix(in srgb, var(--bone) 78%, transparent);
transition:
opacity          0.50s var(--ease) var(--d),
transform        0.66s var(--ease) var(--d),
background-color 0.44s linear calc(var(--d) + 1.02s),
border-color     0.44s linear calc(var(--d) + 1.02s),
color            0.44s linear calc(var(--d) + 1.02s);
animation: pkAllumer 0.4s linear 2s forwards;
}
body.interieure .pk.is-in .pk__pas--phare .pk__no {
border-color: var(--ap-accent, var(--rouge));
background: var(--ap-accent, var(--rouge));
color: var(--ap-encre, #F6EFEF);
}
body.interieure .pk__pas--phare .pk__no::after {
content: '';
position: absolute;
inset: -3px;
border-radius: 50%;
border: 1px solid var(--ap-accent, var(--rouge));
opacity: 0;
pointer-events: none;
}
body.interieure .pk.is-in .pk__pas--phare .pk__no::after {
animation: pkAnneau 1.1s var(--ease) calc(var(--d) + 1.06s) 1 both;
}
body.interieure .pk__pas { overflow: visible; }
@media (max-width: 900px) {
body.interieure .pk__pas::before {
transform: scaleY(0);
transform-origin: center top;
transition: transform 0.74s var(--ease) calc(var(--d) + 0.24s);
animation: pkFiletY 0.4s linear 2s forwards;
}
body.interieure .pk.is-in .pk__pas::before { transform: scaleY(1); }
}
}
@keyframes pkAnneau {
from { opacity: 0.85; transform: scale(0.85); }
to   { opacity: 0;    transform: scale(2.2); }
}
@keyframes pkOuvrir  { to { opacity: 1; } }
@keyframes pkPose    { to { opacity: 1; transform: scale(1); } }
@keyframes pkFiletX  { to { transform: scaleX(1); } }
@keyframes pkFiletY  { to { transform: scaleY(1); } }
@keyframes pkAllumer { to { background-color: var(--ap-accent, var(--rouge)); border-color: var(--ap-accent, var(--rouge)); color: var(--ap-encre, #F6EFEF); } }

.page--dash .dash {
padding-block: calc(76px + var(--air-6)) var(--air-7);
}
.page--dash .dash--porte {
display: flex;
align-items: center;
min-height: min(86svh, 900px);
}
.interieure .ap-carte.dash-porte {
width: min(430px, 100%);
margin-inline: auto;
padding: clamp(21px, 2.7vw, 30px) clamp(19px, 2.4vw, 26px) clamp(19px, 2.3vw, 24px);
}
.dash-porte__titre {
margin: 0 0 var(--ap-e-1);
font-size: var(--tx-6);
line-height: 1.16;
letter-spacing: var(--k-bloc);
}
.dash-refus {
margin: var(--air-3) 0 0;
padding: 9px 12px;
border-left: 2px solid var(--ap-accent);
border-radius: 0 var(--r-sm) var(--r-sm) 0;
background: rgba(var(--ap-accent-rvb), 0.08);
font-size: var(--tx-2);
line-height: 1.55;
color: var(--bone);
}
.dash-porte__form {
display: flex;
flex-wrap: wrap;
gap: 9px;
margin-top: var(--air-3);
}
.dash-refus + .dash-porte__form { margin-top: 11px; }
.dash-porte__form .ap-btn { flex: 0 0 auto; }
.dash-champ {
flex: 1 1 200px;
min-width: 0;
padding: 11px 14px;
font-family: var(--f-mono);
font-size: 16px;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--bone);
background: rgba(var(--eclat-rvb), 0.05);
border: 1px solid var(--line);
border-radius: var(--r-sm);
transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.dash-champ::placeholder {
color: var(--ash);
opacity: 0.55;
letter-spacing: 0.08em;
}
.dash-champ:focus {
outline: none;
border-color: var(--ap-accent);
box-shadow: 0 0 0 3px rgba(var(--ap-accent-rvb), 0.16);
}
.dash-porte .ap-mention { margin-top: var(--air-3); }
.page--dash .dash-tete .ap-titre { margin-bottom: var(--ap-e-1); }
.page--dash .dash-tete .ap-titre:last-child { margin-bottom: 0; }
.dash-tete .ap-chapitre__mot + .ap-chapitre__mot { margin-top: var(--ap-e-1); }
.dash-flux {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: var(--air-4);
}
.page--dash .ap-titre.dash-sec {
margin: calc(var(--air-4) * 0.5) 0 calc(var(--air-4) * -0.4);
}
.dash-flux > .dash-sec:first-child { margin-top: 0; }
.dash-texte { max-width: var(--mesure); }
.dash-texte .ap-carte__etq { margin-bottom: 8px; }
.dash-nb {
grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
}
.dash-nb .ap-porte__phare {
border-top: 0;
border-bottom: 0;
}
.dash-releve .ap-porte__reperes { padding-block: 7px; }
.dash-releve .ap-porte__reperes > div { flex-wrap: wrap; }
.dash-releve .ap-porte__reperes dd { min-width: 0; overflow-wrap: anywhere; }
.dash-releve .dash-seule { justify-content: flex-start; }
.dash-releve .dash-seule dd { text-align: left; font-weight: 500; }
.dash-bande {
margin: 0;
padding: clamp(9px, 1.1vw, 12px) var(--pk-x, 16px);
background: color-mix(in srgb, var(--bone) 5%, transparent);
border-bottom: 1px solid var(--line);
font-family: var(--f-mono);
font-size: var(--tx-1);
letter-spacing: var(--k-etiquette);
text-transform: uppercase;
color: var(--ash);
}
.dash-offres {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: clamp(10px, 1.2vw, 14px);
width: min(520px, 100%);
}
.dash-offres.ap-grille { width: 100%; }
.dash-offre > .ap-pack__titre,
.dash-offre > .ap-porte__phare { margin-bottom: var(--pk-x); }
.dash-offre__mot {
flex: 1 0 auto;
margin: 0;
padding: 0 var(--pk-x) var(--pk-x);
font-size: var(--tx-2);
line-height: 1.62;
color: var(--ash);
}
.dash-offre__mot a { color: var(--bone); border-bottom: 1px solid var(--line); }
.dash-offre__mot strong { color: var(--bone); font-weight: 500; }
.dash-offre > .ap-pack__cta {
margin-top: auto;
margin-bottom: var(--pk-x);
}
.dash-mention { margin: calc(var(--air-4) * -0.55) 0 0; }
.dash-action { margin: 0; }
.dash-img { margin: 0; }
.dash-img img {
display: block;
max-width: 100%;
height: auto;
border: 1px solid var(--carte-bord);
border-radius: var(--r-sm);
}
.dash-img figcaption {
margin-top: 9px;
font-size: var(--tx-2);
line-height: 1.55;
color: var(--ash);
}
.dash-filet {
height: 1px;
margin: calc(var(--air-4) * 0.2) 0;
border: 0;
background: var(--line);
}
@media (max-width: 620px) {
.interieure .ap-carte.dash-porte { padding: 21px 17px 18px; }
.dash-porte__form .ap-btn { flex: 1 1 100%; }
.page--dash .dash-action .ap-btn { width: 100%; }
.dash-releve .ap-porte__reperes > div { gap: 2px 10px; padding: 7px 0; }
.dash-releve .ap-porte__reperes dd { flex: 1 1 100%; text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
.dash-champ { transition: none; }
}

.est-froid {
--plan-ciel:    #68B8D7;
--plan-fond:    #B9D9E9;
--plan-corps:   #CAE0EC;
--plan-pose:    #DAE8F1;
--plan-tenu:    #E7EFF5;


--plan-neige:   #FFFFFF;


--plan-tenu-rvb:  231, 239, 245;

--plan-ciel-rvb:  104, 184, 215;




--gl-principale:  var(--plan-ciel);    
--gl-secondaire:  var(--plan-corps);   
--gl-profondeur:  #0B2A3E;             
--gl-surface:     var(--plan-pose);    
--gl-texte:       #0B0F14;             
--gl-texte-2:     #2F3C48;             
--gl-accent:      #990000;             


--rouge-titre:    var(--rouge);


--gl-lumiere:     255, 249, 241;       
--gl-translucide: 150, 206, 240;       



--jour:    143deg;
--jour-x:  0.747;

--gl-reflet:      rgba(var(--gl-lumiere), 0.92);  
--gl-reflet-doux: rgba(var(--gl-lumiere), 0.46);
--gl-voile:       rgba(216, 240, 250, 0.55);  
--gl-voile-fort:  rgba(228, 246, 255, 0.80);




--mat-grain-neige:  0.030;   

--mat-givre:        rgba(11, 15, 20, 0.085);
--mat-givre-fort:   rgba(11, 15, 20, 0.130);


--ombre-air-1: calc(3px * var(--jour-x)) 3px 10px rgba(18, 48, 71, 0.10);
--ombre-air-2: calc(18px * var(--jour-x)) 18px 48px -18px rgba(18, 48, 71, 0.24);
--ombre-air-3: calc(54px * var(--jour-x)) 54px 120px -50px rgba(18, 48, 71, 0.34);











--lent:   cubic-bezier(0.32, 0.72, 0.16, 1);  
--vif:    cubic-bezier(0.22, 1, 0.36, 1);     
--t-1: 0.32s;  --t-2: 0.47s;  --t-3: 0.68s;
--t-4: 0.81s;  --t-5: 1.22s;  --t-6: 1.65s;



--ciel-zenith:  var(--gl-principale);
--ciel-median:  #A0CADC;
--ciel-bas:     #BCD7E4;
--horizon:      #C6DCE7;



--seuil-0:      var(--ciel-median);
--seuil-1:      var(--plan-neige);
--seuil-2:      var(--ciel-median);
--seuil-3:      var(--plan-neige);
--seuil-4:      var(--nuit);

--seuil-0-rvb:  160, 202, 220;
--seuil-1-rvb:  255, 255, 255;
--seuil-2-rvb:  160, 202, 220;
--seuil-3-rvb:  255, 255, 255;
--seuil-4-rvb:  10, 22, 34;



--gl-blanc:  var(--gl-secondaire);
--rouge:     var(--gl-accent);
--rouge-nuit:#6B0000;
--gl-noir:   var(--gl-texte);


--nuit:      #0A1622;   
--nuit-haut: #0E1D2C;   
--nuit-bas:  #070F19;   

--gl-gris:   #4A5A67;


--gl-gris-fonce: var(--gl-texte-2);




--gl-crevasse-haut: #122C3C;
--gl-crevasse:      #0A1A24;
--gl-crevasse-bas:  #08161F;
}



.mode {
display: inline-flex;
align-items: center;
gap: 7px;
padding: 6px 12px 6px 10px;
border: 1px solid var(--line);
border-radius: 999px;
background: transparent;
font-family: var(--f-mono);
font-size: 11px;
letter-spacing: 0.14em;
text-transform: uppercase;
line-height: 1;
color: var(--ash);
cursor: pointer;
-webkit-appearance: none;
appearance: none;
-webkit-tap-highlight-color: transparent;
transition: color 0.3s var(--ease), border-color 0.3s var(--ease),
background-color 0.3s var(--ease);
}
.mode:hover { color: var(--bone); border-color: rgba(237, 234, 227, 0.34); }
.mode:focus-visible { outline: 2px solid var(--bone); outline-offset: 3px; }
.mode:active { transform: scale(0.975); }


.mode__i { display: inline-flex; flex: none; }
.mode__i svg { display: block; }


.mode[aria-pressed="true"] {
color: #FF8A8A;
border-color: rgba(255, 138, 138, 0.48);
background: rgba(153, 0, 0, 0.22);
}
.mode[aria-pressed="true"]:hover {
color: #FFB4B4;
border-color: rgba(255, 138, 138, 0.68);
}


@media (max-width: 420px) {
.mode { padding: 7px 9px; gap: 0; }

}





.ciel {
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
opacity: 1;
}


.ciel > canvas {
position: absolute;
inset: 0;
width: 100% !important;
height: 100% !important;
pointer-events: none;
}



.est-froid .accueil #hero {
background-color: var(--ciel-zenith);
background-image: linear-gradient(180deg,
var(--ciel-zenith) 0%,
#85C0D8  33%,
#9BC8DC  66%,
var(--seuil-0) 100%);
}


.est-froid .accueil #clarte {
background-color: var(--seuil-0);
background-image: linear-gradient(180deg,
var(--seuil-0) 0%,
#B1D2E1 100%);


--bone: #0B0F14;
--ash:  var(--gl-gris-fonce);
--line: rgba(11, 15, 20, 0.18);

--eclat:       #990000;
--eclat-vif:   #6B0000;
--eclat-rvb:   153, 0, 0;
--eclat-voile: rgba(153, 0, 0, 0.055);
--eclat-lueur: rgba(153, 0, 0, 0.30);


--gain:  #0A5730;
--perte: #990000;


--carte-fond:  rgba(255, 255, 255, 0.60);
--carte-bord:  rgba(255, 255, 255, 0.75);
--carte-ombre: inset 0 1px 0 var(--gl-reflet-doux), var(--ombre-air-2);
--clarte-accent: #990000;
}


.est-froid .accueil .hero.raccord::before { z-index: 1; }



.est-froid .accueil .hero.raccord { --raccord-rvb: var(--seuil-0-rvb); }


.est-froid .accueil .vault.raccord { --raccord-rvb: var(--seuil-3-rvb); }


.est-froid .accueil .hero.raccord { --raccord-h: clamp(130px, 24vh, 210px); }


.est-froid .accueil #histoire.raccord { --raccord-rvb: var(--seuil-2-rvb); }

.est-froid .accueil #acces.raccord    { --raccord-rvb: var(--seuil-4-rvb); }


.est-froid .accueil .plaque.raccord   { --raccord-h: clamp(72px, 9vw, 130px); }
.est-froid .accueil #histoire.raccord { --raccord-h: clamp(150px, 22vh, 240px); }


.est-froid .accueil #acces.raccord    { --raccord-h: clamp(110px, 20vw, 190px); }




.est-froid .accueil #hero::after {
content: '';
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;

background:

linear-gradient(180deg,
rgba(var(--plan-tenu-rvb), 0) 40%,
rgba(var(--plan-tenu-rvb), 0.10) 68%,
rgba(var(--plan-tenu-rvb), 0.16) 84%,
rgba(var(--plan-tenu-rvb), 0.16) 100%),
radial-gradient(118% 94% at 50% 42%,
rgba(11, 15, 20, 0) 56%,
rgba(11, 15, 20, 0.05) 82%,
rgba(11, 15, 20, 0.10) 100%);
}


.est-froid .accueil .hero__scene,
.est-froid .accueil .hero__foot { position: relative; z-index: 2; }


.est-froid .accueil .hero__contact {
background: radial-gradient(52% 52% at 50% 50%,
rgba(18, 48, 71, 0.13) 0%,
rgba(18, 48, 71, 0.08) 44%,
rgba(18, 48, 71, 0.03) 68%,
transparent 82%);
}



.est-froid .accueil .wordmark__main {
background-image:

linear-gradient(180deg, rgba(255, 214, 214, 0.92) 0%, rgba(255, 214, 214, 0) 7%),

linear-gradient(0deg, rgba(255, 190, 190, 0.24) 0%, rgba(255, 190, 190, 0) 20%),

linear-gradient(177deg,
#B01414 0%,
#A30707 24%,
#990000 52%,
#6B0000 82%,
#4A0000 100%);
}


.est-froid .accueil .wordmark__over { color: rgba(11, 15, 20, 0.70); }



.est-froid .accueil .bar:not(.is-stuck) .bar__nav a { color: #10171F; }
.est-froid .accueil .bar:not(.is-stuck) .bar__nav a:hover { color: var(--rouge); }


.est-froid .logo__b { color: var(--rouge); opacity: 1; }
.est-froid .logo__a { color: var(--gl-noir); opacity: 0.72; }


.est-froid .accueil .bar:not(.is-stuck) .logo__b { color: var(--rouge-nuit); }

.est-froid .accueil .bar:not(.is-stuck) .mode {
color: #123047;
border-color: rgba(18, 48, 71, 0.34);
}
.est-froid .accueil .bar:not(.is-stuck) .mode:hover {
color: var(--gl-noir);
border-color: rgba(18, 48, 71, 0.58);
}
.est-froid .accueil .bar:not(.is-stuck) .mode:focus-visible { outline-color: #123047; }


.est-froid .accueil .bar.is-stuck .mode {
color: #2A3742;
border-color: rgba(11, 15, 20, 0.20);
}
.est-froid .accueil .bar.is-stuck .mode:hover {
color: var(--gl-noir);
border-color: rgba(11, 15, 20, 0.40);
}
.est-froid .accueil .bar.is-stuck .mode:focus-visible { outline-color: #2A3742; }


.est-froid .accueil .bar .mode[aria-pressed="true"] {
color: var(--gl-noir);
border-color: rgba(11, 15, 20, 0.34);
background: rgba(11, 15, 20, 0.05);
}
.est-froid .accueil .bar .mode[aria-pressed="true"]:hover {
border-color: rgba(11, 15, 20, 0.52);
background: rgba(11, 15, 20, 0.09);
}


.est-froid .bar.is-stuck {
background: #EDF3F9;
border-bottom-color: rgba(11, 15, 20, 0.14);
}
.est-froid .bar.is-stuck .bar__nav a,
.est-froid .bar.is-stuck .bar__retour { color: #2A3742; }
.est-froid .bar.is-stuck .bar__nav a:hover,
.est-froid .bar.is-stuck .bar__retour:hover { color: var(--rouge); }
.est-froid .bar.is-stuck .minuteur {
color: var(--gl-gris);
border-color: rgba(11, 15, 20, 0.18);
}
.est-froid .bar.is-stuck .minuteur__point { background: var(--gl-gris); }
.est-froid .bar.is-stuck .minuteur.is-alerte {
color: var(--rouge);
border-color: rgba(153, 0, 0, 0.42);
background: rgba(153, 0, 0, 0.06);
}
.est-froid .bar.is-stuck .minuteur.is-alerte .minuteur__point { background: var(--rouge); }


.est-froid .accueil .cue__label { color: rgba(11, 15, 20, 0.80); }
.est-froid .accueil .cue:hover .cue__label { color: var(--rouge); }
.est-froid .accueil .cue__track { background: rgba(11, 15, 20, 0.18); }
.est-froid .accueil .cue__track i { background: var(--rouge); }






.est-froid .accueil {
background: var(--gl-blanc);
color: var(--gl-noir);
}


.est-froid .accueil::before {
background: repeating-linear-gradient(
90deg,
rgba(11, 15, 20, var(--mat-grain-neige)) 0 1px,
transparent 1px 4px
);
}



.est-froid .accueil .plaque {


--acier-haut:  var(--plan-neige);
--acier-clair: var(--plan-neige);
--acier:       var(--plan-neige);
--acier-bas:   var(--plan-neige);


--bone: #0B0F14;
--ash:  var(--gl-gris-fonce);
--line: rgba(11, 15, 20, 0.15);
--ink:  var(--plan-tenu);


--eclat:       #990000;
--eclat-vif:   #6B0000;
--eclat-rvb:   153, 0, 0;
--eclat-voile: rgba(153, 0, 0, 0.055);
--eclat-lueur: rgba(153, 0, 0, 0.30);


}


.est-froid .accueil .plaque::after { opacity: 0.040; }


.est-froid .accueil .chapter__label { color: var(--gl-gris-fonce); }

.est-froid .accueil .chapter__rule { --trait: rgba(11, 15, 20, 0.16); }


.est-froid .accueil .plaque .doc p,
.est-froid .accueil .plaque .doc li,
.est-froid .accueil .plaque .note { color: var(--gl-gris-fonce); }
.est-froid .accueil .plaque .doc__encart {
border-left-color: rgba(153, 0, 0, 0.34);
background: rgba(153, 0, 0, 0.035);
}






.est-froid .accueil #cercle {



background-color: var(--ciel-median);

background-image:
linear-gradient(180deg,
var(--seuil-2) 0%,
#AACEDF 34%,
#B3D2E1 68%,
var(--seuil-3) 100%);
background-size:   100% 100%;
background-repeat: no-repeat;
background-position: 0 0;



--acier-haut:  var(--horizon);
--acier-clair: var(--plan-tenu);
--acier:       var(--plan-pose);
--acier-bas:   var(--plan-corps);

--bone: #0B0F14;
--ash:  var(--gl-gris-fonce);
--line: rgba(11, 15, 20, 0.18);


color: #0B0F14;

--eclat:       #990000;
--eclat-vif:   #6B0000;
--eclat-rvb:   153, 0, 0;
--eclat-voile: rgba(153, 0, 0, 0.055);
--eclat-lueur: rgba(153, 0, 0, 0.30);
}






.est-froid .accueil .roue {
--eclat:     var(--cercle, #EDEAE3);
--eclat-rvb: var(--cercle-rvb, 237, 234, 227);

--eclat-vif: #FFFFFF;
}



.est-froid .accueil .panneau {

--bone: var(--bc-texte);
--ash:  var(--bc-texte-2);
--line: var(--bc-filet);
--ink:  var(--gl-noir);

--eclat:       #CFE9FA;
--eclat-vif:   #FFFFFF;
--eclat-rvb:   207, 233, 250;
--eclat-voile: rgba(207, 233, 250, 0.14);
--eclat-lueur: rgba(207, 233, 250, 0.34);
--pose:      rgba(190, 226, 248, 0.055);
--pose-fort: rgba(190, 226, 248, 0.095);
color: var(--bone);

background-image: none;
background-color: #102837;

--creux: rgba(207, 233, 250, 0.06);

box-shadow:
inset 0 1px 0 var(--bc-reflet),
inset 0 0 0 1px var(--bc-bord),
inset 0 -1px 0 var(--bc-tranche),
0 14px 34px -20px rgba(var(--bc-ombre-rvb), var(--bc-ombre-a)),
0 2px 8px -4px rgba(var(--bc-ombre-rvb), 0.5);
}


.est-froid .accueil .panneau__nom,
.est-froid .accueil .panneau__etat {
color: var(--bc-texte-3);
}



.est-froid .foot {

background: var(--seuil-4);

--bone: #EDF3F9;
--ash:  #8CA0B3;
}

.est-froid .accueil .foot { border-top-color: transparent; }
.est-froid .foot__grid a:hover { color: var(--rouge); }








.est-froid .accueil .plaque,
.est-froid .accueil #cercle {
--line: var(--mat-givre);


--carte-fond:  rgba(255, 255, 255, 0.60);
--carte-bord:  rgba(255, 255, 255, 0.75);
--carte-ombre: inset 0 1px 0 var(--gl-reflet-doux), var(--ombre-air-2);
}




.est-froid .accueil {
--ombre-1: var(--ombre-air-1);
--ombre-2: var(--ombre-air-2);
--ombre-3: var(--ombre-air-3);
--lueur-haut: inset 0 1px 0 var(--gl-voile-fort);
--ombre-plaque: calc(30px * var(--jour-x)) 26px 64px -30px rgba(18, 48, 71, 0.30);


}












.est-froid .accueil .raccord::before {
background-image: linear-gradient(180deg,
rgba(var(--raccord-rvb), 0)    0%,
rgba(var(--raccord-rvb), 0.10) 20%,
rgba(var(--raccord-rvb), 0.28) 40%,
rgba(var(--raccord-rvb), 0.50) 60%,
rgba(var(--raccord-rvb), 0.75) 80%,
rgba(var(--raccord-rvb), 0.92) 92%,
rgba(var(--raccord-rvb), 1)   100%);
}





.est-froid .accueil .ligne input::placeholder,
.est-froid .accueil .ligne textarea::placeholder { color: #4E6D82; }
.est-froid .accueil .ligne--code input::placeholder { color: #40607A; }






.est-froid .accueil .avis--ko {
--avis-t: #FF8A8A;
--avis-b: rgba(255, 138, 138, 0.52);
--avis-f: rgba(255, 138, 138, 0.085);
}

.est-froid .accueil .avis--ok {
--avis-t: var(--gain);
--avis-b: rgba(79, 201, 138, 0.46);
--avis-f: rgba(79, 201, 138, 0.095);
}










.est-froid .accueil .roue::before {
background:
radial-gradient(96% 78% at 50% -12%,
rgba(214, 240, 255, 0.14) 0%,
rgba(214, 240, 255, 0.038) 38%,
rgba(214, 240, 255, 0) 66%),
radial-gradient(78% 78% at 50% 52%,
#0E2E42 0%,
#08202F 56%,
#04121C 100%);
box-shadow:
inset 0 2px 5px rgba(2, 12, 20, 0.90),
inset 0 -1px 0 rgba(190, 226, 248, 0.09);
}


.est-froid .accueil .roue__grad {
background: repeating-conic-gradient(from 0deg,
rgba(206, 232, 248, 0.34) 0deg 0.28deg,
rgba(206, 232, 248, 0) 0.28deg 6deg);
}


.est-froid .accueil .roue__biseau {
background: conic-gradient(from 212deg,
#1E2E3A   0deg,
#5C7385  52deg,
#CFE4F2  94deg,
#6F8899 138deg,
#223341 196deg,
#4A6072 262deg,
#93B0C4 318deg,
#1E2E3A 360deg);
}


.est-froid .accueil .coeur__disque {
background-image:
radial-gradient(34% 34% at 28% 17%,
rgba(255, 255, 255, 0.86) 0%,
rgba(255, 255, 255, 0) 74%),

linear-gradient(158deg,
#E9F3FA 0%,
#D8E9F5 32%,
#A9C3D5 60%,
#7F9AAE 84%,
#6D89A1 100%);
box-shadow:
inset 0 1.5px 0 rgba(255, 255, 255, 0.94),
inset 0 -2.5px 5px rgba(8, 30, 46, 0.40),
0 0 0 1px rgba(8, 30, 46, 0.66),
0 3px 5px rgba(6, 22, 34, 0.46),
0 20px 38px -16px rgba(10, 34, 52, 0.74);
}
.est-froid .accueil .coeur__marque { fill: #0B1B26; }
.est-froid .accueil .coeur__mot    { color: #0B1B26; }
.est-froid .accueil .roue__coeur::before {
box-shadow:
inset 0 1px 0 rgba(214, 240, 255, 0.18),
inset 0 0 0 1px rgba(214, 240, 255, 0.08),
0 0 26px rgba(4, 18, 28, 0.80);
}


.est-froid .accueil .place.est-prise {
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.92),
inset 0 -1.5px 2px rgba(8, 30, 46, 0.34),
0 3px 8px -2px rgba(4, 18, 28, 0.88);
}
.est-froid .accueil .place.est-libre { background-color: #061420; }








.est-froid {


--cmd-repos: linear-gradient(var(--jour),
#FBFCFE 0%, #F3F5F7 30%, #E6EBEF 72%, #D5DFE8 100%);
--cmd-pres: linear-gradient(var(--jour),
#FFFFFF 0%, #FAFCFD 22%, #F0F3F6 66%, #E2E9F0 100%);
--cmd-loin: linear-gradient(var(--jour),
#F3F5F7 0%, #E9EEF2 38%, #DCE4EB 78%, #CCD8E3 100%);
--cmd-mort: linear-gradient(var(--jour),
#E9EDF1 0%, #E6EBEF 30%, #E2E7EC 72%, #DEE4EA 100%);


--cmd-ombre:      5px 7px 20px -10px rgba(18, 48, 71, 0.42);
--cmd-ombre-pres: 9px 12px 30px -12px rgba(18, 48, 71, 0.46);
--cmd-ombre-loin: 2px 3px 8px  -4px  rgba(18, 48, 71, 0.34);


--cmd-arete: inset 1px 1px 0 var(--gl-reflet),
inset -1px -1px 0 rgba(11, 27, 38, 0.10);
--cmd-arete-pres: inset 1px 1px 0 #FFFFFF,
inset -1px -1px 0 rgba(11, 27, 38, 0.08);
}

.est-froid .accueil .presser {
border-color: rgba(11, 27, 38, 0.09);
background-color: var(--plan-pose);
background-image: var(--cmd-repos);
color: var(--gl-texte);
box-shadow: var(--cmd-arete), var(--cmd-ombre);

transition: background-image 0.22s var(--vif),
background-color 0.22s var(--vif),
border-color 0.22s var(--vif),
box-shadow 0.22s var(--vif),
color 0.22s var(--vif),
transform 0.10s ease-out;
}

@media (hover: hover) and (pointer: fine) {
.est-froid .accueil .presser:hover {
border-color: rgba(11, 27, 38, 0.07);
background-color: var(--plan-tenu);
background-image: var(--cmd-pres);
box-shadow: var(--cmd-arete-pres), var(--cmd-ombre-pres);
}
}


.est-froid .accueil .presser:active {
background-image: var(--cmd-loin);
box-shadow: inset 1px 1px 0 var(--gl-reflet-doux),
inset -1px -1px 0 rgba(11, 27, 38, 0.12),
var(--cmd-ombre-loin);

transform: translate(1px, 1px) scale(0.995);
}

.est-froid .accueil .presser:focus-visible {
outline: 2px solid var(--gl-accent);
outline-offset: 3px;
}



.est-froid .accueil .entrer { color: var(--ink, #0B1B26); }
.est-froid .accueil .entrer:focus-visible {
outline: 2px solid #123047;
outline-offset: 4px;
}

.est-froid .accueil .presser[disabled],
.est-froid .accueil .presser[disabled]:hover,
.est-froid .accueil .presser[disabled]:active {
opacity: 1;
border-color: rgba(11, 27, 38, 0.07);
background-color: var(--plan-pose);
background-image: var(--cmd-mort);

color: #55636F;
box-shadow: none;
transform: none;
}




.est-froid .accueil .coffre {

--co-trace:    rgba(11, 27, 38, 0.36);
--co-cadre:    transparent;
--co-cadre-2:  transparent;
--co-rime:     transparent;
--co-fond:     transparent;
--co-bande:    transparent;
--co-filet:    var(--mat-givre);
--co-rail:     transparent;
--co-gouttiere: transparent;
--co-vive:     transparent;
--co-ouverte:  transparent;
--co-tiroir:   transparent;
--co-creux:    none;
--co-ombre:    none;


--co-marque:   var(--gl-accent);
--co-marque-2: rgba(11, 27, 38, 0.14);



--co-galet:        transparent;
--co-galet-bord:   transparent;
--co-galet-encre:  var(--gl-texte);
--co-galet-ombre:  none;

--co-galet-vif:       transparent;
--co-galet-vif-bord:  transparent;
--co-galet-vif-encre: var(--gl-accent);
}


.est-froid .accueil .recit {
--co-jour-sombre: 18, 48, 71;
}





.est-froid .accueil { --ease: var(--lent); }


.est-froid .accueil .presser,
.est-froid .accueil .ligne input,
.est-froid .accueil .ligne textarea,
.est-froid .accueil .mode {
--ease: var(--vif);
}


.est-froid .accueil .reveal         { transition-duration: var(--t-5); }
.est-froid .accueil .roue__halo     { transition-duration: var(--t-4); }




@media (prefers-reduced-motion: reduce) {
.mode:active { transform: none; }
.est-froid .accueil .reveal,
.est-froid .accueil .roue__halo { transition-duration: 0.01ms; }



.est-froid .accueil .presser,
.est-froid .accueil .entrer {
transition-duration: 0.01ms;
}
.est-froid .accueil .presser:active,
.est-froid .accueil .entrer:active { transform: none; }
}









.est-froid .accueil #clarte.raccord { --raccord-rvb: var(--seuil-1-rvb); }

.est-froid .raccord--decoupe {

--ch-noir: none;
--ch-froid: inline;

--ch-eclat: brightness(1.02) contrast(1.05);
}

.est-froid .accueil .raccord--decoupe {
--dec-ombre-c: #163B55;
--dec-ombre-a: 0.16;
}





.est-froid .perdue .perdu {

--bone:  var(--gl-texte);
--ash:   var(--gl-texte-2);
--line:  rgba(11, 15, 20, 0.16);

--rouge: var(--gl-accent);
color: var(--bone);
background-color: var(--plan-corps);
background-image: linear-gradient(180deg,
#9CC4DA 0%,
#BBD4E2 38%,
var(--plan-corps) 100%);
}


.est-froid .perdue .perdu__geant {
background-image:
linear-gradient(180deg, rgba(255, 214, 214, 0.92) 0%, rgba(255, 214, 214, 0) 7%),
linear-gradient(0deg, rgba(255, 190, 190, 0.24) 0%, rgba(255, 190, 190, 0) 20%),
linear-gradient(177deg,
#B01414 0%,
#A30707 24%,
#990000 52%,
#6B0000 82%,
#4A0000 100%);
}


.est-froid .perdue .perdu__ovale {
background-color: var(--plan-pose);
background-image: linear-gradient(180deg,
var(--plan-fond) 0%,
var(--plan-tenu) 30%,
var(--plan-pose) 62%,
var(--plan-fond) 86%,
var(--plan-tenu) 100%);
}







.est-froid .interieure {
background: var(--gl-blanc);
color: var(--gl-noir);
}


.est-froid .interieure .page {

--bone:  var(--gl-texte);
--ash:   var(--gl-texte-2);
--line:  rgba(11, 15, 20, 0.16);
--rouge: var(--gl-accent);
--eclat:       var(--gl-accent);
--eclat-vif:   var(--rouge-nuit);
--eclat-rvb:   153, 0, 0;
--eclat-voile: rgba(153, 0, 0, 0.055);
--eclat-lueur: rgba(153, 0, 0, 0.30);

--gain:  #0A5730;
--perte: var(--gl-accent);

--pose:      rgba(255, 255, 255, 0.42);
--pose-fort: rgba(255, 255, 255, 0.62);
color: var(--bone);
background-color: var(--ciel-bas);
background-image: linear-gradient(180deg,
var(--ciel-median)  0%,
var(--ciel-bas)    58%,
var(--horizon)    100%);
}

.est-froid .interieure .page.raccord { --raccord-rvb: var(--plan-tenu-rvb); }





.est-froid .interieure .plaque {

--acier-haut:  var(--plan-tenu);
--acier-clair: var(--plan-tenu);
--acier:       var(--plan-tenu);
--acier-bas:   var(--plan-tenu);

--bone: var(--gl-texte);
--ash:  var(--gl-gris-fonce);
--line: rgba(11, 15, 20, 0.15);
--ink:  var(--plan-tenu);


--eclat:       var(--gl-accent);
--eclat-vif:   var(--rouge-nuit);
--eclat-rvb:   153, 0, 0;
--eclat-voile: rgba(153, 0, 0, 0.055);
--eclat-lueur: rgba(153, 0, 0, 0.30);


--pose:      var(--plan-neige);
--pose-fort: #FFFFFF;
}

.est-froid .interieure .plaque::after { opacity: 0.040; }


.est-froid .interieure .plaque .jalon,
.est-froid .interieure .plaque .etapes li,
.est-froid .interieure .plaque .mise {
box-shadow: inset 0 1px 0 var(--gl-reflet-doux),
inset 0 0 0 1px rgba(11, 27, 38, 0.07),
var(--ombre-air-1);
}


.est-froid .interieure .doc p,
.est-froid .interieure .doc li,
.est-froid .interieure .note,
.est-froid .interieure .doc__fin { color: var(--gl-gris-fonce); }

.est-froid .interieure .laque .doc p,
.est-froid .interieure .laque .doc li,
.est-froid .interieure .laque .note,
.est-froid .interieure .laque .doc__fin,
.est-froid .interieure .pack .note,
.est-froid .interieure .phare .note { color: var(--ash); }
.est-froid .interieure .plaque .doc__encart {
border-left-color: rgba(153, 0, 0, 0.34);
background: rgba(153, 0, 0, 0.035);
}


.est-froid .interieure .laque,
.est-froid .interieure .phare,
.est-froid .interieure .pack {

--bone: #EDF5FC;
--ash:  #9DBBD0;
--line: rgba(190, 226, 248, 0.16);
--ink:  var(--gl-noir);

--eclat:       #CFE9FA;
--eclat-vif:   #FFFFFF;
--eclat-rvb:   207, 233, 250;
--eclat-voile: rgba(207, 233, 250, 0.14);
--eclat-lueur: rgba(207, 233, 250, 0.34);
--pose:      rgba(190, 226, 248, 0.055);
--pose-fort: rgba(190, 226, 248, 0.095);

--gain:  #4FC98A;

--perte: #E27A78;
color: var(--bone);
background-color: var(--gl-crevasse);
background-image:

url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='i' x='0' y='0' width='100%25' height='100%25' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.86' numOctaves='2' seed='9' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.80 0 0 0 0 0.91 0 0 0 0 1 0.03 0 0 0 -0.01'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23i)'/%3E%3C/svg%3E"),

radial-gradient(120% 66% at 50% -8%,
rgba(var(--gl-translucide), 0.20) 0%,
rgba(var(--gl-translucide), 0.06) 52%,
rgba(var(--gl-translucide), 0)    80%),

linear-gradient(178deg,
var(--gl-crevasse-haut) 0%,
var(--gl-crevasse)    100%);
background-size: 180px 180px, 100% 100%, 100% 100%;
background-repeat: repeat, no-repeat, no-repeat;

box-shadow:
inset 0 1px 0 var(--gl-voile),
inset 0 0 0 1px rgba(var(--gl-translucide), 0.10),
var(--ombre-air-2);
border-color: rgba(var(--gl-translucide), 0.14);
}

.est-froid .interieure .pack:hover {
border-color: rgba(var(--gl-translucide), 0.34);
box-shadow:
inset 0 1px 0 var(--gl-voile-fort),
inset 0 0 0 1px rgba(var(--gl-translucide), 0.20),
var(--ombre-air-3);
}



.est-froid .interieure .laque .cle__ok,
.est-froid .interieure .pack .cle__ok { border-color: rgba(207, 233, 250, 0.26); }


.est-froid .interieure .plaque .cle__ok {
border-color: rgba(153, 0, 0, 0.38);
color: var(--gl-accent);
}
.est-froid .interieure .plaque .cle__ok:hover {
background: var(--gl-accent);
border-color: var(--gl-accent);
color: var(--plan-neige);
}
.est-froid .interieure .plaque .cle__ok:focus-visible {
outline: 2px solid var(--gl-accent);
outline-offset: 2px;
}

.est-froid .interieure .laque .cle__ok:hover,
.est-froid .interieure .pack .cle__ok:hover {
background: #CFE9FA;
border-color: #CFE9FA;
color: var(--gl-crevasse);
}

.est-froid .interieure .pack .cle__ok {
background-color: var(--plan-pose);
background-image: var(--cmd-repos);
border-color: rgba(11, 27, 38, 0.09);
color: var(--gl-texte);
box-shadow: var(--cmd-arete), var(--cmd-ombre);
}
.est-froid .interieure .pack .cle__ok:hover {
background-color: var(--plan-tenu);
background-image: var(--cmd-pres);
border-color: rgba(11, 27, 38, 0.09);
color: var(--gl-texte);
box-shadow: var(--cmd-arete-pres), var(--cmd-ombre-pres);
}
.est-froid .interieure .pack .cle__ok:active {
background-image: var(--cmd-loin);
box-shadow: var(--cmd-arete), var(--cmd-ombre-loin);
}





.est-froid body.app {
background: var(--ap-voile);
color: var(--bone);


--ap-voile: var(--plan-corps);


--ap-vers-sol-rvb:  202, 224, 236;   
--ap-vers-ciel-rvb: 202, 224, 236;   
--ap-vers-nuit-rvb: 10, 22, 34;      
}


.est-froid body.app .ap-ciel {
--bone: var(--gl-texte);
--ash:  var(--gl-texte-2);
--line: rgba(11, 15, 20, 0.16);
--eclat:       var(--gl-accent);
--eclat-vif:   var(--rouge-nuit);
--eclat-rvb:   153, 0, 0;
--eclat-voile: rgba(153, 0, 0, 0.055);
--eclat-lueur: rgba(153, 0, 0, 0.30);
--gain:  #0A5730;
--perte: var(--gl-accent);
--ap-accent:     var(--id-jour);
--ap-accent-rvb: var(--id-jour-rvb);
--ap-encre:      #FFFFFF;
--ap-etq: var(--id-jour);


--fond-c: var(--plan-corps);
--fond-img:    none;
--fond-taille: auto;
--fond-rep:    no-repeat;

--carte-fond:  rgba(255, 255, 255, 0.60);
--carte-bord:  rgba(255, 255, 255, 0.75);
--carte-ombre: inset 0 1px 0 var(--gl-reflet-doux), var(--ombre-air-2);
--ap-btn-plein-txt: #F1F7FB;
}


.est-froid body.app .ap-sol {
--bone: var(--gl-texte);
--ash:  var(--gl-gris-fonce);
--line: rgba(11, 15, 20, 0.15);
--ink:  var(--plan-tenu);
--eclat:       var(--gl-accent);
--eclat-vif:   var(--rouge-nuit);
--eclat-rvb:   153, 0, 0;
--eclat-voile: rgba(153, 0, 0, 0.055);
--eclat-lueur: rgba(153, 0, 0, 0.30);
--gain:  #0A5730;
--perte: var(--gl-accent);
--rouge: var(--gl-accent);
--rouge-titre: var(--gl-accent);
--ap-accent:     var(--id-jour);
--ap-accent-rvb: var(--id-jour-rvb);
--ap-encre:      #FFFFFF;
--ap-etq: var(--id-jour);


--fond-c: var(--plan-neige);
--fond-img:    none;
--fond-taille: auto;
--fond-rep:    no-repeat;


--carte-fond:  var(--plan-tenu);
--carte-bord:  rgba(11, 27, 38, 0.14);
--carte-ombre: inset 0 1px 0 var(--gl-reflet-doux), var(--ombre-air-2);
--ap-btn-plein-txt: #F1F7FB;
}


.est-froid body.app .raccord--decoupe {
--dec-ombre-c: #123047;
--dec-ombre-a: 0.22;
}


.est-froid .accueil .carte3d__mode { --mode-bord: rgba(11, 27, 38, 0.18); }


.est-froid .accueil .clarte,
.est-froid .accueil .vault { --titre-accent: #990000; }





.est-froid .accueil .carte3d--clair,
.est-froid .accueil .etape,
.est-froid .accueil .panneau,
.est-froid .accueil .fiche,

.est-froid body.interieure {

--bc-fond:       linear-gradient(135deg, #08161F 0%, #122C3C 25%, #0A1A24 50%, #16354A 75%, #08161F 100%);
--bc-lumiere:    rgba(207, 233, 250, 0.06);
--bc-filet:      rgba(207, 233, 250, 0.18);
--bc-bord:       rgba(207, 233, 250, 0.10);
--bc-reflet:     rgba(207, 233, 250, 0.15);
--bc-bande:      #04101A;
--bc-ombre-rvb:  18, 48, 71;
--bc-ombre-a:    0.45;

--bc-puce:       linear-gradient(140deg, #F4F9FB 0%, #AFC2CF 50%, #DDE9F0 100%);
--bc-puce-trait: rgba(11, 27, 38, 0.36);
--bc-puce-bord:  rgba(11, 27, 38, 0.24);

--bc-guilloche:  rgba(207, 233, 250, 0.05);

--bc-holo-a:     0.56;

--bc-sig-bord:   rgba(11, 27, 38, 0.20);
}


.est-froid .accueil .fiche { --fiche-plat: #112837; }


.est-froid body.mur {

--bone: #EDF2F5;
--ash:  #8193A1;
--line: rgba(237, 242, 245, 0.13);

--mur-fond-h:  #0E1D2C;
--mur-fond-b:  #070F19;
--mur-carte-h: #13273A;
--mur-carte-b: #0B1826;
--mur-oeil:    #060D14;

}

/*ibmyko-src:c49966131e1d5ffd:247094*/