do SVG (rotulo de acessibilidade, nunca renderizado) e apareciam na auditoria como um 11o tamanho da escala que nao existia na tela. */ } .hero .core svg { width: 94px; height: 94px; filter: drop-shadow(0 0 24px #d3654770); } .hero .tag { z-index: 2 } .hero .a { right: 43%; top: 12% } .hero .b { right: 8%; top: 14% } .hero .c { right: 46%; bottom: 12% } .hero .d { right: 8%; bottom: 11% } /* P0-4 — substrato SVG de fallback sem JS. Autora-se contra as posições acima. */ .fios-noscript { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; } .fios-noscript .fios-d { display: block } .fios-noscript .fios-m { display: none } @media (max-width: 760px) { .hero .core { /* Ancora pelo rodapé: independente da altura do texto, o símbolo nunca sobe acima da cópia. top:auto cancela o valor herdado do desktop; transform só centra no eixo X. */ left: 50%; top: auto; bottom: 48px; transform: translateX(-50%); width: 140px; height: 140px; } .hero .core svg { width: 84px; height: 84px } .hero .a { left: 6%; right: auto; top: 57% } .hero .b { right: 5%; top: 55% } .hero .c { left: 8%; right: auto; bottom: 7% } .hero .d { right: 4%; bottom: 6% } .fios-noscript .fios-d { display: none } .fios-noscript .fios-m { display: block } /* Canvas clipado à metade inferior do hero: o motion aparece onde não há texto, sem cruzar a cópia. */ .hero canvas { clip-path: inset(52% 0 0 0); } } /* MOBILE FIX — hero CTA quebrava em 2 linhas e ficava largo demais. Vira bloco centralizado, sem mudar o visual em desktop. */ @media (max-width: 760px) { .hero .copy > p:has(.cta) { display: flex; justify-content: flex-start; } .hero .cta { display: inline-block; white-space: nowrap; font-size: 11px; padding: 13px 18px; } } /* MOBILE FIX — iOS Safari não dispara click em sem touch-action. Aplica antes do JS promover [role="radio"] para garantir o tap. */ .modos strong { touch-action: manipulation; -webkit-tap-highlight-color: transparent; -webkit-user-select: none; user-select: none; cursor: pointer; }

/* P0-2 — AUTORIDADE ÚNICA do núcleo e dos rótulos do hero. * * Antes: `.core` era escrito em style.css, em copy-rev16.css e aqui ao mesmo * tempo; a disputa era resolvida por `!important` e pela ordem de injeção do * app.js. Com JS desligado vencia o style.css e o núcleo ia parar em * `right:22%`, fora do alinhamento dos fios. Agora este arquivo é carregado * por no , é o único que escreve `.core`, e nenhum `!important` * é preciso porque não sobrou concorrente. * * A GEOMETRIA É A MESMA QUE JÁ RENDERIZAVA (invariantes 3 e 4 da régua DEC-5R): * >=761px centro em left 75% / top 49%, caixa 156px, símbolo 94px * <=760px centro em left 70% / top 72%, caixa 126px, símbolo 76px * É contra ESTES números que o substrato SVG de P0-4 se autora (emenda E5): * os rótulos divergem entre esta folha e o style.css, e quem vale é esta. */ .hero .core { position: absolute; z-index: 2; left: 75%; right: auto; top: 49%; transform: translate(-50%, -50%); width: 156px; height: 156px; border: 1px solid #e57855; border-radius: 50%; background: #100907; box-shadow: 0 0 90px #d3654755, 0 0 0 12px #d3654708; filter: none; display: grid; place-content: center; text-align: center; /* REV20 — `font-size:28px` saiu: o .core contem SO o