/* CHASSANG · Secondary pages — Réalisations (hero, showcase, filters), case pages, podcast. Tokens from site.css. */

.chs-round .is-left, .chs-icon.is-left { transform: rotate(180deg); }
.chs-verified { width: 16px; height: 16px; color: var(--ch-bleu); }

/* ---------- shared dark hero frame ---------- */
.chs-phero, .chs-pod { position: relative; overflow: hidden; isolation: isolate; color: #fff; background: var(--ch-abysse); min-height: min(88vh, 860px); padding: calc(var(--chs-header-h) + 64px) 0 96px; display: flex; align-items: center; }
.chs-phero::after, .chs-pod::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: var(--ch-grain); opacity: .06; pointer-events: none; }
.chs-phero__bg, .chs-phero__layer, .chs-pod__bg, .chs-pod__layer { position: absolute; inset: 0; z-index: -2; pointer-events: none; }
.chs-phero__layer, .chs-pod__layer { opacity: 0; transition: opacity .8s ease; }
.chs-phero[data-variant="1"] .chs-phero__layer--1, .chs-phero[data-variant="2"] .chs-phero__layer--2, .chs-phero[data-variant="3"] .chs-phero__layer--3,
.chs-pod[data-variant="1"] .chs-pod__layer--1, .chs-pod[data-variant="2"] .chs-pod__layer--2, .chs-pod[data-variant="3"] .chs-pod__layer--3 { opacity: 1; }

/* ---------- Réalisations hero ---------- */
.chs-phero__inner { position: relative; width: 100%; }
.chs-phero__overline { margin: 0 0 18px; font: 500 12.5px/1.3 var(--ch-head); letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.7); }
.chs-phero__title { margin: 0; font: 600 clamp(52px, 8.5vw, 128px)/.95 var(--ch-head); letter-spacing: -.045em; color: #fff; }
.chs-phero__subtitle { margin: 24px 0 0; font: 500 clamp(15px, 1.4vw, 19px)/1.4 var(--ch-head); letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.8); }
.chs-phero__subtitle i { font-style: normal; color: var(--ch-bleu-ciel); margin: 0 .4em; }
/* 1 · Présentation: brand-guidelines cover slide (halo + silver symbol) */
.chs-phero__layer--1 { background: var(--ch-halo-principal); }
.chs-phero__silver { position: absolute; right: -40px; top: 50%; width: min(520px, 40vw); height: auto; transform: translateY(-48%); filter: drop-shadow(0 40px 90px rgba(3,8,30,.6)); animation: chs-float 14s ease-in-out infinite; }
/* 2 · Typographie: oversized outlined word + beams */
.chs-phero__layer--2 { background: var(--ch-halo-nuit); }
.chs-phero__word { position: absolute; left: 50%; bottom: -4%; transform: translateX(-50%); font: 700 clamp(120px, 21vw, 360px)/.8 var(--ch-head); letter-spacing: -.06em; white-space: nowrap; color: transparent; -webkit-text-stroke: 1.5px rgba(95,212,255,.28); }
.chs-phero[data-variant="2"] .chs-phero__inner { text-align: center; }
/* 3 · Mosaïque: tilted wall of project screenshots */
.chs-phero__layer--3 { background: var(--ch-abysse); }
.chs-phero__layer--3::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,11,26,.96) 0%, rgba(7,11,26,.78) 42%, rgba(7,11,26,.25) 100%), linear-gradient(0deg, rgba(7,11,26,.85), transparent 40%); }
.chs-phero__mosaic { position: absolute; top: -18%; right: -10%; width: 78%; height: 140%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; transform: rotate(-12deg) skewX(4deg); animation: chs-drift-mosaic 40s linear infinite alternate; }
.chs-phero__tile { border-radius: 16px; background: var(--ch-marine) var(--img) center top / cover no-repeat; box-shadow: 0 30px 60px rgba(0,0,0,.4); aspect-ratio: 16 / 10; }
@keyframes chs-drift-mosaic { to { transform: rotate(-12deg) skewX(4deg) translateY(-12%); } }

/* ---------- Showcase (Pulsor « Projets Showcase ») ---------- */
.chs-showcase { padding: 112px 0 96px; overflow: hidden; }
.chs-showcase__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px 48px; flex-wrap: wrap; margin-bottom: 48px; }
.chs-showcase__title { margin: 0; font: 600 clamp(36px, 4.6vw, 64px)/1.02 var(--ch-head); letter-spacing: -.04em; color: var(--ch-nuit); }
.chs-showcase__subtitle { margin: 16px 0 0; max-width: 620px; font: 400 18px/1.6 var(--ch-body); color: var(--ch-ardoise); }
.chs-showcase__nav { display: flex; gap: 10px; }
.chs-showcase__viewport { position: relative; }
.chs-showcase__track { display: flex; gap: 28px; transition: transform .8s var(--chs-ease); will-change: transform; }
.chs-showcase__card { flex: 0 0 min(1200px, calc(100vw - 2 * var(--chs-gutter) - 120px)); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); min-height: 560px; border-radius: 32px; overflow: hidden; background: var(--ch-nuit); color: #fff; box-shadow: 0 40px 80px rgba(11,20,55,.22); opacity: .35; filter: blur(2px) saturate(.6); transform: scale(.94); transition: opacity .8s ease, filter .8s ease, transform .8s var(--chs-ease); cursor: pointer; }
.chs-showcase__card.is-active { opacity: 1; filter: none; transform: none; cursor: default; }
.chs-showcase__body { padding: 44px; display: flex; flex-direction: column; gap: 18px; }
.chs-showcase__id { display: flex; align-items: center; gap: 14px; }
.chs-showcase__fav-wrap { flex: none; width: 56px; height: 56px; border-radius: 16px; background: #fff; display: grid; place-items: center; padding: 8px; }
.chs-showcase__fav { width: 100%; height: 100%; object-fit: contain; }
.chs-showcase__id strong { display: block; font: 600 22px/1.2 var(--ch-head); letter-spacing: -.01em; }
.chs-showcase__id small { display: block; margin-top: 4px; font: 500 13px/1.2 var(--ch-head); letter-spacing: .14em; text-transform: uppercase; color: var(--ch-bleu-ciel); }
.chs-showcase__badge { align-self: flex-start; margin: 0; padding: 8px 14px; border-radius: 10px; background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.12); font: 500 14px/1.2 var(--ch-head); color: rgba(255,255,255,.88); cursor: default; }
.chs-showcase__text { margin: 0; font: 400 17px/1.6 var(--ch-body); color: rgba(255,255,255,.8); }
.chs-showcase__ctas { margin-top: auto; display: flex; flex-wrap: wrap; gap: 10px; padding-top: 12px; }
.chs-showcase__site .chs-verified { color: var(--ch-bleu-ciel); }
.chs-showcase__media { position: relative; display: flex; align-items: center; padding: 40px 40px 40px 0; }
/* The whole hero of the client's site stays visible (no cropping). */
.chs-showcase__media img { display: block; width: 100%; height: auto; border-radius: 16px; box-shadow: 0 30px 60px rgba(0,0,0,.4), 0 0 0 1px rgba(255,255,255,.08); }
.chs-showcase__dots { display: flex; justify-content: center; gap: 8px; margin-top: 28px; }
.chs-showcase__dots span { width: 7px; height: 7px; border-radius: 999px; background: var(--ch-trait); transition: width .3s var(--chs-ease), background .3s; }
.chs-showcase__dots span.is-on { width: 22px; background: var(--ch-bleu-roi); }

/* ---------- Projects grid with filters (Ourama /projets) ---------- */
.chs-projects { padding: 0 12px 96px; }
.chs-projects__panel { max-width: 1440px; margin: 0 auto; border-radius: 32px; background: var(--ch-nuit); color: #fff; padding: clamp(28px, 5vw, 72px); }
.chs-projects__head { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-bottom: clamp(40px, 6vw, 88px); }
.chs-projects__title { margin: 0; max-width: 100%; overflow-wrap: anywhere; font: 600 clamp(38px, 7vw, 104px)/.95 var(--ch-head); letter-spacing: -.045em; text-transform: uppercase; color: #fff; }
.chs-projects__layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 48px; align-items: start; }
.chs-projects__filters { position: sticky; top: calc(var(--chs-header-h) + 24px); }
.chs-projects__ftoggle { display: none; }
.chs-projects__ftitle { margin: 0 0 18px; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.12); font: 500 12px/1 var(--ch-head); letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.55); }
.chs-filter { margin: 0 0 26px; padding: 0; border: 0; }
.chs-filter legend { padding: 0; margin-bottom: 12px; font: 600 15px/1.2 var(--ch-head); color: #fff; }
.chs-filter__hint { margin: 0; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.5); }
.chs-filter__group { display: flex; flex-direction: column; gap: 2px; }
.chs-filter__group[hidden], .chs-filter__hint[hidden], .chs-projects__empty[hidden], .chs-projects__reset[hidden] { display: none; }
.chs-check { position: relative; display: flex; align-items: center; gap: 10px; padding: 7px 0; cursor: pointer; font: 500 13.5px/1.3 var(--ch-head); letter-spacing: .02em; color: rgba(255,255,255,.82); transition: color .2s, opacity .2s; }
.chs-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chs-check__box { flex: none; width: 18px; height: 18px; border-radius: 5px; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.35); transition: background .2s, box-shadow .2s; }
.chs-check input:checked + .chs-check__box { background: var(--ch-bleu-roi) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'><path d='M4.5 9.2l3 2.8 6-6.2' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / 18px no-repeat; box-shadow: none; }
.chs-check input:focus-visible + .chs-check__box { outline: 2px solid var(--ch-bleu-ciel); outline-offset: 2px; }
.chs-check__label { flex: 1; }
.chs-check__count { font-variant-numeric: tabular-nums; font-size: 12px; color: rgba(255,255,255,.45); }
.chs-check:hover { color: #fff; }
.chs-check.is-disabled { opacity: .3; cursor: not-allowed; }
.chs-projects__reset { font: 500 13px var(--ch-head); color: var(--ch-bleu-ciel); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.chs-projects__count { margin: 0 0 22px; font: 400 16px var(--ch-body); color: rgba(255,255,255,.55); }
.chs-projects__count b { color: #fff; font-weight: 600; }
.chs-projects__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 36px 24px; margin: 0; padding: 0; list-style: none; }
.chs-pcard[hidden] { display: none; }
.chs-pcard.is-in { animation: chs-card-in .7s var(--chs-ease) both; animation-delay: var(--d, 0ms); }
@keyframes chs-card-in { from { opacity: 0; transform: translateY(26px) scale(.97); filter: blur(6px); clip-path: inset(18% 0 0 0 round 18px); } to { opacity: 1; transform: none; filter: none; clip-path: inset(0 0 0 0 round 18px); } }
.chs-pcard__link { display: block; color: inherit; text-decoration: none; }
.chs-pcard__media { position: relative; display: block; aspect-ratio: 16 / 10.5; border-radius: 18px; overflow: hidden; background: var(--ch-marine); box-shadow: 0 0 0 1px rgba(255,255,255,.08); }
.chs-pcard__img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; transition: transform .8s var(--chs-ease); }
.chs-pcard__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(30,63,217,.45)); opacity: 0; transition: opacity .4s; }
.chs-pcard__open { position: absolute; right: 14px; bottom: 14px; z-index: 1; width: 42px; height: 42px; border-radius: 999px; display: grid; place-items: center; background: #fff; color: var(--ch-nuit); transform: scale(.6); opacity: 0; transition: transform .35s var(--chs-ease), opacity .35s; }
.chs-pcard__link:hover .chs-pcard__img, .chs-pcard__link:focus-visible .chs-pcard__img { transform: scale(1.04); }
.chs-pcard__link:hover .chs-pcard__media::after, .chs-pcard__link:focus-visible .chs-pcard__media::after { opacity: 1; }
.chs-pcard__link:hover .chs-pcard__open, .chs-pcard__link:focus-visible .chs-pcard__open { transform: none; opacity: 1; }
.chs-pcard__title { display: block; margin-top: 16px; font: 600 20px/1.25 var(--ch-head); letter-spacing: -.01em; color: #fff; }
.chs-pcard__tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; padding: 0; list-style: none; }
.chs-pcard__tags li { padding: 5px 10px; border-radius: 999px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); font: 500 12px/1.2 var(--ch-head); color: rgba(255,255,255,.82); cursor: default; }
.chs-projects__empty { padding: 48px 0; color: rgba(255,255,255,.7); }
.chs-projects__empty p { margin: 0 0 18px; font-size: 17px; }

/* ---------- Conversion banner (hero as a band) + testimonials ---------- */
.chs-cta { padding: 24px 12px 96px; }
.chs-cta__panel { position: relative; overflow: hidden; isolation: isolate; max-width: 1440px; margin: 0 auto; border-radius: 32px; background: var(--ch-halo-principal); color: #fff; padding: clamp(56px, 8vw, 112px) 24px; text-align: center; }
.chs-cta__panel::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: var(--ch-grain); opacity: .06; }
.chs-cta__glow { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.chs-cta__symbol { position: absolute; right: -60px; top: 50%; width: min(380px, 30vw); transform: translateY(-50%); opacity: .25; }
.chs-cta__inner { display: flex; flex-direction: column; align-items: center; }
.chs-cta__title { margin: 0; font: 600 clamp(40px, 5.6vw, 76px)/1 var(--ch-head); letter-spacing: -.045em; color: #fff; }
.chs-cta__subtitle { margin: 22px auto 32px; max-width: 720px; font: 400 clamp(16px, 1.4vw, 19px)/1.55 var(--ch-body); color: rgba(255,255,255,.8); text-wrap: balance; }

/* ---------- Case page (Pulsor /projects/arc144) ---------- */
.chs-case { padding: calc(var(--chs-header-h) + 48px) 0 72px; background: var(--ch-papier); }
.chs-case__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.chs-case__sticky { position: sticky; top: calc(var(--chs-header-h) + 24px); }
.chs-case__back { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 28px; padding: 8px 14px 8px 10px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--ch-trait); font: 500 14px var(--ch-head); color: var(--ch-nuit); text-decoration: none; transition: box-shadow .2s, color .2s; }
.chs-case__back:hover { box-shadow: inset 0 0 0 1px var(--ch-bleu); color: var(--ch-bleu-roi); }
.chs-case__back .chs-icon { width: 16px; height: 16px; }
.chs-case__title { margin: 0; font: 600 clamp(40px, 5vw, 68px)/1 var(--ch-head); letter-spacing: -.045em; color: var(--ch-nuit); }
.chs-case__title::before { content: "["; color: var(--ch-bleu-roi); font-weight: 400; margin-right: .12em; }
.chs-case__title::after { content: "]"; color: var(--ch-bleu-roi); font-weight: 400; margin-left: .12em; }
.chs-case__text { margin: 22px 0 0; font: 400 17px/1.65 var(--ch-body); color: var(--ch-ardoise); }
.chs-case__ctas { display: flex; flex-direction: column; gap: 10px; margin-top: 28px; }
.chs-case__cta { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 0 20px; border-radius: 14px; background: #fff; box-shadow: inset 0 0 0 1px var(--ch-trait), 0 1px 2px rgba(11,20,55,.05); font: 600 16px var(--ch-head); color: var(--ch-nuit); text-decoration: none; transition: box-shadow .25s, color .25s, transform .25s var(--chs-ease); }
.chs-case__cta:hover { box-shadow: inset 0 0 0 1px var(--ch-bleu); color: var(--ch-bleu-roi); transform: translateY(-1px); }
.chs-case__cta .chs-icon { width: 16px; height: 16px; }
.chs-case__cta--site { background: var(--ch-nuage); box-shadow: none; }
.chs-case__cta--site .chs-icon:last-child { margin-left: auto; }
.chs-case__cta--site span { margin-left: auto; }
.chs-case__panels { margin-top: 32px; border-top: 1px solid var(--ch-trait); }
.chs-case__panel { border-bottom: 1px solid var(--ch-trait); }
.chs-case__ph { margin: 0; font: inherit; }
.chs-case__ph button { width: 100%; display: flex; align-items: center; gap: 10px; padding: 20px 0; font: 600 17px var(--ch-head); color: var(--ch-bleu-roi); cursor: pointer; text-align: left; }
.chs-case__ph button .chs-icon:first-child { width: 20px; height: 20px; }
.chs-case__ph span { flex: 1; }
.chs-case__chev { width: 16px; height: 16px; transform: rotate(90deg); transition: transform .3s var(--chs-ease); color: var(--ch-brume); }
.chs-case__ph button[aria-expanded="true"] .chs-case__chev { transform: rotate(-90deg); }
.chs-case__pinner { padding: 0 0 24px 30px; border-left: 2px solid var(--ch-nuage); margin-left: 9px; }
.chs-case__pinner p { margin: 0 0 12px; font: 400 15.5px/1.65 var(--ch-body); color: var(--ch-encre); }
.chs-case__tag { display: inline-block; margin: 6px 0 12px !important; padding: 5px 10px; border-radius: 8px; background: var(--ch-nuage); font: 600 12px/1 var(--ch-head) !important; letter-spacing: .12em; text-transform: uppercase; color: var(--ch-bleu-roi) !important; }
.chs-case__list { margin: 0 0 8px; padding-left: 20px; }
.chs-case__list li { margin: 0 0 6px; font: 400 15px/1.5 var(--ch-body); color: var(--ch-encre); }
.chs-case__list li::marker { color: var(--ch-bleu); }
.chs-case__quote { margin: 0; padding: 0; border: 0; font-style: italic; }
.chs-case__quote p { color: var(--ch-ardoise) !important; }
.chs-case__media { position: relative; display: flex; flex-direction: column; gap: 24px; }
.chs-case__devices { align-self: flex-start; display: flex; gap: 4px; padding: 4px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px var(--ch-trait); }
.chs-case__devices button { width: 38px; height: 34px; border-radius: 9px; display: grid; place-items: center; color: var(--ch-brume); cursor: pointer; }
.chs-case__devices button[aria-pressed="true"] { background: var(--ch-nuage); color: var(--ch-bleu-roi); }
.chs-case__devices .chs-icon { width: 18px; height: 18px; }
.chs-case__set { display: flex; flex-direction: column; gap: 28px; padding-bottom: 8vh; }
/* Deck (desktop): the right column stays in place while the left text scrolls. All cards share one size;
   the next ones peek out underneath like a pile, and on scroll the front card lifts away and the next one comes forward. */
.chs-case__frame::before { content: ""; position: absolute; inset: 12px; border-radius: 16px; background: var(--bg, none) center / cover no-repeat; filter: blur(22px) saturate(1.1); opacity: .55; pointer-events: none; }
.chs-case__frame > * { position: relative; }
@media (min-width: 1101px) {
	.chs-case__sticky { position: static; }
	.chs-case__media { position: sticky; top: calc(var(--chs-header-h) + 32px); }
	.chs-case__set--desktop { position: relative; display: block; padding: 0; aspect-ratio: 16 / 12.6; }
	.chs-case__set--desktop > .chs-case__frame { position: absolute; left: 0; right: 0; top: 0; aspect-ratio: 16 / 10.4; display: flex; align-items: center; justify-content: center; overflow: hidden; transform-origin: 50% 100%; will-change: transform, opacity; transition: transform .65s var(--chs-ease), opacity .5s ease, filter .5s ease; box-shadow: inset 0 0 0 1px var(--ch-trait), 0 18px 40px rgba(11,20,55,.14); }
	.chs-case__set--desktop > .chs-case__frame:not(:first-child) { opacity: 0; }
	.chs-case__set--desktop > .chs-case__frame > img, .chs-case__set--desktop > .chs-case__frame > video { width: auto; max-width: 100%; height: auto; max-height: 100%; object-fit: contain; border-radius: 14px; box-shadow: 0 10px 30px rgba(11,20,55,.18); }
	.chs-case__set--desktop > .chs-case__frame.is-video > video { width: 100%; height: 100%; object-fit: cover; object-position: center top; box-shadow: none; }
	.chs-case__set--mobile { align-items: center; padding: 0; }
	.chs-case__set--mobile .chs-case__frame.is-phone { height: calc(100vh - var(--chs-header-h) - 150px); width: auto; aspect-ratio: 390 / 844; }
	.chs-case__set--mobile .chs-case__frame.is-phone > video, .chs-case__set--mobile .chs-case__frame.is-phone > img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
	.chs-case__media { padding-right: 52px; }
	.chs-case__progress { position: absolute; z-index: 60; right: -46px; top: 38%; transform: translateY(-50%); display: flex; flex-direction: column; align-items: center; gap: 10px; }
	.chs-case__dots { display: flex; flex-direction: column; gap: 6px; }
	.chs-case__dot { width: 14px; height: 14px; display: grid; place-items: center; cursor: pointer; }
	.chs-case__dot::before { content: ""; width: 6px; height: 6px; border-radius: 999px; background: var(--ch-trait); transition: height .3s var(--chs-ease), background .3s; }
	.chs-case__dot.is-on::before { height: 20px; background: var(--ch-bleu-roi); }
	.chs-case__step { width: 32px; height: 32px; border-radius: 999px; display: grid; place-items: center; background: #fff; color: var(--ch-nuit); box-shadow: inset 0 0 0 1px var(--ch-trait); cursor: pointer; transition: box-shadow .2s, color .2s, opacity .2s; }
	.chs-case__step:hover:not(:disabled) { box-shadow: inset 0 0 0 1px var(--ch-bleu); color: var(--ch-bleu-roi); }
	.chs-case__step:disabled { opacity: .35; cursor: default; }
	.chs-case__step .chs-icon { width: 16px; height: 16px; }
}
.chs-case__set[hidden] { display: none; }
.chs-case__frame { position: relative; margin: 0; padding: 12px; border-radius: 26px; background: #fff; box-shadow: inset 0 0 0 1px var(--ch-trait), 0 24px 50px rgba(11,20,55,.08); }
.chs-case__frame > video, .chs-case__frame > img, .chs-case__shot { display: block; width: 100%; height: auto; border-radius: 16px; background: var(--ch-nuit); }
.chs-case__frame.is-phone { align-self: center; width: min(360px, 100%); padding: 10px; border-radius: 38px; background: var(--ch-nuit); }
.chs-case__frame.is-phone > video, .chs-case__frame.is-phone > img { border-radius: 30px; }
.chs-case__vctl { position: absolute; left: 26px; bottom: 26px; }
.chs-case__vctl .chs-round { width: 40px; height: 40px; }
.chs-case__vctl .is-paused svg path { d: path("M8 5.5v13l11-6.5z"); }
.chs-case__private { padding: 64px 0 24px; max-width: 560px; }
.chs-case__private .chs-case__title::before, .chs-case__private .chs-case__title::after { content: none; }
.chs-case__overline { margin: 0 0 12px; font: 500 12.5px var(--ch-head); letter-spacing: .16em; text-transform: uppercase; color: var(--ch-bleu-roi); }
.chs-case__private form { margin-top: 24px; font: 400 15px var(--ch-body); color: var(--ch-ardoise); }
.chs-case__private input[type=password] { display: block; width: 100%; margin: 8px 0 12px; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--ch-trait); font: inherit; }
.chs-case__private input[type=submit] { padding: 14px 22px; border: 0; border-radius: 999px; background: var(--ch-bleu-roi); color: #fff; font: 600 15px var(--ch-head); cursor: pointer; }

/* ---------- Podcast hero ---------- */
.chs-pod__inner { position: relative; width: 100%; }
.chs-pod__overline { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 20px; padding: 7px 14px 7px 10px; border-radius: 999px; background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); font: 600 12.5px/1 var(--ch-head); letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.85); }
.chs-pod__overline .chs-icon { width: 16px; height: 16px; color: var(--ch-bleu-ciel); }
.chs-pod__title { margin: 0; max-width: 820px; font: 600 clamp(52px, 8vw, 120px)/.95 var(--ch-head); letter-spacing: -.045em; color: #fff; }
.chs-pod__subtitle { margin: 26px 0 0; max-width: 640px; font: 400 clamp(17px, 1.5vw, 20px)/1.6 var(--ch-body); color: rgba(255,255,255,.8); }
.chs-pod__tagline { margin: 22px 0 32px; font: 600 clamp(13px, 1.1vw, 15px)/1.4 var(--ch-head); letter-spacing: .2em; color: var(--ch-bleu-ciel); }
/* 1 · Micro */
.chs-pod__layer--1 { background: var(--ch-halo-nuit); }
.chs-pod__micwrap { position: absolute; right: 9%; top: 50%; width: min(300px, 26vw); aspect-ratio: 200 / 320; transform: translateY(-46%); }
.chs-mic { position: relative; z-index: 1; width: 100%; height: 100%; filter: drop-shadow(0 40px 80px rgba(30,63,217,.5)); }
.chs-pod__ring { position: absolute; left: 50%; top: 28%; width: 160%; aspect-ratio: 1; border-radius: 50%; border: 1.5px solid rgba(95,212,255,.35); transform: translate(-50%, -50%) scale(.4); opacity: 0; animation: chs-ring 4.5s ease-out infinite; }
.chs-pod__ring:nth-child(2) { animation-delay: 1.5s; } .chs-pod__ring:nth-child(3) { animation-delay: 3s; }
@keyframes chs-ring { 0% { transform: translate(-50%, -50%) scale(.4); opacity: .9; } 100% { transform: translate(-50%, -50%) scale(1.4); opacity: 0; } }
/* 2 · Onde */
.chs-pod__layer--2 { background: var(--ch-halo-horizon); }
.chs-pod__wave { position: absolute; left: 0; right: 0; bottom: 3%; height: 20%; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 0 4%; -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); }
.chs-pod__wave span { flex: 1; max-width: 10px; height: var(--h); border-radius: 999px; background: linear-gradient(180deg, #5FD4FF, #1E3FD9); opacity: .65; animation: chs-bar 1.6s ease-in-out infinite; animation-delay: calc(var(--i) * -70ms); transform-origin: center; }
@keyframes chs-bar { 0%, 100% { transform: scaleY(.35); } 50% { transform: scaleY(1); } }
.chs-pod[data-variant="2"] .chs-pod__inner { text-align: center; display: flex; flex-direction: column; align-items: center; padding-bottom: 20vh; }
/* 3 · Épisodes */
.chs-pod__layer--3 { background: var(--ch-halo-principal); }
.chs-pod__thumbs { position: absolute; right: 5%; top: 50%; width: min(560px, 44vw); height: 70%; transform: translateY(-50%); }
.chs-pod__thumb { position: absolute; margin: 0; width: 82%; border-radius: 20px; overflow: hidden; box-shadow: 0 40px 80px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.12); }
.chs-pod__thumb img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.chs-pod__thumb--1 { right: 0; top: 4%; transform: rotate(4deg); animation: chs-float-a 12s ease-in-out infinite; }
.chs-pod__thumb--2 { left: 0; bottom: 4%; transform: rotate(-5deg); animation: chs-float-b 14s ease-in-out infinite; }
@keyframes chs-float-a { 50% { transform: rotate(4deg) translateY(-14px); } }
@keyframes chs-float-b { 50% { transform: rotate(-5deg) translateY(12px); } }
.chs-pod__play { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 999px; display: grid; place-items: center; background: rgba(255,255,255,.92); color: var(--ch-bleu-roi); }
.chs-pod__play .chs-icon { width: 28px; height: 28px; }

/* ---------- Podcast steps (highlanding) ---------- */
.chs-steps { padding: 24px 12px 24px; }
.chs-steps__panel { max-width: 1440px; margin: 0 auto; border-radius: 32px; background: var(--ch-abysse) radial-gradient(70% 60% at 50% 110%, rgba(30,63,217,.55), transparent 70%); color: #fff; padding: clamp(56px, 7vw, 104px) 0; }
.chs-steps__head { text-align: center; max-width: 900px; margin: 0 auto 56px; }
.chs-steps__title { margin: 0; font: 600 clamp(36px, 4.8vw, 64px)/1.05 var(--ch-head); letter-spacing: -.04em; color: #fff; text-wrap: balance; }
.chs-steps__subtitle { margin: 20px auto 0; max-width: 720px; font: 400 18px/1.6 var(--ch-body); color: rgba(255,255,255,.75); text-wrap: balance; }
.chs-steps__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.chs-step { border-radius: 26px; overflow: hidden; background: linear-gradient(180deg, rgba(30,63,217,.22), rgba(18,32,90,.6)); box-shadow: inset 0 0 0 1px rgba(95,212,255,.18); display: flex; flex-direction: column; }
.chs-step__visual { position: relative; height: 280px; overflow: hidden; background: radial-gradient(60% 70% at 50% 40%, rgba(61,123,255,.35), transparent 70%); }
.chs-step__v { position: absolute; inset: 0; opacity: 0; transition: opacity .5s ease; }
.chs-step[data-variant="a"] .chs-step__v[data-v="a"], .chs-step[data-variant="b"] .chs-step__v[data-v="b"], .chs-step[data-variant="c"] .chs-step__v[data-v="c"] { opacity: 1; }
.chs-step .chs-switcher { left: 50%; bottom: 12px; transform: translateX(-50%); }
.chs-step__body { padding: 26px 28px 32px; }
.chs-step__label { margin: 0 0 10px; font: 500 13px/1 var(--ch-head); letter-spacing: .18em; text-transform: uppercase; color: var(--ch-bleu-ciel); }
.chs-step__title { margin: 0 0 12px; font: 600 21px/1.25 var(--ch-head); letter-spacing: -.01em; color: #fff; }
.chs-step__text { margin: 0 0 10px; font: 400 15.5px/1.6 var(--ch-body); color: rgba(255,255,255,.75); }

/* the nine visuals */
.chs-v { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 24px 24px 56px; }
.chs-v .chs-icon { width: 16px; height: 16px; }
.chs-v__chip { position: absolute; left: 50%; bottom: 58px; transform: translateX(-50%); padding: 7px 12px; border-radius: 999px; background: rgba(255,255,255,.1); box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); font: 600 12px var(--ch-head); letter-spacing: .06em; white-space: nowrap; }
/* 1a link */
.chs-v--link { gap: 0; }
.chs-v__orb { position: relative; z-index: 1; width: 96px; height: 96px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 30% 30%, #3D7BFF, #12205A); box-shadow: 0 0 0 8px rgba(95,212,255,.08), 0 0 50px rgba(61,123,255,.6); }
.chs-v__orb.is-client { background: #fff; }
.chs-v__sym { width: 44px; height: auto; }
.chs-v__logo { width: 62px; height: 62px; object-fit: contain; }
.chs-v__beam { width: 90px; height: 3px; background: linear-gradient(90deg, #5FD4FF, #fff, #5FD4FF); background-size: 200% 100%; animation: chs-beam 2s linear infinite; box-shadow: 0 0 16px #5FD4FF; }
@keyframes chs-beam { to { background-position: -200% 0; } }
/* 1b site */
.chs-v--site { gap: 18px; }
.chs-v__window { width: 58%; padding: 10px; border-radius: 12px; background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); display: flex; flex-direction: column; gap: 8px; }
.chs-v__bar { display: flex; gap: 4px; } .chs-v__bar i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.35); }
.chs-v__line { height: 8px; border-radius: 4px; background: rgba(255,255,255,.3); } .chs-v__line.w70 { width: 70%; background: #fff; } .chs-v__line.w45 { width: 45%; }
.chs-v__block { height: 54px; border-radius: 8px; background: linear-gradient(135deg, #1E3FD9, #5FD4FF); }
.chs-v__checks { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.chs-v__checks li { display: flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; background: rgba(95,212,255,.14); font: 600 12px var(--ch-head); white-space: nowrap; }
.chs-v__checks .chs-icon { color: var(--ch-bleu-ciel); }
/* 1c chat */
.chs-v--chat { flex-direction: column; align-items: stretch; gap: 10px; padding-left: 36px; padding-right: 36px; }
.chs-v__msg { margin: 0; max-width: 78%; padding: 10px 14px; border-radius: 16px 16px 16px 4px; background: rgba(255,255,255,.1); font: 500 13.5px/1.35 var(--ch-body); }
.chs-v__msg.is-client { align-self: flex-end; border-radius: 16px 16px 4px 16px; background: var(--ch-bleu-roi); }
/* 2a rec */
.chs-v--rec { flex-direction: column; gap: 12px; }
.chs-v__rec { position: absolute; left: 22px; top: 20px; display: flex; align-items: center; gap: 6px; font: 600 12px var(--ch-head); letter-spacing: .12em; } .chs-v__rec i { width: 9px; height: 9px; border-radius: 50%; background: #ff4d5e; animation: chs-blink 1.2s steps(2) infinite; }
@keyframes chs-blink { 50% { opacity: .2; } }
.chs-v__time { position: absolute; right: 22px; top: 20px; font: 500 12px var(--ch-head); font-variant-numeric: tabular-nums; color: rgba(255,255,255,.7); }
.chs-v__bigicon { width: 64px !important; height: 64px !important; color: var(--ch-bleu-ciel); }
.chs-v__wave { display: flex; align-items: center; gap: 4px; height: 50px; }
.chs-v__wave span { width: 5px; height: 100%; border-radius: 9px; background: linear-gradient(180deg, #5FD4FF, #3D7BFF); animation: chs-bar 1.2s ease-in-out infinite; animation-delay: calc(var(--i) * -90ms); }
/* 2b steps */
.chs-v--steps { flex-direction: column; gap: 14px; }
.chs-v--steps ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.chs-v--steps li { display: flex; align-items: center; gap: 6px; padding: 9px 12px; border-radius: 12px; background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); font: 600 13px var(--ch-head); }
.chs-v--steps .chs-icon { color: var(--ch-bleu-ciel); }
.chs-v__free { padding: 9px 16px; border-radius: 999px; background: linear-gradient(135deg, #1E3FD9, #3D7BFF); font: 700 14px var(--ch-head); box-shadow: 0 10px 30px rgba(30,63,217,.5); }
/* 2c cards */
.chs-v--cards { perspective: 600px; }
.chs-v__card { position: absolute; width: 124px; padding: 16px 10px; border-radius: 14px; background: #fff; color: var(--ch-nuit); font: 600 14px/1.2 var(--ch-head); text-align: center; box-shadow: 0 20px 40px rgba(0,0,0,.35); }
.chs-v__card.c1 { transform: translate(-112px, 22px) rotate(-12deg); } .chs-v__card.c2 { z-index: 1; transform: translate(0, -22px); background: var(--ch-bleu-roi); color: #fff; } .chs-v__card.c3 { transform: translate(112px, 22px) rotate(12deg); }
.chs-v__dice { position: absolute; right: 26px; top: 22px; width: 40px; height: 40px; border-radius: 10px; background: #fff; display: grid; grid-template-columns: repeat(3, 1fr); padding: 6px; transform: rotate(14deg); }
.chs-v__dice i { width: 6px; height: 6px; border-radius: 50%; background: var(--ch-nuit); align-self: center; justify-self: center; }
.chs-v__dice i:nth-child(1) { grid-area: 1 / 1; } .chs-v__dice i:nth-child(2) { grid-area: 1 / 3; } .chs-v__dice i:nth-child(3) { grid-area: 2 / 2; } .chs-v__dice i:nth-child(4) { grid-area: 3 / 1; } .chs-v__dice i:nth-child(5) { grid-area: 3 / 3; }
/* 3a thumb */
.chs-v--thumb img { width: 82%; border-radius: 14px; box-shadow: 0 24px 50px rgba(0,0,0,.45); }
.chs-v__play { position: absolute; left: 50%; top: calc(50% - 16px); width: 52px; height: 52px; margin: -26px 0 0 -26px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--ch-bleu-roi); box-shadow: 0 0 0 10px rgba(255,255,255,.18); }
.chs-v__play .chs-icon { width: 24px !important; height: 24px !important; }
/* 3b chart */
.chs-v--chart > svg { position: absolute; left: 0; right: 0; bottom: 48px; width: 100%; height: 58%; }
.chs-v__path { stroke-dasharray: 520; stroke-dashoffset: 520; animation: chs-draw 3.5s var(--chs-ease) infinite; }
@keyframes chs-draw { 60%, 100% { stroke-dashoffset: 0; } }
.chs-v__kpi { position: absolute; display: flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 12px; background: rgba(255,255,255,.12); box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); font: 600 12.5px var(--ch-head); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.chs-v__kpi.k1 { left: 22px; top: 26px; } .chs-v__kpi.k2 { right: 22px; top: 70px; }
.chs-v__kpi .chs-icon { color: var(--ch-bleu-ciel); }
/* 3c notifications */
.chs-v--notifs { flex-direction: column; gap: 8px; align-items: stretch; padding-left: 28px; padding-right: 28px; }
.chs-v__bgthumb { position: absolute; inset: 0; opacity: .25; } .chs-v__bgthumb img { width: 100%; height: 100%; object-fit: cover; }
.chs-v__notif { position: relative; display: flex; align-items: center; gap: 8px; margin: 0; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.94); color: var(--ch-nuit); font: 600 13px var(--ch-head); box-shadow: 0 10px 24px rgba(0,0,0,.25); animation: chs-notif 6s var(--chs-ease) infinite; }
.chs-v__notif .chs-icon { color: var(--ch-bleu-roi); }
.chs-v__notif.n2 { animation-delay: .4s; } .chs-v__notif.n3 { animation-delay: .8s; }
@keyframes chs-notif { 0% { opacity: 0; transform: translateY(12px); } 12%, 85% { opacity: 1; transform: none; } 100% { opacity: 0; } }

/* ---------- Episodes ---------- */
.chs-eps { padding: 96px 0 72px; }
.chs-eps__title { margin: 0 0 28px; font: 600 clamp(32px, 4vw, 52px)/1.05 var(--ch-head); letter-spacing: -.035em; color: var(--ch-nuit); text-align: center; }
.chs-eps__tabs { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 22px; margin-bottom: 40px; }
.chs-eps__tabs button { padding: 8px 2px; font: 600 15px var(--ch-head); color: var(--ch-brume); border-bottom: 2px solid transparent; cursor: pointer; }
.chs-eps__tabs button[aria-selected="true"] { color: var(--ch-nuit); border-color: var(--ch-bleu-roi); }
.chs-eps__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 40px 28px; margin: 0; padding: 0; list-style: none; }
.chs-ep[hidden] { display: none; }
.chs-ep__link { display: block; color: inherit; text-decoration: none; }
.chs-ep__media { position: relative; display: block; border-radius: 20px; overflow: hidden; aspect-ratio: 16 / 9; background: var(--ch-nuit); box-shadow: 0 20px 40px rgba(11,20,55,.12); }
.chs-ep__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .7s var(--chs-ease); }
.chs-ep__play { position: absolute; left: 50%; top: 50%; width: 60px; height: 60px; margin: -30px 0 0 -30px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.92); color: var(--ch-bleu-roi); transform: scale(.85); opacity: .9; transition: transform .35s var(--chs-ease), opacity .35s; }
.chs-ep__play .chs-icon { width: 26px; height: 26px; }
.chs-ep__link:hover .chs-ep__img { transform: scale(1.04); }
.chs-ep__link:hover .chs-ep__play { transform: none; opacity: 1; }
.chs-ep__title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 18px; font: 700 16px/1.35 var(--ch-head); text-transform: uppercase; letter-spacing: .01em; color: var(--ch-nuit); }
.chs-ep__date { display: block; margin-top: 8px; font: 500 14px var(--ch-body); color: var(--ch-brume); }
.chs-ep__excerpt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 8px; font: 400 15px/1.55 var(--ch-body); color: var(--ch-ardoise); }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
	.chs-showcase__card { grid-template-columns: minmax(0, 1fr); min-height: 0; }
	.chs-showcase__media { padding: 0 28px 28px; }
	.chs-projects__layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.chs-projects__filters { position: static; }
	.chs-projects__ftoggle { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 14px 18px; border-radius: 14px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); font: 600 15px var(--ch-head); color: #fff; cursor: pointer; }
	.chs-projects__ftoggle .chs-icon { transform: rotate(90deg); transition: transform .3s; }
	.chs-projects__ftoggle[aria-expanded="true"] .chs-icon { transform: rotate(-90deg); }
	.chs-projects__fbody { display: none; padding-top: 18px; }
	.chs-projects.is-filters-open .chs-projects__fbody { display: block; }
	.chs-projects__ftitle { display: none; }
	.chs-case__grid { grid-template-columns: minmax(0, 1fr); }
	.chs-case__sticky { position: static; }
	.chs-case__progress { display: none; } /* deck nav is desktop-only; the visuals stack here */
	.chs-steps__list { grid-template-columns: minmax(0, 1fr); max-width: 560px; margin: 0 auto; }
	.chs-pod__micwrap { right: 4%; width: 22vw; opacity: .7; }
	.chs-pod__thumbs { opacity: .55; right: -6%; width: 54vw; }
}
@media (max-width: 900px) {
	.chs-phero, .chs-pod { min-height: 0; padding: calc(var(--chs-header-h) + 56px) 0 96px; }
	.chs-phero__silver { width: 60vw; right: -24vw; opacity: .5; }
	.chs-phero__mosaic { width: 140%; right: -50%; opacity: .5; }
	.chs-showcase { padding: 72px 0 64px; }
	.chs-showcase__card { flex-basis: calc(100vw - 2 * var(--chs-gutter) - 24px); border-radius: 24px; }
	.chs-showcase__body { padding: 26px 22px; }
	.chs-showcase__ctas .chs-btn { width: 100%; }
	.chs-showcase__media { padding: 0 18px 18px; }
	.chs-projects { padding: 0 8px 72px; }
	.chs-projects__panel { border-radius: 24px; }
	.chs-projects__head .chs-btn { width: 100%; }
	.chs-cta { padding: 16px 8px 72px; }
	.chs-cta__panel { border-radius: 24px; }
	.chs-cta__symbol { display: none; }
	.chs-case { padding-top: calc(var(--chs-header-h) + 28px); }
	.chs-case__pinner { padding-left: 18px; }
	.chs-steps { padding: 16px 8px; }
	.chs-steps__panel { border-radius: 24px; }
	.chs-pod__micwrap { display: none; }
	.chs-pod__thumbs { display: none; }
	.chs-pod__wave { height: 22%; bottom: 4%; }
	.chs-pod[data-variant="2"] .chs-pod__inner { padding-bottom: 80px; }
	.chs-eps { padding: 72px 0 56px; }
	.chs-eps__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
	.chs-phero *, .chs-pod *, .chs-steps *, .chs-showcase *, .chs-projects *, .chs-case *, .chs-eps * { animation: none !important; transition: none !important; }
	.chs-v__path { stroke-dashoffset: 0; }
	.chs-v__notif { opacity: 1; }
}

/* Pages that start on a light background (case pages): solid header from the top. */
body.single-chs_projet .chs-header { background: rgba(11,20,55,.92); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); }

/* Réalisations hero 3: tile cross-fade when the hero changes */
.chs-phero__tile { transition: opacity .45s ease, transform .45s var(--chs-ease); }
.chs-phero__tile.is-swap { opacity: 0; transform: scale(.96); }
/* Podcast hero 3: thumbnails open the episode */
.chs-pod__layer--3 { pointer-events: none; }
.chs-pod__thumblink { display: block; pointer-events: auto; color: inherit; }
.chs-pod__thumb:hover { box-shadow: 0 40px 80px rgba(0,0,0,.5), 0 0 0 2px var(--ch-bleu-ciel); }
.chs-pod__thumblink:hover .chs-pod__play { transform: scale(1.08); }
.chs-pod__play { transition: transform .3s var(--chs-ease); }
.chs-pod[data-variant="3"] .chs-pod__inner { pointer-events: none; }
.chs-pod[data-variant="3"] .chs-pod__inner > * { pointer-events: auto; }

/* Podcast steps without the design switcher: visuals sit lower, closer to the step heading (retouche, TICKET-08). */
.chs-step__visual:not(:has(.chs-switcher)) .chs-v { padding: 64px 24px 12px; }
.chs-step__visual:not(:has(.chs-switcher)) .chs-v--chart > svg { bottom: 12px; }

/* ---------- Legal documents (mentions légales, politique de confidentialité) ---------- */
body:has(.chs-legal) .chs-intro { min-height: 0; padding-bottom: 96px; }
.chs-legal { background: var(--ch-papier); padding: clamp(56px, 7vw, 104px) 0 clamp(72px, 9vw, 128px); }
.chs-legal__grid { display: grid; grid-template-columns: minmax(220px, 300px) minmax(0, 1fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
.chs-legal__toc { position: sticky; top: calc(var(--chs-header-h) + 24px); max-height: calc(100vh - var(--chs-header-h) - 48px); overflow: auto; padding: 24px; border-radius: 22px; background: #fff; box-shadow: inset 0 0 0 1px var(--ch-trait); scrollbar-width: thin; }
.chs-legal__toc-h { margin: 0 0 14px; font: 500 12px/1 var(--ch-head); letter-spacing: .16em; text-transform: uppercase; color: var(--ch-brume); }
.chs-legal__toc summary { display: flex; align-items: center; justify-content: space-between; list-style: none; pointer-events: none; }
.chs-legal__toc summary::-webkit-details-marker { display: none; }
.chs-legal__toc summary .chs-icon { display: none; width: 16px; height: 16px; color: var(--ch-nuit); transform: rotate(90deg); transition: transform .25s var(--chs-ease); }
.chs-legal__toc ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.chs-legal__toc a { display: block; padding: 8px 10px; border-radius: 10px; font: 500 14px/1.35 var(--ch-head); color: var(--ch-ardoise); text-decoration: none; transition: background .2s, color .2s; }
.chs-legal__toc a span { display: block; margin-bottom: 2px; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--ch-brume); }
.chs-legal__toc a:hover, .chs-legal__toc a.is-active { background: var(--ch-nuage); color: var(--ch-bleu-roi); }
.chs-legal__doc { max-width: 780px; font: 400 16.5px/1.75 var(--ch-body); color: var(--ch-ardoise); }
.chs-legal__updated { display: inline-block; margin: 0 0 8px; padding: 8px 14px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--ch-trait); font: 500 13.5px/1 var(--ch-head); color: var(--ch-nuit); }
.chs-legal__doc h2 { margin: 56px 0 16px; padding-top: 32px; border-top: 1px solid var(--ch-trait); font: 600 clamp(22px, 2.2vw, 28px)/1.25 var(--ch-head); letter-spacing: -.02em; color: var(--ch-nuit); scroll-margin-top: calc(var(--chs-header-h) + 24px); }
.chs-legal__doc h2:first-of-type { margin-top: 32px; }
.chs-legal__doc h3 { margin: 32px 0 10px; font: 600 18px/1.35 var(--ch-head); color: var(--ch-nuit); }
.chs-legal__doc p { margin: 0 0 14px; }
.chs-legal__doc strong { color: var(--ch-encre); font-weight: 600; }
.chs-legal__doc ul { margin: 4px 0 18px; padding: 0; list-style: none; display: grid; gap: 8px; }
.chs-legal__doc li { position: relative; padding-left: 26px; }
.chs-legal__doc li::before { content: ""; position: absolute; left: 4px; top: .68em; width: 8px; height: 8px; border-radius: 3px; background: linear-gradient(135deg, var(--ch-bleu-ciel), var(--ch-bleu-roi)); }
.chs-legal__doc a { color: var(--ch-bleu-roi); text-decoration: underline; text-decoration-color: rgba(30,63,217,.3); text-underline-offset: 3px; overflow-wrap: anywhere; }
.chs-legal__doc a:hover { text-decoration-color: currentColor; }
@media (max-width: 960px) {
	.chs-legal__grid { grid-template-columns: minmax(0, 1fr); }
	.chs-legal__toc { position: static; max-height: none; }
	.chs-legal__toc summary { pointer-events: auto; cursor: pointer; margin: 0; font-size: 13px; color: var(--ch-nuit); }
	.chs-legal__toc summary .chs-icon { display: block; }
	.chs-legal__toc details[open] summary { margin-bottom: 14px; }
	.chs-legal__toc details[open] summary .chs-icon { transform: rotate(-90deg); }
	.chs-legal__toc ol { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
}
@media (max-width: 600px) {
	.chs-legal__toc { padding: 18px; }
	.chs-legal__toc ol { grid-template-columns: minmax(0, 1fr); }
	.chs-legal__doc { font-size: 16px; }
}

/* ---------- Cookie consent ---------- */
.chs-cc { position: fixed; left: 24px; bottom: 24px; z-index: 100000; width: min(460px, calc(100vw - 32px)); opacity: 0; transform: translateY(16px); transition: opacity .26s ease, transform .26s var(--chs-ease); }
.chs-cc.is-open { opacity: 1; transform: none; }
.chs-cc__card { position: relative; overflow: hidden; isolation: isolate; padding: 26px; border-radius: 26px; color: #fff; background: radial-gradient(90% 70% at 100% 0%, rgba(30,63,217,.55), transparent 70%), radial-gradient(60% 60% at 0% 100%, rgba(95,212,255,.16), transparent 70%), rgba(11,20,55,.97); box-shadow: 0 30px 80px rgba(3,8,30,.45), inset 0 0 0 1px rgba(95,212,255,.2); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.chs-cc__card::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: var(--ch-grain); opacity: .06; pointer-events: none; }
.chs-cc__head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.chs-cc__symbol { width: 30px; height: 30px; flex: none; }
.chs-cc__title { margin: 0; font: 600 19px/1.25 var(--ch-head); letter-spacing: -.01em; color: #fff; }
.chs-cc__prefs .chs-cc__title { margin-bottom: 14px; }
.chs-cc__text { margin: 0; font: 400 14.5px/1.6 var(--ch-body); color: rgba(255,255,255,.76); }
.chs-cc__text a { color: var(--ch-bleu-ciel); text-underline-offset: 3px; }
.chs-cc__cats { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; max-height: min(52vh, 420px); overflow: auto; }
.chs-cc__cat { padding: 14px 16px; border-radius: 16px; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); }
.chs-cc__cat-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.chs-cc__cat-name { font: 600 15px/1.3 var(--ch-head); color: #fff; }
.chs-cc__cat-text { margin: 6px 0 0; font: 400 13.5px/1.55 var(--ch-body); color: rgba(255,255,255,.66); }
.chs-cc__always { font: 500 12px/1 var(--ch-head); letter-spacing: .06em; color: var(--ch-bleu-ciel); white-space: nowrap; }
.chs-cc__switch { position: relative; flex: none; width: 44px; height: 26px; }
.chs-cc__switch input { position: absolute; inset: 0; z-index: 1; margin: 0; opacity: 0; cursor: pointer; }
.chs-cc__switch span { position: absolute; inset: 0; border-radius: 999px; background: rgba(255,255,255,.18); transition: background .2s; }
.chs-cc__switch span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,.3); transition: transform .25s var(--chs-ease); }
.chs-cc__switch input:checked + span { background: var(--ch-bleu); }
.chs-cc__switch input:checked + span::after { transform: translateX(18px); }
.chs-cc__switch input:focus-visible + span { outline: 2px solid var(--ch-bleu-ciel); outline-offset: 3px; }
.chs-cc__actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 20px; }
.chs-cc__btn { display: inline-flex; align-items: center; justify-content: center; text-align: center; min-height: 46px; padding: 0 12px; border: 0; border-radius: 999px; font: 600 14px/1.15 var(--ch-head); cursor: pointer; transition: background .2s, color .2s, box-shadow .2s; }
.chs-cc__btn[hidden] { display: none; }
.chs-cc__btn--ghost { background: rgba(255,255,255,.08); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.28); }
.chs-cc__btn--ghost:hover { background: #fff; color: var(--ch-nuit); }
.chs-cc__btn--primary { background: var(--ch-bleu-roi); color: #fff; box-shadow: 0 10px 26px rgba(30,63,217,.45), inset 0 1px 0 rgba(255,255,255,.18); }
.chs-cc__btn--primary:hover { background: var(--ch-azur); }
.chs-cc__btn:focus-visible { outline: 2px solid var(--ch-bleu-ciel); outline-offset: 3px; }
@media (max-width: 600px) {
	.chs-cc { left: 8px; right: 8px; bottom: 8px; width: auto; }
	.chs-cc__card { padding: 20px; border-radius: 22px; }
	.chs-cc__actions { gap: 6px; }
	.chs-cc__btn { min-height: 44px; padding: 0 8px; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) { .chs-cc { transition: none; } }