:root {
  --bg: #050505; --navy: #0d111c; --card-dark: #111111; --ink: #fff; --muted: #cecfd2; --dim: #84868a; --btn-ink: #414651;
  --line: rgba(255,255,255,.12); --red: #ff2e36; --red-deep: #5a0011; --red-badge: #e74c3c;
  --card-grad: linear-gradient(180deg, #282d39 50%, #101010 100%);
  --font-display: "Helvetica Now", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: Menlo, "Share Tech Mono", "Roboto Mono", monospace;
  --container: 1280px; --gutter: clamp(20px, 4vw, 56px); --ease: cubic-bezier(.22,1,.36,1);
}

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

html.lenis, html.lenis body { height: auto; }

.lenis.lenis-smooth { scroll-behavior: auto !important; }

.lenis.lenis-stopped { overflow: hidden; }

.lge { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font-display); font-size: 17px; line-height: 1.5; -webkit-font-smoothing: antialiased; overflow-x: clip; }

.lge img { max-width: 100%; height: auto; display: block; }

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

.lge button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }

.lge ul { list-style: none; margin: 0; padding: 0; }

.lge h1, .lge h2, .lge h3, .lge h4, .lge p { margin: 0; }

.lge .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.lge .container { width: min(var(--container), 100% - 2 * var(--gutter)); margin-inline: auto; }




.lge .labelhalo { width: fit-content; border-radius: 999px; border: 2px solid transparent; padding: 8px 14px 6px; margin-bottom: 22px;
  background: linear-gradient(#313131, #313131) padding-box, linear-gradient(90deg, #2a1a1e 0%, #6d4a52 18%, #d49aa7 50%, #6d4a52 82%, #2a1a1e 100%) border-box;
  color: #b9959c; font-family: var(--font-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; text-align: center; white-space: nowrap; line-height: 1.1; text-shadow: 0 0 9px rgba(220,150,165,.2); }


.lge .tag { display: inline-block; background: rgba(255,255,255,.1); padding: 8px 16px 5px; border-radius: 100px; font-family: var(--font-mono); font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: -.02em; color: #fff; }


.lge .border-fade { position: relative; border-radius: 14px; }

.lge .border-fade::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; background: linear-gradient(to bottom, #ffffff24, #ffffff00); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }


.lge-card { width: min(100%, 420px); border: 1px solid rgba(255,255,255,.48); border-radius: 20px; background: var(--card-grad); overflow: hidden; box-shadow: 0 40px 80px -30px rgba(0,0,0,.9); }

.lge-card__top { padding: 20px 20px 0; display: flex; flex-direction: column; align-items: center; gap: 18px; }

.lge-card__top img { width: min(70%, 260px); height: 200px; object-fit: contain; filter: drop-shadow(0 20px 30px rgba(0,0,0,.6)); }

.lge-card__body { background: var(--card-dark); border-radius: 0 0 20px 20px; padding: 25px; text-align: center; }

.lge-card__title { font-weight: 700; font-size: 28px; letter-spacing: -.02em; line-height: 1.05; text-transform: uppercase; margin-bottom: 12px; }

.lge-card__body p { color: var(--muted); font-size: 16px; letter-spacing: -.3px; }


.lge .diff-badge { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 20px; border: 1px solid var(--red-badge); background: linear-gradient(#5a0011 0%, #2a0008 100%); box-shadow: 0 0 12px rgba(231,76,60,.4); font-size: 11px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; color: #fff; white-space: nowrap; }

.lge .diff-badge .stars { display: flex; gap: 2px; }
 .lge .diff-badge .stars img { width: 10px; height: 10px; }
 .lge .diff-badge .stars img.is-off { opacity: .25; }


.lge .red-glow { --rg-deep: 166,14,19; --rg-bright: 255,50,57; --rg-intensity: .45; isolation: isolate; }

.lge .red-glow::before { content: ""; position: absolute; z-index: 0; pointer-events: none; mix-blend-mode: screen; top: -40%; right: -20%; width: 90%; height: 130%; filter: blur(90px);
  background: radial-gradient(ellipse 22% 60% at center, rgba(var(--rg-bright), var(--rg-intensity)) 0%, rgba(var(--rg-bright), 0) 60%), radial-gradient(ellipse 35% 80% at center, rgba(var(--rg-deep), calc(var(--rg-intensity) * .8)) 0%, transparent 75%); rotate: 40deg; animation: rg-pulse 9s ease-in-out infinite; }

@keyframes rg-pulse { 0%,100% { opacity: .8; transform: scale(1); } 50% { opacity: 1; transform: scale(1.12); } }


.lge .h-display { font-weight: 700; letter-spacing: -.035em; line-height: .98; font-size: clamp(36px, 5.2vw, 76px); text-wrap: balance; max-width: 15ch; }

.lge .lead { color: var(--muted); font-size: clamp(16px, 1.2vw, 18px); letter-spacing: -.3px; max-width: 54ch; margin-top: 18px; text-shadow: 0 2px 20px rgba(0,0,0,.6); }

.lge .lead--center { margin-inline: auto; text-align: center; }

.lge .hero__title { font-weight: 100; letter-spacing: -.02em; line-height: 1.02; font-size: clamp(44px, 8vw, 118px); text-align: center; }

.lge .hero__line { display: block; }

.lge .hero__grad { background: linear-gradient(180deg, #fff 50%, rgba(255,255,255,0) 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }

.lge .rotator { display: inline-grid; vertical-align: top; color: var(--red); text-shadow: 0 0 40px rgba(255,46,54,.35); }

.lge .rotator__word { grid-area: 1/1; opacity: 0; white-space: nowrap; }

.lge .rotator__word.is-active { opacity: 1; }



.lge .btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 16px 22px; border-radius: 8px; font-weight: 500; font-size: 17px; letter-spacing: -.3px; white-space: nowrap; transition: transform .4s var(--ease), background .3s, color .3s, border-color .3s, box-shadow .3s; }

.lge .btn--sm { padding: 12px 18px; font-size: 15px; }

.lge .btn--white { background: #fff; color: var(--btn-ink); }

.lge .btn--white:hover { background: #eee; transform: translateY(-2px); box-shadow: 0 14px 30px -12px rgba(255,255,255,.35); }

.lge .btn--dark { background: #0c0c0e; color: #fff; border-radius: 12px; border: 1px solid rgba(255,255,255,.08); }

.lge .btn--dark:hover { background: #1c1c20; }

.lge .btn--ghost { border: 1px solid rgba(255,255,255,.3); color: #fff; backdrop-filter: blur(8px); background: rgba(0,0,0,.2); }

.lge .btn--ghost:hover { border-color: #fff; background: rgba(255,255,255,.1); }

.lge .btn--insta { background: #3b82f6; color: #fff; }

.lge .link-underline { display: inline-flex; align-items: center; gap: 8px; font-size: 17px; letter-spacing: -.3px; color: #eee; text-decoration: underline; text-underline-offset: 5px; text-decoration-color: rgba(255,255,255,.5); transition: text-decoration-color .3s; }

.lge .link-underline:hover { text-decoration-color: #fff; }

.lge .link-underline i { font-style: normal; text-decoration: none; }



.lge .site-header { position: fixed; inset: 0 0 auto 0; z-index: 50; padding: 10px 0; }

.lge .site-header__inner { width: min(900px, 100% - 2 * var(--gutter)); margin-inline: auto; display: flex; align-items: center; gap: 22px; background: var(--navy); border-radius: 14px; padding: 6px 6px 6px 16px; }

.lge .site-header__logo img { width: 96px; }

.lge .site-nav { display: flex; gap: 18px; margin-left: 6px; font-weight: 400; font-size: 13px; letter-spacing: -.2px; }

.lge .site-nav a { padding: 6px 0; color: #fff; opacity: .9; transition: opacity .3s; }
 .lge .site-nav a:hover { opacity: 1; }

.lge .site-header .btn { margin-left: auto; padding: 9px 14px; font-size: 13px; border-radius: 9px; }

.lge .burger { display: none; width: 44px; height: 44px; margin-left: auto; position: relative; }

.lge .burger span { position: absolute; left: 10px; right: 10px; height: 2px; background: #fff; transition: transform .4s var(--ease), top .4s var(--ease); }

.lge .burger span:first-child { top: 17px; }
 .lge .burger span:last-child { top: 25px; }

.lge .burger[aria-expanded="true"] span:first-child { top: 21px; transform: rotate(45deg); }

.lge .burger[aria-expanded="true"] span:last-child { top: 21px; transform: rotate(-45deg); }

.lge .mobile-menu { position: fixed; inset: 0; z-index: 45; background: var(--bg); display: flex; flex-direction: column; justify-content: center; gap: 22px; padding: 80px var(--gutter); font-size: 32px; font-weight: 700; letter-spacing: -.02em; }

.lge .mobile-menu[hidden] { display: none; }

.lge .mobile-menu .btn { align-self: flex-start; margin-top: 14px; font-size: 16px; }



.lge .side-index { position: fixed; right: 26px; top: 50%; transform: translateY(-50%); z-index: 40; display: flex; flex-direction: column; gap: 14px; }

.lge .side-index a { display: flex; align-items: center; justify-content: flex-end; gap: 10px; color: rgba(255,255,255,.45); font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; transition: color .3s; }

.lge .side-index a span { opacity: 0; transform: translateX(6px); transition: opacity .3s, transform .3s var(--ease); text-transform: uppercase; }

.lge .side-index a i { font-style: normal; width: 26px; text-align: right; }

.lge .side-index a::after { content: ""; width: 14px; height: 1px; background: currentColor; transition: width .3s var(--ease); }

.lge .side-index a.is-active { color: #fff; }
 .lge .side-index a.is-active::after { width: 30px; background: var(--red); }

.lge .side-index a:hover span, .lge .side-index a.is-active span { opacity: 1; transform: none; }

.lge .progress { position: fixed; left: 0; top: 0; width: 100%; height: 2px; z-index: 60; pointer-events: none; }

.lge .progress span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--red), #ff8a8f); box-shadow: 0 0 12px var(--red); }



.lge .story { position: relative; height: 1400vh; }

.lge .story__stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; background: #000; }

.lge .story__canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

.lge .story__vignette { position: absolute; inset: 0; pointer-events: none; transition: opacity .5s; opacity: 0; }

.lge .story__vignette[data-side="left"] { opacity: 1; background: linear-gradient(90deg, rgba(5,5,5,.85) 0%, rgba(5,5,5,.5) 45%, transparent 75%); }

.lge .story__vignette[data-side="right"] { opacity: 1; background: linear-gradient(270deg, rgba(5,5,5,.75) 0%, rgba(5,5,5,.35) 45%, transparent 75%); }

.lge .story__vignette[data-side="center"] { opacity: 1; background: radial-gradient(60% 60% at 50% 55%, rgba(5,5,5,.78), rgba(5,5,5,.4) 70%, transparent); }

.lge .story__vignette[data-side="bottom"] { opacity: 1; background: linear-gradient(180deg, transparent 15%, rgba(5,5,5,.65) 50%, rgba(5,5,5,.94) 100%); }

.lge .story__vignette[data-side="hero"] { opacity: 1; background: radial-gradient(120% 90% at 50% 44%, rgba(5,2,3,0) 30%, rgba(5,2,3,.55) 68%, rgba(5,2,3,.92) 100%), linear-gradient(180deg, rgba(5,5,5,.5) 0%, transparent 25%, rgba(5,5,5,.6) 62%, rgba(5,5,5,.96) 100%); }

.lge .story__loader { position: absolute; inset: 0; z-index: 5; background: var(--bg); display: grid; place-content: center; justify-items: center; gap: 22px; transition: opacity .6s, visibility .6s; }

.lge .story__loader.is-hidden { opacity: 0; visibility: hidden; }

.lge .story__loader img { width: 180px; }

.lge .story__loader-bar { width: 200px; height: 2px; background: rgba(255,255,255,.15); overflow: hidden; }

.lge .story__loader-bar span { display: block; height: 100%; width: 0; background: var(--red); box-shadow: 0 0 10px var(--red); transition: width .2s; }

.lge .story__loader p { font-family: var(--font-mono); font-size: 11px; letter-spacing: .2em; color: var(--dim); }

/* Écran d'ouverture vidéo à la place de la barre de chargement (sequence-hero) */
.lge .story__loader--video { display: block; padding: 0; background: #000; }
.lge .story__loader--video video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #000; }



.lge .chap { position: absolute; inset: 0; display: flex; align-items: center; z-index: 2; pointer-events: none; visibility: hidden; opacity: 0; overflow: hidden; }

.lge .chap.is-visible { visibility: visible; opacity: 1; }

.lge .chap.is-visible .chap__inner { pointer-events: auto; }

.lge .chap__inner { position: relative; z-index: 1; width: min(var(--container), 100% - 2 * var(--gutter)); margin-inline: auto; }

.lge .chap [data-step] { opacity: 0; transform: translateY(40px); will-change: opacity, transform; }

.lge .chap--hero { align-items: center; }

.lge .chap--hero .chap__inner { display: flex; flex-direction: column; align-items: center; padding-top: 18vh; }

.lge .chap--left .chap__inner > *, .lge .chap--app .chap__copy, .lge .chap--avis .chap__copy, .lge .chap--league .chap__copy { max-width: 600px; }

.lge .chap--right .chap__inner { display: flex; justify-content: flex-end; }

.lge .chap--center { text-align: center; }

.lge .chap--center .chap__inner { display: flex; flex-direction: column; align-items: center; }

.lge .chap--center .h-display { max-width: 22ch; }

.lge .chap--modes { align-items: flex-end; }

.lge .chap--modes .chap__inner { padding-bottom: clamp(36px, 6vh, 80px); }

.lge .chap__cta { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; margin-top: 30px; }

.lge .chap__cta--center { justify-content: center; }

.lge .scroll-hint { position: absolute; right: var(--gutter); bottom: 34px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); display: flex; align-items: center; gap: 12px; }

.lge .scroll-hint span { width: 1px; height: 54px; background: rgba(255,255,255,.25); position: relative; overflow: hidden; }

.lge .scroll-hint span::after { content: ""; position: absolute; inset: 0; background: #fff; animation: scrollbar 1.8s var(--ease) infinite; }

@keyframes scrollbar { 0% { transform: translateY(-100%); } 60%, 100% { transform: translateY(100%); } }


.lge .modes { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin: 28px 0 22px; }

.lge .mode-tile { position: relative; display: block; aspect-ratio: 4 / 5; border-radius: 20px; overflow: hidden; background: #111; box-shadow: 0 30px 60px -30px rgba(0,0,0,.9); transition: transform .5s var(--ease); }

.lge .mode-tile:hover { transform: translateY(-6px) scale(1.02); }

.lge .mode-tile__art { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }

.lge .mode-tile:hover .mode-tile__art { transform: scale(1.08); }

.lge .mode-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.1) 30%, rgba(0,0,0,.85) 100%); }

.lge .mode-tile .diff-badge { position: absolute; top: 12px; left: 12px; z-index: 2; transform: scale(.85); transform-origin: 0 0; }

.lge .mode-tile__logo { position: absolute; left: 14px; right: 14px; bottom: 14px; z-index: 2; height: 34px; object-fit: contain; object-position: left; filter: drop-shadow(0 6px 14px rgba(0,0,0,.8)); }



.lge .manifesto { display: flex; align-items: center; justify-content: center; gap: .35em; font-weight: 400; letter-spacing: -.02em; line-height: 1.15; font-size: clamp(24px, 3.4vw, 50px); color: #b6b7ba; text-shadow: 0 4px 30px rgba(0,0,0,.8); margin: .18em 0; }

.lge .manifesto img { width: 1.25em; height: 1.25em; object-fit: contain; flex: none; filter: drop-shadow(0 6px 12px rgba(0,0,0,.6)); }



.lge .chap--app .chap__inner { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(24px, 5vw, 80px); align-items: center; }

.lge .app__stores { display: flex; align-items: center; gap: 12px; margin: 26px 0; flex-wrap: wrap; }

.lge .app__stores a img { height: 44px; width: auto; }

.lge .app__qr { width: 60px; height: 60px; border-radius: 8px; background: #fff; padding: 4px; margin-left: 6px; }

.lge .notifs { display: grid; gap: 10px; max-width: 460px; }

.lge .notif { display: flex; align-items: center; gap: 14px; padding: 12px 16px; border-radius: 18px; background: rgba(17,17,17,.85); border: 1px solid var(--line); backdrop-filter: blur(12px); }

.lge .notif img { width: 40px; height: 40px; border-radius: 10px; }

.lge .notif div { display: grid; gap: 2px; flex: 1; min-width: 0; }
 .lge .notif b { font-size: 14px; }
 .lge .notif span { font-size: 13px; color: var(--muted); }

.lge .notif time { font-family: var(--font-mono); font-size: 10px; color: var(--dim); align-self: flex-start; white-space: nowrap; }

.lge .app__visual { position: relative; height: min(70vh, 640px); display: grid; place-items: center; }

.lge .app__phone { position: relative; z-index: 2; height: 100%; width: auto; filter: drop-shadow(0 60px 80px rgba(0,0,0,.8)); }

.lge .app__trophy { position: absolute; z-index: 3; left: 0; bottom: 6%; width: min(40%, 220px); filter: drop-shadow(0 30px 40px rgba(0,0,0,.7)); }

.lge .app__cards { position: absolute; z-index: 1; right: 0; top: 6%; width: min(40%, 210px); filter: drop-shadow(0 30px 40px rgba(0,0,0,.7)); }



.lge .chap--avis .chap__inner { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 5vw, 80px); align-items: center; }

.lge .chap__halo { position: absolute; left: -10%; top: 10%; width: 50%; opacity: .7; pointer-events: none; z-index: 0; }

.lge .stats { display: flex; gap: clamp(24px, 4vw, 56px); margin-top: 30px; flex-wrap: wrap; }

.lge .stats--center { justify-content: center; }

.lge .stats li { display: grid; gap: 4px; }

.lge .stats b { font-weight: 700; font-size: clamp(30px, 3.6vw, 52px); letter-spacing: -.04em; line-height: 1; font-variant-numeric: tabular-nums; }

.lge .chap--avis .stats { gap: 28px; }
 .lge .chap--avis .stats b { font-size: clamp(26px, 2.6vw, 40px); }

.lge .stats li > span { font-family: var(--font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--dim); }

.lge .reviews { display: grid; gap: 14px; }

.lge .review { background: var(--card-dark); border-radius: 20px; padding: 24px 28px; display: grid; gap: 12px; box-shadow: 0 30px 60px -30px rgba(0,0,0,.9); }

.lge .review__stars { display: flex; gap: 6px; }
 .lge .review__stars img { width: 15px; height: 15px; }

.lge .review p { color: #fff; font-size: 15px; letter-spacing: -.3px; }

.lge .review footer { display: flex; align-items: center; gap: 14px; }

.lge .review footer img { width: 60px; opacity: .9; }

.lge .review footer span { display: grid; gap: 2px; }
 .lge .review footer b { font-size: 16px; font-weight: 400; }
 .lge .review footer small { font-family: var(--font-mono); font-size: 10px; letter-spacing: .06em; color: var(--dim); text-transform: uppercase; }



.lge .chap__map { position: absolute; left: 50%; top: 50%; width: min(1025px, 90%); transform: translate(-50%, -52%); opacity: .55; pointer-events: none; z-index: 0; }

.lge .search { display: flex; align-items: center; gap: 10px; margin: 30px auto 20px; width: min(640px, 100%); background: rgba(255,255,255,.2); border: 1px solid rgba(255,255,255,.3); border-radius: 18px; padding: 6px 6px 6px 16px; backdrop-filter: blur(10px); transition: border-color .3s, box-shadow .3s; }

.lge .search:focus-within { border-color: #fff; box-shadow: 0 0 0 4px rgba(255,255,255,.08); }

.lge .search__icon { color: rgba(255,255,255,.7); flex: none; }

.lge .search input { flex: 1; min-width: 0; background: none; border: 0; color: #fff; font: inherit; font-size: 16px; padding: 12px 0; outline: none; }

.lge .search input::placeholder { color: rgba(255,255,255,.55); }

.lge .search .btn { padding: 0 24px; height: 46px; font-size: 16px; }



.lge .chap--league .chap__inner { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(24px, 5vw, 80px); align-items: center; }

.lge .league__visual img { width: 100%; max-height: 70vh; object-fit: contain; filter: drop-shadow(0 40px 60px rgba(0,0,0,.8)); }



.lge .outro { position: relative; z-index: 3; background: #191919; padding: clamp(80px, 10vw, 130px) 0; }

.lge .outro__head { display: flex; flex-direction: column; align-items: center; text-align: center; }

.lge .outro__title { font-weight: 400; font-size: clamp(26px, 3vw, 36px); letter-spacing: -.02em; }

.lge .outro__handle { font-weight: 700; font-size: clamp(30px, 4vw, 52px); letter-spacing: -.03em; margin-top: 6px; }

.lge .commu__profile { display: flex; align-items: center; gap: 14px; margin: 36px 0 22px; }

.lge .commu__profile img { width: 64px; height: 64px; border-radius: 50%; border: 2px solid var(--red); }

.lge .commu__profile span { display: grid; gap: 4px; line-height: 1.3; }
 .lge .commu__profile b { color: #e9646f; font-weight: 500; }
 .lge .commu__profile small { color: var(--muted); font-size: 13px; }

.lge .commu__feed { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }

.lge .commu__post { position: relative; aspect-ratio: 1; border-radius: 6px; overflow: hidden; background: linear-gradient(160deg, #24242a, #0e0e10); display: flex; align-items: flex-end; padding: 16px; font-size: 13px; color: var(--muted); transition: transform .5s var(--ease); }

.lge .commu__post:hover { transform: translateY(-4px); }

.lge .outro__actions { margin-top: 22px; display: flex; justify-content: center; gap: 10px; }

.lge .outro__actions .btn { padding: 12px 18px; font-size: 14px; border-radius: 6px; }



.lge .site-footer { position: relative; z-index: 3; background: #191919; border-top: 1px solid var(--line); padding: clamp(60px, 8vw, 100px) 0 36px; }

.lge .site-footer__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 32px; padding-bottom: 44px; }

.lge .site-footer__grid h4 { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--dim); margin-bottom: 16px; }

.lge .site-footer__grid div > a { display: block; padding: 6px 0; color: #fff; letter-spacing: -.3px; transition: opacity .3s; }
 .lge .site-footer__grid div > a:hover { opacity: .7; }

.lge .site-footer__brand { display: grid; gap: 26px; align-content: start; justify-items: start; }
 .lge .site-footer__brand img { width: 210px; }

.lge .site-footer__claim { font-weight: 500; font-size: clamp(24px, 2.6vw, 34px); letter-spacing: -.02em; line-height: 1.1; max-width: 16ch; }

.lge .socials { display: flex; gap: 12px; }

.lge .socials a { width: 40px; height: 40px; border-radius: 50%; background: #fff; color: #111; display: grid; place-items: center; transition: transform .3s var(--ease); }
 .lge .socials a:hover { transform: translateY(-3px); }

.lge .site-footer__legal { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; padding-top: 26px; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }

.lge .site-footer__legal nav { display: flex; gap: 18px; flex-wrap: wrap; }
 .lge .site-footer__legal a:hover { color: #fff; }



@media (max-width: 1100px) {
  .lge .site-nav, .lge .site-header .btn, .lge .side-index { display: none; }

  .lge .burger { display: block; }

  .lge .chap--app .chap__inner, .lge .chap--league .chap__inner, .lge .chap--avis .chap__inner { grid-template-columns: 1fr; }

  .lge .app__visual, .lge .league__visual, .lge .chap__halo { display: none; }

  .lge .reviews { gap: 8px; }
 .lge .reviews .review:nth-child(n+3) { display: none; }

  .lge .review p { font-size: 13px; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }

  .lge .modes { grid-template-columns: repeat(3, 1fr); gap: 10px; }

  .lge .commu__feed { grid-template-columns: repeat(2, 1fr); }

  .lge .site-footer__grid { grid-template-columns: 1fr 1fr; }

}
@media (max-width: 640px) {
  .lge { font-size: 15px; }

  .lge .chap { align-items: flex-end; }

  .lge .chap__inner { padding-bottom: 6vh; }

  .lge .chap--hero .chap__inner { align-items: flex-start; padding-top: 0; }

  .lge .hero__title { font-size: clamp(40px, 12.5vw, 60px); text-align: left; line-height: 1.1; }

  .lge .lead--center { margin-inline: 0; text-align: left; }
 .lge .chap__cta--center { justify-content: flex-start; }

  .lge .h-display { font-size: clamp(30px, 8.5vw, 44px); }

  .lge-card { width: 100%; }
 .lge-card__top img { height: 130px; }
 .lge-card__title { font-size: 22px; }
 .lge-card__body { padding: 18px; }

  .lge .chap--right .chap__inner { justify-content: flex-start; }

  .lge .manifesto { font-size: clamp(20px, 6vw, 30px); justify-content: flex-start; text-align: left; }

  .lge .modes { grid-template-columns: repeat(3, 1fr); gap: 8px; }
 .lge .mode-tile { border-radius: 12px; }
 .lge .mode-tile .diff-badge { display: none; }
 .lge .mode-tile__logo { height: 22px; left: 10px; right: 10px; bottom: 10px; }

  .lge .scroll-hint { display: none; }

  .lge .search { flex-wrap: wrap; border-radius: 18px; padding: 8px; }
 .lge .search input { flex-basis: 100%; padding: 8px 4px; }
 .lge .search .btn { width: 100%; }

  .lge .stats { gap: 22px; }
 .lge .stats b { font-size: 30px; }

  .lge .reviews .review:nth-child(n+2) { display: none; }

  .lge .notifs .notif:nth-child(2) { display: none; }

  .lge .story__vignette[data-side="left"], .lge .story__vignette[data-side="right"], .lge .story__vignette[data-side="center"] { background: linear-gradient(180deg, transparent 25%, rgba(5,5,5,.7) 55%, rgba(5,5,5,.95) 100%); }

  .lge .site-footer__grid { grid-template-columns: 1fr; }

}
@media (prefers-reduced-motion: reduce) { .lge .scroll-hint span::after, .lge .red-glow::before { animation: none; }
 }

.lge .no-js .story { height: auto; }

.lge .no-js .story__stage { position: static; height: auto; }

.lge .no-js .story__canvas, .lge .no-js .story__loader, .lge .no-js .story__vignette { display: none; }

.lge .no-js .chap { position: static; visibility: visible; opacity: 1; padding: 80px 0; }

.lge .no-js .chap [data-step] { opacity: 1; transform: none; }




.lge .chap--caption { align-items: center; }

.lge .chap--caption .chap__inner { display: flex; flex-direction: column; align-items: center; text-align: center; padding-top: 0; }

.lge .chap--caption .labelhalo { margin-bottom: 14px; }

.lge .caption__title { font-weight: 500; font-size: clamp(22px, 2.4vw, 34px); letter-spacing: .04em; text-transform: uppercase; line-height: 1.2; max-width: 24ch; text-shadow: 0 2px 24px rgba(0,0,0,.7); }

.lge .caption__text { color: var(--muted); font-size: clamp(14px, 1.1vw, 17px); letter-spacing: .02em; line-height: 1.5; max-width: 62ch; margin-top: 10px; text-shadow: 0 2px 20px rgba(0,0,0,.7); }

.lge .caption__link { color: #fff; text-decoration: underline; text-underline-offset: 4px; margin-left: 6px; }

.lge .story__vignette[data-side="top"] { opacity: 1; background: radial-gradient(58% 58% at 50% 50%, rgba(5,5,5,.78), rgba(5,5,5,.4) 70%, transparent), linear-gradient(180deg, rgba(5,5,5,.5) 0%, transparent 35%, rgba(5,5,5,.6) 100%); }


.lge .chap--highlight .chap__inner { display: flex; justify-content: flex-end; align-items: center; }

.lge-card--mini { width: min(100%, 340px); }

.lge-card--mini .lge-card__top img { height: 150px; }

.lge-card--mini .lge-card__title { font-size: 24px; }

.lge-card--mini .lge-card__body { padding: 20px; }

.lge-card--mini .lge-card__body p { font-size: 15px; }


.lge .chap--center .manifesto--big { font-weight: 600; font-size: clamp(40px, 7vw, 112px); letter-spacing: -.04em; text-transform: uppercase; color: #fff; }

.lge .chap--center .manifesto { max-width: 24ch; }


.lge .chap--finale .search { margin-top: 26px; }

.lge .chap--finale .stats { margin-top: 26px; }


.lge .sec { position: relative; inset: auto; visibility: visible; opacity: 1; pointer-events: auto; overflow: visible; padding: clamp(90px, 11vw, 150px) 0; background: var(--bg); z-index: 3; }

.lge .sec .chap__inner { pointer-events: auto; }

.lge .sec [data-step] { opacity: 1; transform: none; }

.lge .sec--modes { background: #0b0b0d; }

.lge .sec--modes .chap__inner { display: block; }

.lge .sec--modes .modes { margin: 36px 0 26px; }

.lge .sec.chap--app { background: #101012; }

.lge .sec.chap--app .app__visual { height: min(70vh, 640px); }

.lge .sec.chap--avis { background: #0b0b0d; }

.lge .sec.chap--avis .chap__halo { top: 0; }

.lge .sec.chap--league { background: #101012; }

.lge .sec .h-display { max-width: 16ch; }


.lge .side-index { display: none; }

.lge .dock { position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 50; display: flex; align-items: center; gap: 4px; padding: 6px; border-radius: 14px; background: rgba(13,17,28,.85); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid rgba(255,255,255,.12); box-shadow: 0 20px 50px -20px rgba(0,0,0,.9); }

.lge .dock a { padding: 10px 14px; border-radius: 9px; font-size: 14px; letter-spacing: -.2px; color: rgba(255,255,255,.8); white-space: nowrap; transition: background .3s, color .3s; }

.lge .dock a:hover { color: #fff; background: rgba(255,255,255,.08); }

.lge .dock a.is-active { color: #fff; background: rgba(255,255,255,.12); }

.lge .dock .dock__cta { background: #fff; color: var(--btn-ink); font-weight: 500; margin-left: 6px; }

.lge .dock .dock__cta:hover { background: #eee; color: var(--btn-ink); }

.lge .scroll-hint { bottom: 34px; }

.lge .hero__sound { display: none; }

@media (max-width: 1100px) {
  .lge .chap--highlight .chap__inner { justify-content: center; align-items: flex-end; }

  .lge-card--mini { width: min(100%, 320px); }

}
@media (max-width: 640px) {
  .lge .dock { left: 12px; right: 12px; transform: none; bottom: 12px; justify-content: space-between; gap: 0; padding: 5px; }

  .lge .dock a { padding: 9px 8px; font-size: 12px; }

  .lge .dock a:not(.dock__cta):nth-child(3), .lge .dock a:not(.dock__cta):nth-child(4) { display: none; }

  .lge .chap--caption { align-items: center; }

  .lge .chap--caption .chap__inner { padding-top: 80px; padding-bottom: 0; }

  .lge .caption__title { font-size: 20px; }
 .lge .caption__text { font-size: 14px; }

  .lge .chap--center .manifesto--big { font-size: clamp(34px, 11vw, 56px); }

  .lge .sec { padding: 70px 0; }

}



.lge .hero__claim { font-weight: 500; font-size: clamp(20px, 2.4vw, 34px); letter-spacing: -.02em; line-height: 1.25; text-align: center; max-width: 24ch; text-shadow: 0 4px 30px rgba(0,0,0,.7); }

.lge .chap--hero .chap__inner { padding-top: 0; justify-content: flex-end; height: 100%; padding-bottom: clamp(80px, 14vh, 160px); gap: 6px; }

.lge .chap--hero .labelhalo { margin-bottom: 18px; }


.lge .chap--highlight-left .chap__inner { justify-content: flex-start; }

.lge-card--mini .lge-card__title { font-size: 22px; }


.lge .coverflow { position: relative; margin-top: 40px; }

.lge .coverflow__stage { position: relative; height: clamp(260px, 32vw, 420px); perspective: 1400px; }

.lge .coverflow__slide { position: absolute; left: 50%; top: 0; width: min(46%, 520px); aspect-ratio: 16 / 10; margin-left: calc(min(46%, 520px) / -2); border-radius: 20px; overflow: hidden; background: #111; box-shadow: 0 40px 80px -30px rgba(0,0,0,.9); cursor: pointer; transition: transform .7s var(--ease), opacity .7s, filter .7s; transform-style: preserve-3d; opacity: 0; pointer-events: none; }

.lge .coverflow__slide img { width: 100%; height: 100%; object-fit: cover; display: block; }

.lge .coverflow__slide[data-pos="0"] { transform: translateX(0) scale(1); opacity: 1; z-index: 3; pointer-events: auto; }

.lge .coverflow__slide[data-pos="-1"] { transform: translateX(-78%) rotateY(28deg) scale(.86); opacity: .75; z-index: 2; pointer-events: auto; filter: brightness(.8); }

.lge .coverflow__slide[data-pos="1"] { transform: translateX(78%) rotateY(-28deg) scale(.86); opacity: .75; z-index: 2; pointer-events: auto; filter: brightness(.8); }

.lge .coverflow__slide[data-pos="-2"] { transform: translateX(-120%) rotateY(40deg) scale(.7); opacity: 0; }

.lge .coverflow__slide[data-pos="2"] { transform: translateX(120%) rotateY(-40deg) scale(.7); opacity: 0; }

.lge .coverflow__nav { position: absolute; top: 50%; z-index: 4; width: 44px; height: 44px; margin-top: -22px; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); background: rgba(13,17,28,.7); color: #fff; font-size: 26px; line-height: 1; display: grid; place-items: center; backdrop-filter: blur(8px); transition: background .3s, border-color .3s; }

.lge .coverflow__nav:hover { background: rgba(255,255,255,.12); border-color: #fff; }

.lge .coverflow__nav--prev { left: 0; }
 .lge .coverflow__nav--next { right: 0; }

.lge .coverflow__info { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 14px; margin-top: 30px; min-height: 190px; }

.lge .coverflow__info .diff-badge { font-size: 12px; padding: 7px 16px; }

.lge .coverflow__info .logo { height: 54px; width: auto; max-width: 260px; object-fit: contain; filter: drop-shadow(0 8px 24px rgba(0,0,0,.7)); }

.lge .coverflow__info p { color: var(--muted); max-width: 46ch; font-size: 17px; letter-spacing: -.3px; }

.lge .coverflow__info .link-underline { margin-top: 4px; }

.lge .coverflow__dots { display: flex; justify-content: center; gap: 8px; margin-top: 18px; }

.lge .coverflow__dots button { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.25); padding: 0; transition: background .3s, transform .3s; }

.lge .coverflow__dots button.is-active { background: var(--red); transform: scale(1.3); box-shadow: 0 0 10px var(--red); }

@media (max-width: 640px) {
  .lge .site-header__inner { padding: 6px 6px 6px 12px; }

  .lge .site-header__logo img { width: 84px; }

  .lge .hero__claim { text-align: left; max-width: none; }

  .lge .chap--hero .chap__inner { align-items: flex-start; }

  .lge .coverflow__stage { height: 210px; }

  .lge .coverflow__slide { width: 78%; margin-left: -39%; }

  .lge .coverflow__slide[data-pos="-1"] { transform: translateX(-60%) rotateY(30deg) scale(.7); opacity: .4; }

  .lge .coverflow__slide[data-pos="1"] { transform: translateX(60%) rotateY(-30deg) scale(.7); opacity: .4; }

  .lge .coverflow__nav { display: none; }

  .lge .coverflow__info p { font-size: 15px; }

}



.lge .chap--jeu { align-items: stretch; }

.lge .chap--jeu .chap__inner { display: flex; flex-direction: column; justify-content: center; gap: clamp(20px, 3.5vh, 40px); padding-top: 72px; padding-bottom: 84px; }

.lge .chap--jeu .chap__head { display: flex; flex-direction: column; align-items: center; text-align: center; }

.lge .chap--jeu .chap__head .labelhalo { margin-bottom: 14px; }

.lge .cards-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 24px); align-items: stretch; }

.lge .cards-row .lge-card--mini { width: auto; display: flex; flex-direction: column; }

.lge .cards-row .lge-card__top { padding-top: 16px; gap: 12px; }

.lge .cards-row .lge-card__top img { height: clamp(90px, 13vh, 150px); }

.lge .cards-row .lge-card__body { flex: 1; padding: 16px 18px 18px; }

.lge .cards-row .lge-card__title { font-size: clamp(17px, 1.5vw, 22px); }

.lge .cards-row .lge-card__body p { font-size: 14px; }

.lge .story__vignette[data-side="jeu"] { opacity: 1; background: linear-gradient(180deg, rgba(5,5,5,.82) 0%, rgba(5,5,5,.35) 28%, rgba(5,5,5,.2) 50%, rgba(5,5,5,.85) 100%); }


.lge .brand__logo { width: min(52vw, 420px); filter: drop-shadow(0 10px 40px rgba(0,0,0,.8)); }

.lge .brand__name { margin-top: 18px; font-weight: 700; font-size: clamp(22px, 3vw, 40px); letter-spacing: -.02em; text-shadow: 0 4px 30px rgba(0,0,0,.8); }

@media (max-width: 1100px) {
  .lge .cards-row { gap: 10px; }

  .lge .cards-row .lge-card__top { display: none; }

  .lge .cards-row .lge-card__body { padding: 14px; }

  .lge .cards-row .lge-card__title { font-size: 15px; }

  .lge .cards-row .lge-card__body p { font-size: 12px; }

}
@media (max-width: 640px) {
  .lge .chap--jeu .chap__inner { padding-top: 70px; padding-bottom: 16px; }

  .lge .cards-row { grid-template-columns: 1fr; gap: 6px; }

  .lge .cards-row .lge-card__body { padding: 10px 12px; }

  .lge .cards-row .lge-card__body p { font-size: 12px; }

}


.lge .sticky-cta { position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); z-index: 55; padding: 13px 22px; font-size: 15px; border-radius: 10px; box-shadow: 0 18px 40px -12px rgba(0,0,0,.9), 0 0 0 1px rgba(255,255,255,.15); }

.lge .scroll-hint { bottom: 92px; }

@media (max-width: 640px) { .lge .sticky-cta { left: 12px; right: 12px; transform: none; text-align: center; }
 }


@media (max-width: 640px) {
  .lge .chap__inner { padding-bottom: 14vh; }

  .lge .chap--brand { align-items: center; }

  .lge .chap--brand .chap__inner { padding-bottom: 0; }

  .lge .chap--jeu .chap__inner { padding-bottom: 84px; }

  .lge .chap--finale .chap__inner { padding-bottom: 90px; }

  .lge .outro { padding-bottom: 120px; }

}


.lge .chap--mani .chap__inner { padding-top: 12vh; }

.lge .chap--mani .manifesto { color: #dfe0e3; }

.lge .chap--mani .manifesto--big { font-size: clamp(36px, 6vw, 96px); }



.lge-card--stats .lge-card__top { padding: 20px 16px 16px; }

.lge .card-stats { display: flex; justify-content: center; gap: 18px; width: 100%; padding: 8px 0 4px; }

.lge .card-stats li { display: grid; gap: 3px; text-align: center; }

.lge .card-stats b { font-weight: 700; font-size: clamp(20px, 1.7vw, 26px); letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; white-space: nowrap; }

.lge-card--stats { width: min(100%, 400px); }

.lge .card-stats { gap: 14px; }

.lge .card-stats span { font-family: var(--font-mono); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; color: var(--dim); }



@media (max-width: 640px) {
  .lge .chap--jeu .chap__inner { justify-content: center; padding-top: 64px; padding-bottom: 84px; gap: 18px; }

  .lge .chap--caption .chap__inner { padding-bottom: 0; }

}

/* =====================================================================
   VRAIS TITRES DE LA SÉQUENCE — charte du site (HORS cartes)
   caption__title, h-display, hero__title, outro__title + grand manifeste.
   Le texte gris simple (.manifesto sans --big) n'est PAS touché : il reste gris.
   Les cartes (.lge-card__title) ne sont PAS touchées non plus.
   ===================================================================== */
.lge .caption__title,
.lge .h-display,
.lge .hero__title,
.lge .outro__title {
  font-family: "Helvetica Now", Sans-serif !important;
  font-size: 48px !important;
  font-weight: 600 !important;
  letter-spacing: -0.4px !important;
  text-transform: none !important;
  color: #FFFFFF !important;
}

/* Texte manifeste : taille uniforme à 60px sur toutes les lignes.
   (graisse, interlettrage, casse, police : non touchés) */
.lge .chap--mani .manifesto,
.lge .chap--mani .manifesto--big {
  font-size: 60px;
}

/* Couleur du manifeste :
   - grand titre (--big) + lignes d'un bloc SANS grand titre  → blanc
   - ligne grise posée AU-DESSUS d'un grand titre (bloc avec --big) → reste grise */
.lge .chap--mani .manifesto--big,
.lge .chap--mani:not(:has(.manifesto--big)) .manifesto {
  color: #FFFFFF !important;
}

/* Cartes : laissées telles quelles (28px, 600, casse normale) — pas de 48px. */
.lge .lge-card__title {
  font-family: "Helvetica Now", Sans-serif !important;
  font-size: 28px !important;
  font-weight: 600 !important;
  letter-spacing: -0.4px !important;
  text-transform: none !important;
}
/* =====================================================================
   MOBILE / TABLETTE (14/09/2026)
   - Le header Elementor mobile (bloc 70f9d7e, fixe, ~95 px) recouvrait le
     debut des chapitres (etiquette « Le jeu » cachee derriere le menu).
   - Le bloc « charte » ci-dessus force 48 px / 60 px sans declinaison
     mobile : titres sur 3 lignes, manifeste coupe sur le bord droit.
   Le header mobile Elementor est affiche jusqu a 1024 px.
   ===================================================================== */
@media (max-width: 1024px) {
  .lge { --hdr-safe: 104px; }

  /* zone de securite sous le header fixe */
  .lge .chap--jeu .chap__inner { padding-top: var(--hdr-safe); justify-content: flex-start; }
  .lge .chap--caption .chap__inner { padding-top: var(--hdr-safe); }
  .lge .chap--center .chap__inner { padding-top: var(--hdr-safe); }
  .lge .chap--mani .chap__inner { padding-top: var(--hdr-safe); }

  /* voile sombre derriere le header flottant : le texte qui passe dessous reste lisible */
  .elementor-location-header .elementor-element.elementor-element-70f9d7e { background: linear-gradient(180deg, rgba(5,5,5,.82) 0%, rgba(5,5,5,.5) 60%, rgba(5,5,5,0) 100%) !important; padding-bottom: 22px !important; }

  /* titres : declinaison tablette */
  .lge .caption__title, .lge .h-display, .lge .outro__title { font-size: 40px !important; line-height: 1.08 !important; }
  .lge .hero__title { font-size: 44px !important; }
  .lge .chap--mani .manifesto { font-size: 44px; }
  .lge .chap--mani .manifesto--big { font-size: 50px; }
}

@media (max-width: 640px) {
  .lge { --hdr-safe: 100px; }

  /* titres et textes : declinaison mobile */
  .lge .caption__title, .lge .h-display, .lge .outro__title { font-size: 30px !important; line-height: 1.1 !important; letter-spacing: -.3px !important; }
  .lge .hero__title { font-size: 36px !important; line-height: 1.08 !important; }
  .lge .caption__text { font-size: 15px; line-height: 1.45; }
  .lge .chap--mani .manifesto { font-size: clamp(24px, 7.2vw, 30px); line-height: 1.2; max-width: 100%; }
  .lge .chap--mani .manifesto--big { font-size: clamp(30px, 9vw, 38px); line-height: 1.08; }

  /* chapitre « Le jeu » : 3 cartes compactes sous le titre */
  .lge .chap--jeu .chap__inner { gap: 14px; padding-bottom: 24px; }
  .lge .chap--jeu .chap__head .labelhalo { margin-bottom: 10px; }
  .lge .lge-card__title { font-size: 18px !important; margin-bottom: 4px; }
  .lge .cards-row .lge-card__body { padding: 12px 14px; }
  .lge .cards-row .lge-card__body p { font-size: 13px; line-height: 1.35; }

  /* hero : boutons empiles pleine largeur */
  .lge .chap--hero .chap__cta { width: 100%; flex-direction: column; align-items: stretch; gap: 10px; }
  .lge .chap--hero .chap__cta .btn { text-align: center; justify-content: center; }

  /* finale « Nos centres » et marque */
  .lge .chap--finale .search { margin-top: 18px; }
  .lge .chap--finale .stats { margin-top: 18px; }
  .lge .stats b { font-size: 26px; }
  .lge .brand__logo { width: min(60vw, 260px); }
}

/* Fond de page sombre derriere la home animee : evite le flash blanc au
   rebond du scroll sur mobile (le kit Elementor met le body en blanc). */
html { background: #050505; }
body { background-color: #050505 !important; }