.rc { --rc-e: max(var(--g), calc((100vw - 1600px) / 2)); }


.rc-js .rc-j, .rc-js .rj { display: none; }
.rc-js.rc-v-job .rc-j { display: block; }
.rc-js .rj.is-on { display: grid; }
.rc-js.rc-v-job :is(.rc-op, .rc-l, .rc-w) { display: none; }


.rc-op { position: relative; isolation: isolate; display: grid; align-content: start; block-size: clamp(392px, 47svh, 540px); padding: clamp(92px, 11.5svh, 112px) var(--rc-e) 32px; background: #0B0E0F; color: var(--light); overflow: hidden; }
.rc-op__f { position: absolute; inset: 0; z-index: -1; margin: 0; overflow: hidden; }
.rc-op__f img { inline-size: 100%; block-size: 100%; object-fit: cover; object-position: 50% 10%; }
.rc-op__f::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,14,15,.72) 0%, rgba(11,14,15,0) 34%), linear-gradient(90deg, rgba(11,14,15,.9) 0%, rgba(11,14,15,.78) 38%, rgba(11,14,15,.18) 66%, rgba(11,14,15,.05) 100%); } 
.rc-op__c .po__p { font-size: 15.5px; }



.rc-l { --line: rgba(var(--lt), .16); --ink2: rgba(var(--lt), .72); padding: clamp(36px, 3.4vw, 56px) var(--rc-e) 0; background: var(--graphite); color: var(--light); }
.rc-l__h { font-size: clamp(22px, 1.8vw, 28px); font-weight: 400; line-height: 1.15; }
.rc-rows { margin-block-start: clamp(14px, 1.4vw, 22px); border-block-start: 1px solid var(--line); }
.rr { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(9em, 13em) 7.5em 48px; align-items: center; gap: 6px clamp(16px, 2vw, 40px); padding-block: clamp(14px, 1.3vw, 22px); color: var(--ink); text-decoration: none; transition: opacity .35s var(--e); }
.rr::before, .rr::after { content: ""; position: absolute; inset: auto 0 -1px; block-size: 1px; background: var(--line); }
.rr::after { block-size: 2px; background: var(--amber); transform: scaleX(0); transform-origin: 0 50%; transition: transform .45s var(--e); } 
.rr__t { inline-size: fit-content; font-size: clamp(24px, 2.45vw, 40px); font-weight: 400; line-height: 1.12; text-wrap: balance; }
.rr__ms { display: contents; }
.rr__m { font-size: clamp(15px, 1.05vw, 17px); line-height: 1.35; color: var(--ink2); white-space: nowrap; }
.rr__go { position: relative; display: grid; place-items: center; inline-size: 48px; block-size: 48px; justify-self: end; color: var(--ink); }
.rr__go::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--amber); scale: .4; opacity: 0; transition: scale .45s var(--e), opacity .3s var(--e); }
.rr__go svg { position: relative; inline-size: 18px; block-size: 18px; transition: translate .45s var(--e); }
@media (hover: hover) {
  .rr:hover::after { transform: none; }
  .rr:hover .rr__go::before { scale: 1; opacity: 1; }
  .rr:hover .rr__go { color: var(--graphite); }
  .rr:hover .rr__go svg { translate: 2px 0; }
  .rc-rows:has(.rr:hover) .rr:not(:hover) { opacity: .5; }
}
.rr:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.rr:focus-visible::after, .rr.is-from::after { transform: none; }
.rr:focus-visible .rr__go::before { scale: 1; opacity: 1; }
.rr:focus-visible .rr__go { color: var(--graphite); }
.rc-rows:has(.rr:focus-visible) .rr:not(:focus-visible) { opacity: .5; }
.rr:active { background: var(--mist); }


.rc-sp { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 20px clamp(32px, 4vw, 72px); margin: clamp(36px, 3.6vw, 56px) calc(var(--rc-e) * -1) 0; padding: clamp(28px, 2.8vw, 44px) var(--rc-e); background: var(--raised, #14191A); color: var(--light); text-decoration: none; }
.rc-sp__w { display: block; }
.rc-sp__q { font-size: clamp(22px, 1.9vw, 30px); font-weight: 400; line-height: 1.15; }
.rc-sp__s { max-inline-size: 42em; margin-block-start: 8px; font-size: clamp(15.5px, 1.1vw, 17px); line-height: 1.5; color: var(--ink2); text-wrap: pretty; }
.rc-sp__b { pointer-events: none; }
@media (hover: hover) { .rc-sp:hover .bt { color: var(--graphite); } .rc-sp:hover .bt::before { inline-size: calc(100% - 12px); } .rc-sp:hover .bt::after { translate: 3px 0; } }
.rc-sp:focus-visible { outline: 2px solid var(--ink); outline-offset: -8px; }
.rc-sp:focus-visible .bt { color: var(--graphite); }
.rc-sp:focus-visible .bt::before { inline-size: calc(100% - 12px); }


.rc-w { padding: clamp(72px, 7vw, 120px) var(--rc-e) clamp(80px, 8vw, 136px); background: var(--white); }
.rc-w__h { font-size: clamp(28px, 2.7vw, 46px); font-weight: 400; line-height: 1.06; text-wrap: balance; }
.rc-w__s { max-inline-size: 40em; margin-block-start: clamp(14px, 1.4vw, 22px); font-size: var(--lead); line-height: 1.5; color: var(--ink2); text-wrap: pretty; }
.rc-w__l { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px clamp(20px, 2.4vw, 44px); margin-block-start: clamp(40px, 4vw, 64px); }
.rc-w__l li { position: relative; padding-block-start: 18px; }
.rc-w__l li::before, .rc-w__l li::after { content: ""; position: absolute; inset: 0 0 auto; block-size: 1px; background: var(--line); }
.rc-w__l li::after { block-size: 2px; background: var(--amber); transform: scaleX(0); transform-origin: 0 50%; transition: transform .6s var(--e); }
@media (hover: hover) { .rc-w__l li:hover::after { transform: none; } }
.rc-w__l h3 { font-size: clamp(20px, 1.5vw, 24px); font-weight: 400; line-height: 1.2; }
.rc-w__l p { margin-block-start: 10px; font-size: 16px; line-height: 1.55; color: var(--ink2); text-wrap: pretty; }


.rc-j { min-block-size: 100svh; padding: clamp(92px, 11svh, 116px) var(--rc-e) clamp(88px, 9vw, 140px); background: var(--white); color: var(--ink); }
.rj { grid-template-columns: minmax(0, 40rem) minmax(296px, 21rem); grid-template-areas: "back back" "title title" "lede card" "body card"; column-gap: clamp(48px, 7vw, 120px); justify-content: center; align-items: start; }
html:not(.rc-js) .rj + .rj { margin-block-start: 96px; } 
.rj__h { display: contents; }
.rj__back, .rj__up { display: inline-flex; align-items: center; gap: 10px; min-block-size: 44px; color: var(--ink); font: 500 15px/1.2 var(--f); text-decoration: none; }
.rj__back { grid-area: back; justify-self: start; }
.rj__back span, .rj__up span { padding-block: 3px; background: linear-gradient(currentColor, currentColor) 100% 100% / 0 1px no-repeat; transition: background-size .45s var(--e); }
.rj__back svg, .rj__up svg { flex: none; transition: translate .45s var(--e); }
@media (hover: hover) { :is(.rj__back, .rj__up):hover span { background-size: 100% 1px; background-position: 0 100%; } :is(.rj__back, .rj__up):hover svg { translate: -4px 0; } }
.rj__t { grid-area: title; inline-size: fit-content; max-inline-size: 18em; margin-block-start: clamp(10px, 1.6vw, 24px); font-size: clamp(36px, 4.3vw, 70px); font-weight: 400; line-height: 1.04; text-wrap: balance; outline: 0; }
.rj__l { grid-area: lede; margin-block-start: clamp(18px, 1.8vw, 28px); font-size: clamp(19px, 1.5vw, 23px); line-height: 1.45; text-wrap: pretty; }
.rj__c { grid-area: card; position: sticky; inset-block-start: 104px; margin-block-start: clamp(22px, 2vw, 32px); padding: clamp(22px, 2vw, 30px); border-radius: var(--r); background: var(--raised, #14191A); box-shadow: inset 0 0 0 1px rgba(var(--lt), .1); color: var(--light); --line: rgba(var(--lt), .16); --ink2: rgba(var(--lt), .7); }
.rj__c .bt { --bt-bg: var(--light); --bt-line: transparent; --bt-ink: var(--graphite); -webkit-backdrop-filter: none; backdrop-filter: none; } 
.rj__f { margin: 0; }
.rj__f > div { display: grid; grid-template-columns: 5.2em minmax(0, 1fr); gap: 10px; padding-block: 12px; border-block-end: 1px solid var(--line); }
.rj__f > div:first-child { padding-block-start: 0; }
.rj__f dt { font-size: 15px; line-height: 1.45; color: var(--ink2); }
.rj__f dd { margin: 0; font-size: 16px; line-height: 1.45; }
.rj__go { margin-block-start: 22px; }
.rj__go .bt { inline-size: 100%; }
.rj__b { grid-area: body; }
.rj__s { margin-block-start: clamp(44px, 4.4vw, 68px); }
.rj__s h2 { margin-block-end: clamp(10px, 1vw, 16px); font-size: clamp(24px, 2vw, 32px); font-weight: 400; line-height: 1.15; }
.rj__s li { padding-block: 13px; border-block-start: 1px solid var(--line); font-size: clamp(18px, 1.25vw, 18.5px); line-height: 1.55; text-wrap: pretty; }
.rj__s li:last-child { border-block-end: 1px solid var(--line); }
.rj__e p { max-inline-size: 34em; font-size: var(--lead); line-height: 1.5; color: var(--ink2); }
.rj__n { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 32px; margin-block-start: clamp(44px, 4.4vw, 64px); padding-block-start: 14px; border-block-start: 1px solid var(--line); }
.rj__nx { display: grid; grid-template-columns: minmax(0, auto) 18px; grid-template-areas: "k go" "t go"; align-items: center; gap: 2px 14px; margin-inline-start: auto; padding-block: 8px; color: var(--ink); text-align: end; text-decoration: none; }
.rj__k { grid-area: k; font-size: 14.5px; color: var(--ink2); }
.rj__nt { grid-area: t; justify-self: end; inline-size: fit-content; font-family: var(--fd); font-size: clamp(21px, 1.7vw, 27px); line-height: 1.15; letter-spacing: -.012em; background: linear-gradient(var(--amber), var(--amber)) 0 100% / 0 2px no-repeat; transition: background-size .45s var(--e); }
.rj__nx svg { grid-area: go; transition: translate .45s var(--e); }
@media (hover: hover) { .rj__nx:hover .rj__nt { background-size: 100% 2px; } .rj__nx:hover svg { translate: 4px 0; } }
.rj__up { order: -1; }


.rd { position: fixed; inset: 0 0 0 auto; inline-size: min(600px, 100vw); max-inline-size: 100vw; block-size: 100dvh; max-block-size: 100dvh; margin: 0 0 0 auto; padding: 0; border: 0; background: var(--graphite); color: var(--light); color-scheme: dark; overflow-y: auto; overscroll-behavior: contain; box-shadow: -1px 0 0 rgba(var(--lt), .14), var(--lift); translate: 100% 0; transition: translate .42s var(--e); } 
.rd.is-open { translate: none; }
.rc .rd, .rd { background: var(--raised, #14191A); box-shadow: -1px 0 0 rgba(var(--lt), .12); }
.rd.is-quick { transition: none; }
.rd::backdrop { background: rgb(7 9 9 / 0); transition: background-color .42s var(--e); }
.rd.is-open::backdrop { background: rgb(7 9 9 / .55); }
.rd.is-quick::backdrop { transition: none; }
.rd__in { position: relative; min-block-size: 100%; padding: clamp(22px, 2.6vw, 36px) clamp(22px, 3vw, 44px) clamp(32px, 3.4vw, 48px); }
.rd__x { position: absolute; inset: clamp(12px, 1.6vw, 22px) clamp(12px, 2.2vw, 30px) auto auto; color: var(--light); }
.rd__h { padding-inline-end: 96px; }
.rd__k { font-size: 15px; line-height: 1.4; color: rgba(var(--lt), .66); }
.rd__t { margin-block-start: 6px; font-size: clamp(28px, 2.3vw, 38px); font-weight: 400; line-height: 1.08; text-wrap: balance; outline: 0; }
.rd__s { margin-block-start: 12px; font-size: 16px; line-height: 1.5; color: rgba(var(--lt), .72); text-wrap: pretty; }
.rd__f { grid-template-columns: minmax(0, 1fr); margin-block-start: 10px; }
.rd__f ::placeholder { color: rgba(var(--lt), .5); opacity: 1; }
.rd__f textarea { min-block-size: 112px; }
.rd .qf__f.is-bad textarea { border-color: #E5735A; }
.rd .qf__f.is-bad[data-why="mail"]::before { content: "Email invalide"; }
.rd .qf__send { margin-block-start: 26px; }

.rd input:-webkit-autofill, .rd input:-webkit-autofill:hover, .rd input:-webkit-autofill:focus, .rd textarea:-webkit-autofill { -webkit-text-fill-color: var(--light); caret-color: var(--light); -webkit-box-shadow: 0 0 0 1000px var(--graphite) inset; box-shadow: 0 0 0 1000px var(--graphite) inset; transition: background-color 100000s 0s, color 100000s 0s; }
.rd input:autofill, .rd textarea:autofill { box-shadow: 0 0 0 1000px var(--graphite) inset; -webkit-text-fill-color: var(--light); }

.rd__ok { margin-block-start: 28px; padding: 22px 24px; border-radius: var(--r); background: rgba(var(--ac), .12); outline: 0; }
.rd__okh { font-size: 18px; line-height: 1.45; }
.rd__oks { margin-block-start: 10px; font-size: 16px; line-height: 1.5; color: rgba(var(--lt), .78); }
.rd__oks a { color: var(--light); text-underline-offset: 3px; }
.rd__oka { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin-block-start: 18px; }
.rd__copy { display: inline-flex; align-items: center; min-block-size: 48px; padding: 0 22px; border: 0; border-radius: 999px; background: var(--light); color: var(--graphite); font: 500 15px/1 var(--f); cursor: pointer; transition: background-color .3s var(--e); }
.rd__copy:hover { background: var(--amber); }
.rd__edit { min-block-size: 44px; padding: 0 2px; border: 0; background: none; color: rgba(var(--lt), .78); font: 500 15px/1 var(--f); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.rd__edit:hover { color: var(--light); }
.rd__txt { inline-size: 100%; margin-block-start: 14px; padding: 12px 14px; border: 1px solid rgba(var(--lt), .24); border-radius: var(--r); background: transparent; color: var(--light); font: 400 16px/1.45 var(--f); }
html.rc-lock { overflow: hidden; }
html.rc-lock.rc-bar { scrollbar-gutter: stable; } 


@keyframes rc-up { from { opacity: 0; translate: 0 14px; } }
@keyframes rc-unfold { from { clip-path: inset(0 100% 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes rc-dev { from { opacity: 0; scale: 1.03; } }
@keyframes rc-in { from { opacity: 0; } }
@keyframes rc-out { to { opacity: 0; } }
@media (prefers-reduced-motion: no-preference) {
  .motion .rc-op__f img { animation: rc-dev .9s var(--e) backwards; }
  .motion .rc-op__c { animation: rc-unfold .6s cubic-bezier(.65, 0, .2, 1) .1s backwards; }
  .motion .rc-l__h { animation: rc-up .5s var(--e) .1s backwards; }
  .motion .rr { animation: rc-up .5s var(--e) backwards; animation-delay: calc(.14s + var(--i, 0) * 45ms); }
  .motion.rc-seen :is(.rc-op__f img, .rc-op__c, .rc-l__h, .rr) { animation: none; }
  .motion .rj.is-in :is(.rj__back, .rj__l, .rj__c, .rj__b) { animation: rc-up .36s var(--e) .12s backwards; } 
  .motion .rj.is-in .rj__c { animation-delay: .16s; }
  .motion .rj.is-in .rj__b { animation-delay: .2s; }
  .rc-pre { opacity: 0; translate: 0 16px; }
  .rc-pre.is-in { opacity: 1; translate: none; transition: opacity .5s var(--e), translate .6s var(--e); transition-delay: calc(var(--i, 0) * 60ms); }
  
  .rc-fade :is(.rc-op__c, .rc-l > *, .rc-w > *) { animation: rc-in .24s linear; }
}

@keyframes rc-sheet-up { from { transform: translateY(100%); } }
@keyframes rc-sheet-down { to { transform: translateY(100%); } }
@keyframes rc-next-out { to { opacity: 0; transform: translateY(-12px); } }
@keyframes rc-next-in { from { opacity: 0; transform: translateY(16px); } }
html.rc-vt .nv { view-transition-name: rc-nv; }
html.rc-vt::view-transition-group(root) { animation: none; }
html.rc-vt::view-transition-old(root), html.rc-vt::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
html.rc-vt-up::view-transition-old(root) { z-index: 0; }
html.rc-vt-up::view-transition-new(root) { z-index: 1; box-shadow: 0 -1px 0 rgba(255, 255, 255, .14), 0 -30px 80px rgba(0, 0, 0, .55); animation: rc-sheet-up .42s cubic-bezier(.22, 1, .36, 1) both; }
html.rc-vt-down::view-transition-new(root) { z-index: 0; }
html.rc-vt-down::view-transition-old(root) { z-index: 1; animation: rc-sheet-down .38s cubic-bezier(.5, 0, .2, 1) both; }
html.rc-vt-next::view-transition-old(root) { z-index: 0; animation: rc-next-out .18s linear both; }
html.rc-vt-next::view-transition-new(root) { z-index: 1; animation: rc-next-in .36s cubic-bezier(.22, 1, .36, 1) both; }
html.rc-vt::view-transition-old(rc-nv) { animation: rc-out .16s linear .08s both; mix-blend-mode: normal; }
html.rc-vt::view-transition-new(rc-nv) { animation: rc-in .2s linear .1s both; mix-blend-mode: normal; }
html.rc-vt::view-transition-group(rc-title) { animation-duration: .42s; animation-timing-function: cubic-bezier(.22, 1, .36, 1); }
html.rc-vt-down::view-transition-group(rc-title) { animation-duration: .38s; }
html.rc-vt::view-transition-old(rc-title) { animation: rc-out .14s linear .04s both; mix-blend-mode: normal; }
html.rc-vt::view-transition-new(rc-title) { animation: rc-in .18s linear .08s both; mix-blend-mode: normal; }
html.rc-vt-down::view-transition-new(rc-title) { animation-delay: .2s; }


@media (min-width: 861px) { .motion main > :is(.rc-w, .rc-j) { position: relative; z-index: 1; box-shadow: var(--lift); } }


body[data-page="recrutement"] .mb { display: none !important; }


@media (max-width: 1000px) {
  .rc-w__l { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 979px) {
  
  .rc-j { overflow-x: clip; }
  .rj, .rc-js .rj.is-on { display: flex; flex-direction: column; align-items: stretch; max-inline-size: 40rem; margin-inline: auto; }
  .rj__c, .rj__b { display: contents; }
  .rj__e { order: 1; }
  .rj__go { order: 2; }
  .rj__n { order: 3; }
  .rj__f { margin: clamp(22px, 2vw, 32px) calc((100% - 100vw) / 2) 0; padding: 10px calc((100vw - 100%) / 2) 12px; background: var(--raised, #14191A); }
  .rj__f > div:last-child { border-block-end: 0; }
  .rj__f > div:first-child { padding-block-start: 12px; }
  .rj__go { position: sticky; z-index: 60; inset-block-end: 0; margin: 24px calc((100% - 100vw) / 2) 0; padding: 10px calc((100vw - 100%) / 2) max(10px, env(safe-area-inset-bottom)); background: var(--raised, #14191A); box-shadow: 0 -1px 0 rgba(var(--lt), .12); }
  .rj__go .bt { display: flex; max-inline-size: 520px; margin-inline: auto; }
}
@media (max-width: 860px) {
  .rr { grid-template-columns: minmax(0, 1fr) 40px; grid-template-areas: "t go" "m go"; gap: 6px 14px; padding-block: 16px 17px; }
  .rr__t { grid-area: t; font-size: clamp(21px, 5.6vw, 30px); }
  .rr__ms { grid-area: m; display: flex; flex-wrap: wrap; gap: 2px 16px; }
  .rr__go { grid-area: go; inline-size: 40px; block-size: 40px; }
  .rc-sp { grid-template-columns: minmax(0, 1fr); }
  .rc-sp__b { justify-self: start; }
}
@media (max-width: 760px) {
  .rc-op { display: block; block-size: auto; padding: 0; }
  .rc-op__f { position: relative; inset: auto; z-index: 0; block-size: clamp(200px, 58vw, 340px); }
  .rc-op__f img { position: absolute; inset: 0 0 auto auto; inline-size: 150%; max-inline-size: none; block-size: auto; object-fit: fill; transform-origin: 100% 0; } 
  .rc-op__f::after { background: linear-gradient(180deg, rgba(11,14,15,.7) 0%, rgba(11,14,15,0) 42%), linear-gradient(90deg, rgba(11,14,15,.62) 0%, rgba(11,14,15,0) 62%); }
  .rc-op__c { inline-size: 100%; border-radius: 0; }
  .rc-w { padding-block: 52px 60px; }
  .rc-w__l { grid-template-columns: minmax(0, 1fr); gap: 24px; margin-block-start: 32px; }
  .rj__t { font-size: clamp(30px, 8.3vw, 44px); }
  .rd__in { padding-block-start: 16px; }
  .rd__x { inset-block-start: 8px; }
}
@media (prefers-reduced-motion: reduce) { .rd, .rd::backdrop, .rr, .rr::after, .rr__go::before, .rj__go { transition: none; } }


@media (min-width: 861px) {
  .rc-l__h, .rc-w__h { font-size: var(--h2); line-height: 1; }
  .rc-w__s { max-inline-size: 44em; margin-block-start: 14px; font-size: clamp(16px, 1.15vw, 19px); line-height: 1.55; }
}