/* Decisão Digital - estilo, tons médios. Mobile first. Usa css/tokens.css. Sem dependências. */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scrollbar-gutter: stable; }
body { margin: 0; background: var(--dd-tinta); color: var(--dd-texto); font-family: var(--dd-fonte-corpo); font-size: var(--dd-t-corpo); line-height: var(--dd-lh-corpo); }
img, svg { max-width: 100%; }
h1, h2, h3 { font-family: var(--dd-fonte-titulo); font-weight: 600; line-height: var(--dd-lh-titulo); margin: 0; }
h1 { font-size: var(--dd-t-h1); letter-spacing: var(--dd-ls-h1); }
h2 { font-size: var(--dd-t-h2); }
p { margin: 0 0 var(--dd-e4); max-width: var(--dd-leitura); }
a { color: var(--dd-acento); }
:focus-visible { outline: none; box-shadow: var(--dd-foco); border-radius: 6px; }

.wrap { max-width: var(--dd-largura); margin: 0 auto; padding: 0 var(--dd-margem); }
section { padding: var(--dd-secao-v) 0; }
.so-leitor { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.sprite { position: absolute; }
.marcador { background: var(--dd-marcador); }

/* Botões */
.btn { display: flex; align-items: center; justify-content: center; width: 100%; min-height: var(--dd-alvo); padding: 12px 24px; border: 0; border-radius: var(--dd-r-botao); font: 600 1.125rem/1.2 var(--dd-fonte-corpo); text-decoration: none; cursor: pointer; }
.btn--menta { background: var(--dd-botao-fundo); color: var(--dd-botao-texto); }
a.btn--menta { color: var(--dd-botao-texto); }
.btn--menta:hover { background: var(--dd-botao-fundo-h); }
.btn--menta:active { background: var(--dd-botao-fundo-a); transform: translateY(1px); }
.btn[aria-disabled="true"] { background: var(--dd-sup-desactivada); color: var(--dd-texto-3); cursor: not-allowed; }
.btn-texto { display: block; width: 100%; min-height: 48px; margin-top: var(--dd-e2); background: none; border: 0; font: 500 1.125rem var(--dd-fonte-corpo); color: var(--dd-acento); text-decoration: underline; cursor: pointer; }
@media (min-width: 640px) { .btn { display: inline-flex; width: auto; min-width: 200px; } .funil .btn { display: flex; width: 100%; } }

/* Telefone e marca */
.tel { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; font-size: 1.125rem; text-decoration: underline; color: var(--dd-acento); }
.ico { flex: none; }
.marca { display: flex; align-items: center; gap: 12px; }
.marca img { display: block; }
.marca__nome { font-family: var(--dd-fonte-titulo); font-weight: 600; font-size: 1.125rem; }

/* 1. Topo: tinta, brilho e quadrícula (só CSS) */
.topo { position: relative; overflow: hidden; padding: 20px 0 32px; background: var(--dd-brilho), var(--dd-quadricula), var(--dd-tinta); }
.topo .wrap { position: relative; z-index: 1; }
.topo .marca { margin-bottom: 20px; }
.topo__sub { font-size: var(--dd-t-sub); color: var(--dd-menta); margin: var(--dd-e3) 0; line-height: 1.35; }
.topo__par { color: var(--dd-texto); margin-bottom: var(--dd-e4); }
.topo .tel { margin-top: 4px; }
.topo__acoes { display: block; }
.topo__w1 { position: relative; display: flow-root; }
@media (min-width: 900px) {
  .topo { padding: 28px 0 80px; }
  .topo .marca { margin-bottom: 56px; }
  .topo__grelha { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 48px; align-items: center; }
  .topo__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; }
  .topo__acoes .btn { width: var(--dd-cta-largura); min-width: 0; height: var(--dd-alvo-cta); font-size: 1.25rem; flex: none; }
  .topo__acoes .tel { margin-top: 0; white-space: nowrap; }
  .topo__par { max-width: 62ch; }
}

/* W1: telemóvel com assistente (layout de base). Pose final: 4 bolhas visíveis. */
.w1 { position: relative; width: 260px; margin: var(--dd-e5) auto 0; color: var(--dd-svg-robot); pointer-events: none; }
.w1__tel { display: block; width: 260px; height: 480px; }
.w1__zona { position: absolute; left: 20px; top: 88px; width: 220px; height: 300px; display: flex; flex-direction: column; gap: 12px; overflow: hidden; color: var(--dd-texto); }
.w1__b { margin: 0; max-width: 200px; padding: 10px 14px; border-radius: 14px; font-size: 1rem; line-height: 1.35; }
.w1__b--v { align-self: flex-end; border: 1.5px solid var(--dd-menta); border-bottom-right-radius: 4px; }
.w1__b--a { align-self: flex-start; color: var(--dd-texto-botao); background: var(--dd-sup-opcao); border: 1.5px solid transparent; border-bottom-left-radius: 4px; }
.w1__pt { display: none; align-self: flex-start; gap: 6px; height: 28px; padding: 0 14px; align-items: center; border-radius: 14px; background: var(--dd-sup-opcao); }
.w1__pt i { width: 6px; height: 6px; border-radius: 50%; background: var(--dd-pinho); }
.w1__leg { margin: var(--dd-e2) 0 0; text-align: center; font-size: 1rem; color: var(--dd-texto-2); }
.w1__pausa { position: absolute; left: calc(50% + 94px); top: var(--dd-e5); width: 44px; height: 44px; padding: 0; border: 1.5px solid var(--dd-pinho); border-radius: 12px; background: var(--dd-sup-funil); color: var(--dd-texto-botao); pointer-events: auto; cursor: pointer; }
.w1__pausa[hidden] { display: none; }
.w1__pausa:disabled { display: none; } /* nasce disabled: sem JS (ou antes do load) não aparece */
@media (prefers-reduced-motion: reduce) { .w1__pausa { display: none; } }
.w1__robot, .cod { display: none; }
@media (min-width: 900px) {
  .topo__w1 { min-height: 514px; } /* 480 do telemóvel + 8 + legenda de 25,6: reserva a altura final, o texto ao lado (centrado) não salta */
  .w1 { width: 380px; margin: 0; }
  .w1__tel { margin: 0; }
  .w1__leg { width: 260px; }
  .w1__robot { display: block; position: absolute; right: 0; bottom: 56px; width: 96px; height: 112px; color: var(--dd-svg-robot); }
  .w1__pausa { left: 220px; top: 0; }
  .cod--topo { display: block; position: absolute; right: 24px; top: 96px; z-index: 0; }
}

/* Código espalhado (camada ténue e decorativa; o JS preenche e escreve; sem JS ficam estas linhas) */
.cod { margin: 0; font: 14px/1.5 ui-monospace, Consolas, "Courier New", monospace; color: var(--dd-menta); opacity: .12; white-space: pre; pointer-events: none; user-select: none; overflow: hidden; }
.cod--topo { color: var(--dd-cod-laranja); opacity: .7; width: 40ch; height: 9em; line-height: 1.5; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, var(--dd-tinta) 40%); mask-image: linear-gradient(90deg, transparent, var(--dd-tinta) 40%); }

/* 2. Quem sou */
#quem-sou { position: relative; padding: var(--dd-secao-v-quem) 0; background: var(--dd-fundo-azul); }
#quem-sou::before { content: ""; position: absolute; inset: 0; background: var(--dd-quadricula); -webkit-mask-image: linear-gradient(90deg, var(--dd-tinta), transparent 40%); mask-image: linear-gradient(90deg, var(--dd-tinta), transparent 40%); pointer-events: none; }
#quem-sou .wrap { position: relative; }
.quem { display: block; }
.quem h2 { margin-bottom: var(--dd-e4); }
.avatar { margin: 0 0 var(--dd-e5); }
.avatar img { width: 88px; height: 88px; border-radius: var(--dd-r-avatar); border: 2px solid var(--dd-menta); display: block; }
.avatar figcaption { font-size: var(--dd-t-pequeno); color: var(--dd-texto-2); margin-top: var(--dd-e2); max-width: 28ch; }
.comigo { display: block; width: fit-content; margin-bottom: 16px; color: var(--dd-texto); font: 600 var(--dd-t-display)/1.05 var(--dd-fonte-titulo); letter-spacing: -0.01em; background: var(--dd-marcador); }
@media (min-width: 720px) {
  .quem__p { display: grid; grid-template-columns: 5fr 7fr; gap: 48px; align-items: start; max-width: none; }
  .quem__p .comigo { margin-bottom: 0; }
}
@media (min-width: 768px) {
  .quem--com-avatar { display: grid; grid-template-columns: 160px 1fr; gap: 48px; align-items: start; }
  .avatar img { width: 96px; height: 96px; }
}

/* 3. O que posso fazer: claro menta (.fundo-claro), cartões com cena W2 */
#posso { position: relative; padding: 72px 0; background: var(--dd-claro-menta); color: var(--dd-texto); }
#posso .wrap { position: relative; }
.etiqueta { font-size: var(--dd-t-pequeno); color: var(--dd-texto-2); font-weight: 600; margin-bottom: var(--dd-e2); }
#posso h2 { max-width: 24ch; margin-bottom: var(--dd-e6); }
.esp { display: none; pointer-events: none; color: var(--dd-svg-robot); }
.esp svg { display: block; width: 100%; height: 100%; }
.cartoes { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--dd-e4); }
.cartao { position: relative; display: flex; flex-direction: column; background: var(--dd-sup-posso); border: 1px solid var(--dd-linha-menta); border-radius: var(--dd-r-cartao); padding: var(--dd-e5); box-shadow: var(--dd-sombra-cartao); }
.cartao:hover, .cartao:has(.cartao__link:focus-visible) { border-color: var(--dd-pinho); }
.cartao:has(.cartao__link:focus-visible) { box-shadow: var(--dd-foco); }
.cartao__link:focus-visible { box-shadow: none; }
.w2 { display: block; width: 160px; height: 100px; margin-bottom: var(--dd-e3); color: var(--dd-svg-esboco); pointer-events: none; }
.cartao__num { font-size: var(--dd-t-pequeno); color: var(--dd-texto-2); font-weight: 600; margin-bottom: var(--dd-e2); }
.cartao h3 { font-family: var(--dd-fonte-corpo); font-size: var(--dd-t-h3); line-height: 1.3; margin-bottom: var(--dd-e3); }
.cartao p { flex: none; margin-bottom: 0; }
.cartao__link { display: flex; align-items: center; min-height: 48px; margin-top: 16px; font-weight: 600; color: var(--dd-acento); text-decoration: none; }
.cartao__link::before { content: ""; position: absolute; inset: 0; border-radius: var(--dd-r-cartao); }
.cartao__link::after { content: "\2192"; margin-left: 8px; }
@media (min-width: 600px) { .cartoes { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 600px) and (max-width: 959px) { .cartao:nth-child(5) { grid-column: 1 / -1; } }
@media (min-width: 768px) { #posso { padding: var(--dd-secao-v) 0; } }
@media (min-width: 900px) {
  .esp--i2 { display: block; position: absolute; right: var(--dd-margem); top: 0; width: 280px; height: 158px; }
}
@media (min-width: 960px) {
  .cartoes { grid-template-columns: repeat(6, 1fr); }
  .cartao { grid-column: span 2; }
  .cartao:nth-child(n+4) { grid-column: span 3; }
}

/* 4. Como trabalho: tinta, filete menta, caixas só com contorno */
#metodo { position: relative; padding: 72px 0; background: var(--dd-fundo-verde); }
#metodo .wrap { position: relative; }
#metodo h2 { margin-bottom: var(--dd-e6); }
.passos { list-style: none; counter-reset: p; margin: 0 0 var(--dd-e6); padding: 0; max-width: 640px; }
.passos li { counter-increment: p; position: relative; padding: 0 44px var(--dd-e5) 60px; min-height: 40px; }
.passos li::before { content: counter(p); position: absolute; left: 0; top: 0; width: 40px; height: 40px; border-radius: 50%; background: var(--dd-menta); color: var(--dd-texto-botao); font-weight: 700; display: flex; align-items: center; justify-content: center; }
.passos li::after { content: ""; position: absolute; left: 19px; top: 44px; bottom: 4px; width: 2px; background: rgba(159,227,207,.3); }
.passos li:last-child::after { display: none; }
.passos strong { font-weight: 600; }
.passos .seta, .w3-ico { position: absolute; right: 0; top: calc(50% - 28px); color: var(--dd-svg-icone); }
.passos li:last-child .seta { top: 4px; }
.w3-ico { width: 32px; height: 32px; }
.w3-ico, .rodape__robots svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rodape__robots svg { stroke-width: 3; }
.passos .mini { position: absolute; right: 0; top: 64px; width: 40px; height: 46px; color: var(--dd-svg-robot); pointer-events: none; }
.caixas { display: grid; gap: var(--dd-e4); margin-bottom: var(--dd-e6); max-width: 640px; }
.caixa { background: var(--dd-sup-metodo); border: 1px solid var(--dd-linha); border-radius: var(--dd-r-cartao); padding: var(--dd-e5); box-shadow: var(--dd-sombra-cartao-escuro); }
.caixa h3 { font-size: var(--dd-t-h3); margin-bottom: var(--dd-e2); }
.caixa p { margin: 0; }
.cod-moldura { display: none; }
.passos li:last-child { min-height: 158px; } /* robô do passo 4: 24 px de ar acima e abaixo do ícone de ciclo (< 900 px) */
@media (max-width: 480px) {
  .passos li { padding-right: 0; }
  .passos li:last-child { min-height: 40px; }
  .passos .seta, .w3-ico, .passos .mini { display: none; }
}
@media (min-width: 481px) and (max-width: 899px) {
  /* ícone 4 ao centro do texto; robot mini abaixo, 24 px ou mais de ar */
  .passos li:last-child { min-height: 40px; padding-bottom: 64px; }
  .passos li:last-child .seta { top: calc(50% - 32px - 16px); }
  .passos .mini { top: auto; bottom: 0; }
}
@media (min-width: 768px) { #metodo { padding: var(--dd-secao-v) 0; } }
@media (min-width: 900px) {
  .passos { max-width: none; }
  .passos li { max-width: min(640px, calc(100% - 268px)); }
  .passos .mini { display: none; }
  .passos li:last-child { min-height: 40px; }
  .passos li:last-child .seta { top: calc(50% - 28px); }
  .esp--i3 { display: block; position: absolute; left: calc(100% + var(--dd-e5)); top: 0; width: 236px; height: 133px; }
  .caixas { position: relative; }
  .cod-moldura { display: block; position: absolute; left: calc(100% + var(--dd-e5)); top: 0; margin-top: calc(var(--dd-e5) - var(--dd-e6)); width: min(300px, calc(100vw - 680px - 2 * var(--dd-margem))); z-index: 0; color: var(--dd-menta); pointer-events: none; user-select: none; }
  .cod-moldura svg { display: block; width: 100%; height: auto; opacity: .14; }
  .cod-moldura .cod { display: block; position: absolute; left: 13.9%; top: 15.8%; width: 83%; height: 80%; opacity: var(--dd-cod-moldura-op); font-size: 12px; line-height: 1.5; }
}

/* Faixa I1 (reserva SVG, altura fixa) entre o método e o funil */
.faixa { position: relative; height: var(--dd-faixa-h); margin: 0; overflow: hidden; background: var(--dd-fundo-verde); color: var(--dd-svg-robot); pointer-events: none; }
.faixa svg { display: block; width: 100%; height: 100%; }



/* 5. Funil: claro (cinza-quente), cartão claro com borda quente */
#funil { padding: 72px 0; background: var(--dd-brilho-funil), var(--dd-quadricula-claro), var(--dd-claro-quente); color: var(--dd-texto); }
@media (min-width: 768px) { #funil { padding: var(--dd-secao-v) 0; } }
.funil__sem-js { text-align: center; }
#funil h2 { max-width: 640px; margin: 0 auto var(--dd-e5); }
.funil { scroll-margin-top: 16px; max-width: 640px; margin: 0 auto; background: var(--dd-sup-funil); border-radius: var(--dd-r-cartao); box-shadow: var(--dd-sombra-funil); padding: var(--dd-e5); transition: height 220ms ease-out; }
.funil[hidden], .passo[hidden], .erro[hidden], .campo[hidden], .funil__topo[hidden] { display: none; }
.funil__cab { display: flex; align-items: center; gap: 12px; margin-bottom: var(--dd-e2); color: var(--dd-svg-icone); }
.funil__d { flex: none; display: block; }
.funil__passo { font-size: var(--dd-t-pequeno); color: var(--dd-texto-2); margin: 0; }
.barra { height: 6px; background: var(--dd-sup-desactivada); border-radius: var(--dd-r-barra); margin-bottom: var(--dd-e5); overflow: hidden; }
.barra span { display: block; height: 100%; width: 33.3333%; background: var(--dd-acento); }
.pergunta { font-size: 1.5rem; line-height: 1.25; margin-bottom: var(--dd-e3); color: var(--dd-texto); }
.pergunta:focus { outline: none; }
.dica { font-size: var(--dd-t-pequeno); color: var(--dd-texto-2); margin: 0 0 var(--dd-e3); }
.opcoes { display: grid; gap: var(--dd-e3); margin-bottom: var(--dd-e5); }
.opcao { position: relative; display: flex; align-items: center; gap: 14px; min-height: var(--dd-alvo); padding: 12px 16px; border: 1.5px solid var(--dd-borda-campo); border-radius: var(--dd-r-opcao); cursor: pointer; background: var(--dd-sup-opcao); color: var(--dd-texto); -webkit-tap-highlight-color: transparent; }
@media (hover: hover) { .opcao:hover { border-color: var(--dd-acento); } }
.opcao input { position: absolute; opacity: 0; width: 24px; height: 24px; left: 16px; margin: 0; }
.marca-op { flex: none; width: 24px; height: 24px; border: 2px solid var(--dd-borda-campo); border-radius: 6px; background: transparent; position: relative; }
.opcao__txt { line-height: 1.35; }
.opcao:has(input:checked) { background: var(--dd-sup-escolhida); border: 2px solid var(--dd-acento); padding: 11.5px 15.5px; font-weight: 600; }
.opcao input:checked + .marca-op { background: var(--dd-acento); border-color: var(--dd-acento); }
.opcao input:checked + .marca-op::after { content: ""; position: absolute; left: 6px; top: 2px; width: 6px; height: 12px; border: solid var(--dd-botao-texto); border-width: 0 3px 3px 0; transform: rotate(45deg); }
.opcao:has(input:focus-visible) { box-shadow: var(--dd-foco); }
.opcao--consent { align-items: flex-start; font-weight: 400; }
.opcao--consent:has(input:checked) { font-weight: 400; }
.opcao--consent .marca-op { margin-top: 2px; }
.opcao--consent input { top: 18px; }

.campo { margin-bottom: var(--dd-e4); }
.campo input, .campo textarea, .opcao { scroll-margin-bottom: 96px; }
.funil .btn, .funil .btn-texto { scroll-margin-bottom: 96px; }
.campo label { display: block; margin-bottom: var(--dd-e2); font-weight: 500; color: var(--dd-texto); }
.campo input, .campo textarea { width: 100%; min-height: var(--dd-alvo); padding: 12px 16px; border: 1.5px solid var(--dd-borda-campo); border-radius: var(--dd-r-campo); font: inherit; color: var(--dd-texto); background: var(--dd-sup-opcao); }
.campo input::placeholder, .campo textarea::placeholder { color: var(--dd-texto-2); }
.campo textarea { min-height: 96px; resize: vertical; }
.campo input:focus-visible, .campo textarea:focus-visible { border-color: var(--dd-acento); box-shadow: var(--dd-foco); border-radius: var(--dd-r-campo); }
.campo input[aria-invalid="true"], .campo textarea[aria-invalid="true"] { border-color: var(--dd-erro); border-width: 2px; }
.erro { color: var(--dd-erro); font-size: var(--dd-t-pequeno); margin: var(--dd-e2) 0 var(--dd-e3); }
.erro::before { content: "! "; font-weight: 700; }
.erro--envio { margin-top: var(--dd-e3); }
.erro a { color: var(--dd-erro); font-weight: 600; }
.isco { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.devolucao { font-family: var(--dd-fonte-titulo); font-size: 1.25rem; line-height: 1.4; margin-bottom: var(--dd-e3); color: var(--dd-texto); }
.devolucao:focus { outline: none; }
.convite { font-weight: 600; margin-bottom: var(--dd-e3); }
.dados { font-size: var(--dd-t-pequeno); color: var(--dd-texto-2); margin: var(--dd-e3) 0 var(--dd-e4); }
.sem-comp, .ingenua { text-align: center; font-size: var(--dd-t-pequeno); color: var(--dd-texto-2); margin: var(--dd-e3) auto 0; }
.ingenua { margin-top: var(--dd-e2); }
.aviso-email { margin: var(--dd-e3) 0 0; font-weight: 600; }
.passo--fim { text-align: center; padding: var(--dd-e5) 0; }
.passo--fim .visto { position: relative; width: 96px; height: 96px; margin: 0 auto var(--dd-e4); color: var(--dd-svg-visto); }
.fim-d { display: block; width: 96px; height: 96px; }
.fim-d .pt { display: none; }
.fim-visto { position: absolute; left: 22px; top: 22px; width: 52px; height: 52px; stroke-width: 3.5; }
.confirma { font-family: var(--dd-fonte-titulo); font-size: 1.5rem; line-height: 1.3; margin: 0 auto var(--dd-e4); }
.confirma:focus { outline: none; }
.fim-tel { margin: 0 auto; }
.fim-tel a { display: inline-block; min-height: 48px; line-height: 48px; font-weight: 600; }
@media (min-width: 768px) { .funil { padding: var(--dd-e6); } }

/* 6. Rodapé */
.rodape { position: relative; overflow: hidden; padding: 48px 0; background: var(--dd-fundo-fundo); }
.rodape .wrap { position: relative; z-index: 1; }
.rodape .marca { margin-bottom: var(--dd-e4); }
.rodape__tel { margin-bottom: var(--dd-e2); }
.rodape__i5 { position: absolute; left: 0; right: 0; top: 0; height: 480px; opacity: .5; color: var(--dd-svg-robot); pointer-events: none; }
.rodape__i5 svg { display: block; width: 100%; height: 100%; }
.rodape__d { position: absolute; right: -40px; bottom: -56px; width: 200px; height: 200px; color: var(--dd-menta); fill: none; stroke: var(--dd-menta); stroke-width: .6; stroke-linecap: round; stroke-linejoin: round; opacity: .15; pointer-events: none; }
.rodape__robots { display: flex; gap: 16px; margin: var(--dd-e4) 0; color: var(--dd-svg-robot); }
.rodape__robots svg { width: 56px; height: 65px; }
.cod--rodape { display: none; }
@media (min-width: 768px) {
  .rodape__d { width: 320px; height: 320px; }
  .cod--rodape { display: block; position: absolute; right: 24px; top: 24px; width: 40ch; height: 9em; z-index: 0; opacity: var(--dd-cod-rodape-op); }
}

/* Aviso de privacidade: painel escuro, 16 px */
.aviso-priv { margin-top: var(--dd-e6); padding: var(--dd-aviso-pad); background: var(--dd-aviso-fundo); border: 1px solid var(--dd-linha); color: var(--dd-aviso-cor); border-radius: var(--dd-r-cartao); font-size: var(--dd-aviso-t); line-height: var(--dd-aviso-lh); max-width: var(--dd-aviso-largura); }
.aviso-priv:target { scroll-margin-top: 3rem; }
.aviso-priv summary { display: flex; align-items: center; min-height: 48px; margin: calc(-1 * var(--dd-e2)) 0; font-weight: 600; color: var(--dd-aviso-titulo); cursor: pointer; }
.aviso-priv[open] summary { margin-bottom: var(--dd-e2); }
.aviso-priv summary:focus-visible { border-radius: 6px; }
.aviso-priv h2 { font-size: 1.25rem; font-weight: 600; color: var(--dd-aviso-titulo); margin-bottom: var(--dd-e2); }
.aviso-priv h3 { font-size: 1rem; font-weight: 600; color: var(--dd-aviso-titulo); margin: var(--dd-aviso-gap-h3) 0 4px; }
.aviso-priv p { margin-bottom: var(--dd-aviso-gap-p); }
.aviso-priv ul { padding-left: 20px; margin: 0 0 var(--dd-aviso-gap-p); }
.aviso-priv li { margin-bottom: 4px; }
.aviso-priv a { color: var(--dd-menta); text-decoration: underline; }
.aviso-priv .rascunho { color: var(--dd-rascunho); }

/* Faixa do modo de teste (só com modo "teste" em js/config.js) */
html:has(.faixa-teste) { scroll-padding-bottom: var(--dd-faixa-teste-h, 5rem); }
body:has(.faixa-teste) { padding-bottom: var(--dd-faixa-teste-h, 5rem); }
.faixa-teste { position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; margin: 0; max-width: none; background: var(--dd-erro); color: var(--dd-texto-botao); font-weight: 700; text-align: center; padding: var(--dd-e2) var(--dd-e3); border-top: 3px solid var(--dd-texto-botao); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* Imagens IA (I1 a I5): o SVG de reserva fica até a imagem existir (js/ia.js põe .ia-ok no contentor). Altura e proporção do contentor já fixas. */
.ia { position: absolute; inset: 0; display: block; }
.ia img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ia-ok > svg { display: none; }
.faixa:not(.ia-ok) .ia, .esp:not(.ia-ok) .ia, .rodape__i5:not(.ia-ok) .ia { display: none; }

/* Origem das transformacoes dos SVG animados (ids para vencer as regras de widgets.css) */
#w1-faisca, #mt-constroi-olho-e, #mt-constroi-olho-d, #mt-constroi-extra, #w2-ia-faisca { transform-box: fill-box; transform-origin: 50% 50%; }
#mt-constroi-antena, #mt-constroi-cabeca, #mt-constroi-ferramenta { transform-box: fill-box; transform-origin: 50% 100%; }
#mt-constroi-braco { transform-box: fill-box; transform-origin: 0% 100%; }
#w2-msg-resposta { transform-box: fill-box; transform-origin: 100% 50%; }