/* Psychofight v2: camada de movimento sobre o site atual (motor da equipe + Lenis).
   Referências do acervo: cenas fixas e paralaxe da Casa na Árvore; tipografia gigante de localização.
   Paleta continua só preto, branco e cinzas (decisão do dono, 03/11). */

/* Lenis: a rolagem suave é dele, não do CSS */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

/* ---------- Seu caminho: um round por vez, preso na tela ---------- */
.caminho__cena { background: var(--black); }
/* O ringue do app acende conforme os rounds passam: o véu clareia com --progresso (0 a 1). */
.caminho__cena .fx-palco { flex-direction: column; gap: 2rem; padding-inline: var(--g); background: var(--black) url("assets/img/ringue-v2.jpg") center 62% / cover no-repeat; isolation: isolate; }
.caminho__cena .fx-palco::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(10,10,10,.55), rgba(10,10,10,.9)); opacity: calc(1 - var(--progresso, 0) * .55); }
.cena__placar { width: min(var(--max), 100%); display: grid; gap: .75rem; }
.cena__rotulo { margin: 0; font: 400 1rem/1 var(--body); letter-spacing: .2em; text-transform: uppercase; color: var(--gray); }
.cena__rotulo b { color: var(--white); font-weight: 600; }
.cena__rotulo b::after { content: "1"; }
[data-etapa="2"] .cena__rotulo b::after { content: "2"; }
[data-etapa="3"] .cena__rotulo b::after { content: "3"; }
[data-etapa="4"] .cena__rotulo b::after { content: "4"; }
.cena__rounds { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.cena__rounds i { display: block; height: 4px; border-radius: var(--pill); background: var(--g700); overflow: hidden; position: relative; }
.cena__rounds i::after { content: ""; position: absolute; inset: 0; background: var(--white); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--ease); }
[data-etapa="1"] .cena__rounds i:nth-child(-n+1)::after,
[data-etapa="2"] .cena__rounds i:nth-child(-n+2)::after,
[data-etapa="3"] .cena__rounds i:nth-child(-n+3)::after,
[data-etapa="4"] .cena__rounds i:nth-child(-n+4)::after { transform: scaleX(1); }

.caminho__cena .rounds { display: grid; width: min(var(--max), 100%); background: none; }
.caminho__cena .round { grid-area: 1 / 1; border: 0; background: none; padding-block: 0; transform: translateY(28px); transition: opacity .45s ease, transform .7s var(--ease); }
.caminho__cena .round:last-child { border: 0; }
[data-etapa="1"] .round--1, [data-etapa="2"] .round--2, [data-etapa="3"] .round--3, [data-etapa="4"] .round--4 { transform: none; }
.caminho__cena .round__n { font-size: clamp(9rem, 42vw, 22rem); }
.caminho__cena .round__t { font-size: clamp(2.6rem, 10vw, 5.4rem); }

/* ---------- Conquistas: trilho lateral preso na tela ---------- */
.conquistas__cena .fx-palco { justify-content: flex-start; }
.conquistas__cena [data-fx="trilho"] { width: 100%; gap: 1rem; margin: 0; padding-inline: var(--g); grid-template-columns: none; }
.conquistas__cena .m { flex: 0 0 auto; width: auto; height: min(70svh, 640px); aspect-ratio: 4 / 5; grid-column: auto; grid-row: auto; }
.conquistas__fim { flex: 0 0 min(80vw, 26rem); display: grid; align-content: center; gap: 1rem; padding-right: var(--g); }
.conquistas__fim p { margin: 0; font: 400 clamp(2.4rem, 7vw, 4.4rem)/.95 var(--display); text-transform: uppercase; color: var(--white); }
.conquistas__fim span { color: var(--gray); font-size: 1.05rem; }
/* "O seu." em linha própria e maior */
.conquistas__fim b { display: block; margin-top: .15em; font-weight: 400; font-size: 1.45em; }

/* ---------- Movimento reduzido: tudo visível, empilhado ---------- */
.fx-reduzido .caminho__cena .round { grid-area: auto; transform: none; padding-block: 2rem; }
.fx-reduzido .caminho__cena .rounds { gap: 1rem; }
.fx-reduzido .cena__placar { display: none; }
.fx-reduzido .conquistas__cena [data-fx="trilho"] { overflow-x: auto; }
