/* Sequencia de scroll — UMA unica camada de imagem por vez. Ordem de pintura (de tras para frente): html -> cor solida #363e15 (nunca uma imagem) canvas / img -> z-index -2, mutuamente exclusivos (so um existe na tela) shade -> z-index -1, degrade de contraste body::before -> z-index -1, blur O fundo do deixou de ser o frame-001.jpg: ele duplicava a primeira imagem da sequencia atras do canvas e aparecia junto com o frame atual sempre que o canvas nao cobria 100% da viewport. */ html.scrollSequenceActive { background: #363e15 !important; } body.scrollSequenceActive { background: transparent !important; } body.scrollSequenceActive::before { -webkit-backdrop-filter: blur(3.5px) !important; backdrop-filter: blur(3.5px) !important; } /* papel de parede enviado pelo painel nao entra nestas paginas */ body.scrollSequenceActive > #_wpbg { display: none !important; } /* 100% em vez de 100vw/100dvh: 100vw inclui a barra de rolagem e fazia a camada vazar para fora da viewport. width/height explicitos sao obrigatorios aqui — canvas e img sao elementos substituidos e, com width:auto, adotariam o tamanho intrinseco (o buffer) em vez do inset. */ #scrollSequenceCanvas, #scrollSequenceFallback, #scrollSequenceShade { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; } #scrollSequenceCanvas { z-index: -2; display: block; background: #363e15; } #scrollSequenceFallback { z-index: -2; display: none; object-fit: cover; object-position: 50% 50%; max-width: none; border: 0; } body.scrollSequenceFallbackActive #scrollSequenceCanvas { display: none !important; } body.scrollSequenceFallbackActive #scrollSequenceFallback { display: block; } #scrollSequenceShade { z-index: -1; background: radial-gradient(ellipse at center, transparent 34%, rgba(0, 9, 7, .18) 100%), linear-gradient(180deg, rgba(0, 8, 6, .08), rgba(0, 8, 6, .22)); } @media (max-width: 700px) { #scrollSequenceShade { background: radial-gradient(ellipse at center, transparent 24%, rgba(0, 9, 7, .24) 100%), linear-gradient(180deg, rgba(0, 8, 6, .12), rgba(0, 8, 6, .28)); } }