@font-face { font-family: "Fraunces"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fontes/fraunces-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Atkinson Hyperlegible"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fontes/atkinson-hyperlegible-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Atkinson Hyperlegible"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fontes/atkinson-hyperlegible-latin-700-normal.woff2") format("woff2"); }
:root {
  color-scheme: light dark;
  --pagina: #f5f1e6;
  --fundo: #f5f1e6;
  --superficie: #ffffff;
  --texto: #181b33;
  --suave: #4a5070;
  --borda: #4a5070;
  --foco: #0b57d0;
  --destaque: #8a5200;
  --botao-fundo: #ffd36b;
  --botao-sombra: #8a5200;
  --botao-texto: #12163a;
  --cena-ceu-a: #0a0e24;
  --cena-ceu-b: #1a2040;
  --cena-longe: #2b3466;
  --cena-meio: #1f2750;
  --cena-frente: #121734;
  --cena-janela-apagada: #2c3558;
  --cena-janela-fora: #f2c14e;
  --cena-janela-cone: #ffb938;
  --cena-janela-longe: #4a5488;
  --cena-poste: #e4ddcb;
  --cena-poste-luz: #fff3cf;
  --cena-poste-sombra: #8f8878;
  --cena-poste-claro: #f3e7c2;
  --cena-poste-borda: #ffe9a8;
  --cena-cupula-alta: #f1ebda;
  --cena-cupula-baixa: #c9c1ae;
  --cena-junta: #a9a28f;
  --cena-parafuso: #6f6a5c;
  --cena-cone-alto: #fff1bc;
  --cena-cone-baixo: #f5a623;
  --cena-calcada: #2a3260;
  --cena-meio-fio: #4a5488;
  --cena-rua: #10142e;
  --cena-linha: #8e97c0;
  --cena-chao-sombra: #02030a;
  --cena-estrela: #f3efe4;
  --cena-nome: #fff3cf;
  --cena-frase: #d8dbec;
  --cena-branco: #ffffff;
  --cena-lampada-logo: #fff3c4;
  --conflito-noite: #ff7a6b;
  --fonte: "Atkinson Hyperlegible", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fonte-titulos: "Fraunces", Georgia, "Times New Roman", serif;
  --alvo-min: 48px;
  --margem: 16px;
  --largura: 1120px;
  --corte: clamp(26px, 5.5vw, 74px);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --pagina: #0e1228;
    --fundo: #0e1228;
    --superficie: #1a2040;
    --texto: #f3efe4;
    --suave: #b9bfda;
    --borda: #8e97c0;
    --foco: #8dbbff;
    --destaque: #ffd770;
  }
}
:root[data-tema="escuro"] {
  --pagina: #0e1228;
  --fundo: #0e1228;
  --superficie: #1a2040;
  --texto: #f3efe4;
  --suave: #b9bfda;
  --borda: #8e97c0;
  --foco: #8dbbff;
  --destaque: #ffd770;
}
.noite {
  --fundo: #0a0e24;
  --superficie: #1a2040;
  --texto: #fff3cf;
  --suave: #d8dbec;
  --borda: #8e97c0;
  --foco: #8dbbff;
  --destaque: #ffd770;
  color: var(--texto);
  background: var(--fundo);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 64px; }
body {
  margin: 0;
  background: var(--cena-ceu-a);
  color: var(--texto);
  font-family: var(--fonte);
  font-size: 1.0625rem;
  line-height: 1.45;
  overflow-x: hidden;
}
main { overflow-x: clip; }
h1, h2, h3, p { margin: 0; }
h2, h3, .titulo { font-family: var(--fonte-titulos); font-weight: 700; line-height: 1.05; text-wrap: balance; }
svg { display: block; }
a { color: inherit; }
:focus { outline: none; }
:focus-visible { outline: 3px solid var(--foco); outline-offset: 3px; border-radius: 6px; }
.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; }
.pula { position: absolute; left: 8px; top: 0; transform: translateY(calc(-100% - 12px)); z-index: 50; padding: 12px 18px; background: #ffd36b; color: #12163a; font-weight: 700; border-radius: 10px; }
.pula:focus { transform: translateY(8px); }
.miolo { width: 100%; max-width: var(--largura); margin-inline: auto; padding-inline: var(--margem); }
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: var(--alvo-min); min-width: var(--alvo-min);
  padding: 0 22px;
  font: 700 1.0625rem/1 var(--fonte);
  color: var(--botao-texto);
  background: var(--botao-fundo);
  border: 0; border-radius: 16px;
  box-shadow: 0 4px 0 var(--botao-sombra), 0 10px 24px -8px rgb(245 166 35 / 0.55);
  cursor: pointer; text-decoration: none;
  transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.2s;
  -webkit-tap-highlight-color: transparent;
}
.botao:hover { filter: brightness(1.06); transform: translateY(-2px); box-shadow: 0 6px 0 var(--botao-sombra), 0 14px 28px -8px rgb(245 166 35 / 0.6); }
.botao:active { transform: translateY(3px); box-shadow: 0 1px 0 var(--botao-sombra); }
.botao--leve {
  color: var(--texto); background: transparent;
  box-shadow: inset 0 0 0 2px var(--borda);
}
.botao--leve:hover { box-shadow: inset 0 0 0 2px var(--destaque); transform: none; filter: none; }
.botao--leve:active { transform: translateY(2px); box-shadow: inset 0 0 0 2px var(--destaque); }
.botao--leve[aria-pressed="true"] { color: #12163a; background: #ffd770; box-shadow: 0 3px 0 #8a5200; }
.botao--pequeno { padding: 0 14px; font-size: 0.9375rem; border-radius: 14px; }
.ico { width: 22px; height: 22px; flex: none; }
.ico-som .onda { opacity: 0; transition: opacity 0.2s; }
html[data-som="1"] .ico-som .onda { opacity: 1; }
.cena-inicio { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.cena-inicio .c-longe { fill: var(--cena-longe); }
.cena-inicio .c-longe-traco { stroke: var(--cena-longe); }
.cena-inicio .c-janela-longe { fill: var(--cena-janela-longe); }
.cena-inicio .c-meio { fill: var(--cena-meio); }
.cena-inicio .c-meio-traco { stroke: var(--cena-meio); }
.cena-inicio .c-frente { fill: var(--cena-frente); }
.cena-inicio .c-frente-traco { stroke: var(--cena-frente); }
.cena-inicio .jan { transition: fill 0.5s ease, filter 0.5s ease; }
.cena-inicio .jan--apagada { fill: var(--cena-janela-apagada); }
.cena-inicio .jan--fora { fill: var(--cena-janela-fora); }
.cena-inicio .jan--cone { fill: var(--cena-janela-cone); filter: drop-shadow(0 0 3px color-mix(in srgb, var(--cena-janela-cone) 70%, transparent)); }
.cena-inicio .jan--viva { fill: var(--cena-janela-fora); filter: drop-shadow(0 0 3px color-mix(in srgb, var(--cena-janela-fora) 60%, transparent)); }
.cena-inicio .c-calcada { fill: var(--cena-calcada); }
.cena-inicio .c-junta-calcada { fill: var(--cena-ceu-a); }
.cena-inicio .c-linha { fill: var(--cena-linha); }
.cena-inicio .c-meio-fio { fill: var(--cena-meio-fio); }
.cena-inicio .c-meio-fio-brilho { fill: var(--cena-frase); }
.cena-inicio .c-rua { fill: var(--cena-rua); }
.cena-inicio .c-estrela { fill: var(--cena-estrela); }
.cena-inicio .poste-t { transform-origin: 113.2px 364px; }
.cena-inicio .c-poste-luz { fill: var(--cena-poste-luz); }
.cena-inicio .c-sombra { fill: var(--cena-chao-sombra); }
.cena-inicio .c-cupula-baixa { fill: var(--cena-cupula-baixa); }
.cena-inicio .c-luz { fill: var(--cena-poste-luz); }
.cena-inicio .c-braco-sombra { stroke: var(--cena-poste-sombra); }
.cena-inicio .c-braco { stroke: var(--cena-poste); }
.cena-inicio .c-luz-braco { stroke: var(--cena-poste-luz); }
.cena-inicio .c-junta { fill: var(--cena-junta); }
.cena-inicio .c-parafuso { fill: var(--cena-parafuso); }
.cena-inicio .c-brilho-cupula { stroke: var(--cena-poste-luz); }
.cena-inicio .c-lampada-apagada { fill: var(--cena-parafuso); }
.cena-inicio .c-lampada { fill: var(--cena-poste-luz); }
.cena-inicio .luz, .cena-inicio .poca, .cena-inicio .lampada { transition: opacity 0.35s ease; }
.cena-inicio .luz .cone, .cena-inicio .luz .brilho { transform-box: fill-box; transform-origin: 50% 0; }
.cena-inicio .luz .brilho { transform-origin: 50% 50%; }
.st-cena-branco { stop-color: var(--cena-branco); }
.st-cena-ceu-a { stop-color: var(--cena-ceu-a); }
.st-cena-ceu-b { stop-color: var(--cena-ceu-b); }
.st-cena-cone-alto { stop-color: var(--cena-cone-alto); }
.st-cena-cone-baixo { stop-color: var(--cena-cone-baixo); }
.st-cena-cupula-alta { stop-color: var(--cena-cupula-alta); }
.st-cena-cupula-baixa { stop-color: var(--cena-cupula-baixa); }
.st-cena-poste { stop-color: var(--cena-poste); }
.st-cena-poste-borda { stop-color: var(--cena-poste-borda); }
.st-cena-poste-claro { stop-color: var(--cena-poste-claro); }
.st-cena-poste-sombra { stop-color: var(--cena-poste-sombra); }
.st-cor-luz-quente { stop-color: var(--cor-luz-quente); }
.st-cor-rua-acesa { stop-color: var(--cor-rua-acesa); }
.titulo-sec, .final__titulo { overflow-wrap: anywhere; }
.rodape a { max-width: 100%; overflow-wrap: anywhere; }
.cartao { min-width: 0; grid-template-columns: minmax(0, 1fr); }
.cartao__frase { min-width: 0; overflow-wrap: anywhere; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
}
@media (forced-colors: active) {
  .botao, .cartao { border: 2px solid ButtonText; }
}
.so-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.simbolo { --cor-luz-quente: #ffd770; --cor-rua-acesa: #f2c14e; }
.simbolo .simbolo__corpo { fill: #e4ddcb; }
.simbolo .simbolo__braco { fill: none; stroke: #e4ddcb; }
.simbolo .simbolo__lampada { fill: #fff3c4; }
html { scroll-behavior: smooth; }
img, video { max-width: 100%; }
.titulo-sec { font-size: clamp(2.4rem, 9vw, 4.6rem); line-height: 0.98; -webkit-text-stroke: 0.6px currentColor; margin-bottom: clamp(22px, 4vw, 44px); overflow-wrap: anywhere; }
.titulo-sec em { font-style: normal; color: var(--destaque); }
.abertura { display: none; }
.abertura__palco { position: relative; display: grid; justify-items: center; gap: 10px; }
.abertura__poste { width: clamp(120px, 30vw, 180px); }
.abertura__poste .simbolo { width: 100%; height: auto; overflow: visible; }
.abertura__nome { width: clamp(230px, 64vw, 400px); height: auto; overflow: visible; }
.abertura__brilho { position: absolute; left: 50%; top: 0; width: min(92vw, 560px); aspect-ratio: 1; transform: translate(-50%, -22%); background: radial-gradient(circle, rgb(255 211 107 / 0.42), rgb(245 166 35 / 0.12) 45%, transparent 68%); pointer-events: none; }
.nome { width: clamp(220px, 70vw, 420px); height: auto; overflow: visible; }
.nome__luz { fill: var(--cena-poste-luz); filter: blur(9px); opacity: 0.55; }
.nome__letras { fill: var(--cena-nome); }
.topo { position: sticky; top: 0; z-index: 20; background: rgb(10 14 36 / 0.88); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid rgb(142 151 192 / 0.28); }
.topo__linha { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 60px; padding-block: 6px; }
.topo__nav { display: none; }
.topo__acoes { display: flex; align-items: center; gap: 8px; margin-left: auto; }
@media (min-width: 900px) {
  .topo__nav { display: flex; gap: 4px; margin-left: 28px; margin-right: auto; }
  .topo__nav a { display: inline-flex; align-items: center; min-height: var(--alvo-min); padding: 0 14px; border-radius: 12px; color: var(--cena-frase); font-weight: 700; text-decoration: none; }
  .topo__nav a:hover { color: #12163a; background: #ffd770; }
}
.marca { display: inline-flex; align-items: center; gap: 8px; min-height: var(--alvo-min); text-decoration: none; font: 700 1.5rem/1 var(--fonte-titulos); color: var(--cena-nome); }
.marca .pip { width: 12px; height: 12px; border-radius: 50%; background: #ffd770; box-shadow: 0 0 14px 4px rgb(255 211 107 / 0.7); }
.botao--icone { padding: 0; width: var(--alvo-min); }
.hud { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 12px; border-radius: 16px; color: #fff3cf; box-shadow: inset 0 0 0 2px var(--borda); font-weight: 700; font-variant-numeric: tabular-nums; }
.hud__lamp { display: block; width: 16px; height: 22px; color: #ffd770; }
.hud__lamp .simbolo { width: 100%; height: 100%; }
.hud__lamp .simbolo__cone { display: none; }
.hud__lamp .simbolo .simbolo__corpo, .hud__lamp .simbolo .simbolo__lampada { fill: currentColor; }
.hud__lamp .simbolo .simbolo__braco { fill: none; stroke: currentColor; }
.hud__n { font-size: 1rem; }
.hud.cheio { background: #ffd770; color: #12163a; box-shadow: 0 3px 0 #8a5200; }
.hud.cheio .hud__lamp { color: #12163a; }
.selo-loja { display: inline-flex; align-items: center; gap: 14px; min-height: 64px; padding: 10px 24px 10px 18px; border-radius: 18px; text-decoration: none; color: #12163a; background: #ffd36b; box-shadow: 0 5px 0 #8a5200, 0 14px 30px -10px rgb(245 166 35 / 0.7); transition: transform 0.12s ease, box-shadow 0.12s ease; -webkit-tap-highlight-color: transparent; }
.selo-loja:hover { transform: translateY(-2px); box-shadow: 0 7px 0 #8a5200, 0 18px 34px -10px rgb(245 166 35 / 0.8); }
.selo-loja:active { transform: translateY(3px); box-shadow: 0 1px 0 #8a5200; }
.selo-loja__ico { width: 34px; height: 34px; flex: none; padding: 6px; border-radius: 10px; color: #ffd36b; background: #12163a; }
.selo-loja__texto { display: grid; gap: 2px; text-align: left; }
.selo-loja__texto b { font: 700 1.1875rem/1.15 var(--fonte); }
.selo-loja__texto small { font-size: 0.875rem; line-height: 1.25; color: #3a2a00; }
.selo-loja--grande { padding: 14px 30px 14px 22px; min-height: 76px; }
.selo-loja--grande .selo-loja__texto b { font-size: 1.375rem; }
.fone { position: relative; margin: 0; display: grid; justify-items: center; gap: 12px; }
.fone__moldura { width: 100%; padding: 8px; border-radius: 38px; background: linear-gradient(160deg, #323857, #11142a); box-shadow: 0 34px 60px -30px #000, 0 0 0 1px rgb(255 255 255 / 0.1), inset 0 0 0 1px rgb(255 255 255 / 0.06); }
.fone__tela { position: relative; aspect-ratio: 393 / 851; border-radius: 30px; overflow: hidden; background: #0a0e24; isolation: isolate; }
.fone__tela img, .fone__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.fone--video .fone__tela { aspect-ratio: 9 / 16; }
.fone--video .fone__video { object-fit: contain; background: #0a0e24; }
.fone__video:focus-visible { outline: 3px solid var(--foco); outline-offset: -3px; border-radius: 0; }
.fone__nota { margin: 0; max-width: 32ch; color: var(--cena-frase); font-size: 0.9375rem; text-align: center; }
[hidden] { display: none !important; }
.pausa { position: absolute; z-index: 4; right: -22px; top: -26px; display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; cursor: pointer; color: #ffd770; background: #12163a; box-shadow: inset 0 0 0 2px #ffd770, 0 8px 16px -6px #000; -webkit-tap-highlight-color: transparent; }
.pausa:hover { color: #12163a; background: #ffd770; }
.pausa:focus-visible { outline: 3px solid #fff; outline-offset: 3px; box-shadow: inset 0 0 0 2px #ffd770, 0 0 0 7px #12163a; }
.pausa__ico { display: block; width: 14px; height: 18px; background: linear-gradient(90deg, currentColor 0 36%, transparent 36% 64%, currentColor 64% 100%); }
.pausa--parado .pausa__ico { width: 16px; background: currentColor; clip-path: polygon(10% 0, 100% 50%, 10% 100%); }
.alvo { position: absolute; z-index: 3; left: calc(var(--ax, 0.5) * 100%); top: calc(var(--ay, 0.5) * 100%); width: calc(var(--ad, 0.3) * 100%); aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; border: 3px solid #ffd770; box-shadow: 0 0 0 2px rgb(10 14 36 / 0.7), 0 0 18px 2px rgb(255 211 107 / 0.55); pointer-events: none; }
.pula-video:not(:focus) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pula-video:focus { display: inline-flex; align-items: center; min-height: var(--alvo-min); padding: 0 16px; border-radius: 14px; background: #ffd36b; color: #12163a; font-weight: 700; text-decoration: none; outline: 3px solid var(--foco); outline-offset: 2px; }
.heroi { position: relative; padding-block: 28px calc(var(--corte) + 110px); overflow: hidden; background: radial-gradient(110% 70% at 75% 25%, #1a2040 0%, #0a0e24 72%); }
.heroi__ceu { position: absolute; inset: 0; pointer-events: none; }
.heroi__ceu i { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: var(--cena-estrela); opacity: 0.7; }
.heroi__ceu i:nth-child(1) { left: 6%; top: 12%; }
.heroi__ceu i:nth-child(2) { left: 14%; top: 34%; width: 2px; height: 2px; }
.heroi__ceu i:nth-child(3) { left: 23%; top: 8%; }
.heroi__ceu i:nth-child(4) { left: 31%; top: 22%; width: 2px; height: 2px; }
.heroi__ceu i:nth-child(5) { left: 44%; top: 6%; }
.heroi__ceu i:nth-child(6) { left: 52%; top: 30%; width: 2px; height: 2px; }
.heroi__ceu i:nth-child(7) { left: 61%; top: 10%; }
.heroi__ceu i:nth-child(8) { left: 72%; top: 4%; width: 2px; height: 2px; }
.heroi__ceu i:nth-child(9) { left: 83%; top: 16%; }
.heroi__ceu i:nth-child(10) { left: 91%; top: 7%; width: 2px; height: 2px; }
.heroi__ceu i:nth-child(11) { left: 96%; top: 26%; }
.heroi__ceu i:nth-child(12) { left: 38%; top: 44%; width: 2px; height: 2px; }
.heroi__cone { position: absolute; inset: 0; background: conic-gradient(from 186deg at 50% -8%, transparent 0deg, rgb(255 241 188 / 0.24) 9deg, rgb(245 166 35 / 0.1) 17deg, transparent 27deg), radial-gradient(ellipse 36% 55% at 50% 0%, rgb(255 211 107 / 0.2), transparent 70%); -webkit-mask-image: linear-gradient(#000 45%, transparent 95%); mask-image: linear-gradient(#000 45%, transparent 95%); pointer-events: none; }
.heroi__cidade { position: absolute; left: 0; right: 0; bottom: 0; height: clamp(120px, 17vw, 210px); pointer-events: none; -webkit-mask-image: linear-gradient(transparent 0, #000 38%); mask-image: linear-gradient(transparent 0, #000 38%); }
.cidade { display: block; width: 100%; height: 100%; }
.cidade .pd { fill: #141a3a; }
.cidade .pd2 { fill: #1b2350; }
.cidade .j { fill: #ffd770; opacity: 0.8; }
.cidade .j2 { fill: #fff3c4; opacity: 0.95; }
.heroi__grade { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 64px; justify-items: center; }
.heroi__texto { display: grid; gap: 18px; justify-items: start; width: 100%; }
.chamada { margin: 0; font: 700 clamp(2.1rem, 9.6vw, 3.6rem)/0.98 var(--fonte-titulos); letter-spacing: -0.01em; color: var(--cena-nome); -webkit-text-stroke: 0.7px var(--cena-nome); text-shadow: 0 4px 0 rgb(245 166 35 / 0.25); }
.chamada em { font-style: normal; color: #ffd770; -webkit-text-stroke-color: #ffd770; text-shadow: 0 0 28px rgb(255 211 107 / 0.55); }
.heroi__sub { margin: 0; max-width: 34ch; font-size: 1.1875rem; color: var(--cena-frase); }
.heroi__acoes { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.heroi__ficha { margin: 0; font-weight: 700; color: var(--cena-nome); }
.fone--heroi { --incl: translateY(0); width: min(72vw, 290px); margin-top: 6px; }
.fone--heroi .fone__moldura { transform: var(--incl); box-shadow: 0 34px 60px -30px #000, 0 0 90px -10px rgb(245 166 35 / 0.38), 0 0 0 1px rgb(255 255 255 / 0.1); }
.heroi__poste { position: absolute; z-index: 3; left: 50%; top: -66px; width: 58px; transform: translateX(-50%); pointer-events: none; }
.heroi__poste .simbolo { display: block; width: 100%; height: auto; overflow: visible; }
@media (min-width: 900px) {
  .heroi { padding-block: 84px calc(var(--corte) + 140px); }
  .heroi__grade { grid-template-columns: minmax(0, 1fr) auto; gap: 72px; align-items: center; }
  .heroi__texto { gap: 22px; }
  .chamada { font-size: clamp(3.4rem, 5.2vw, 5rem); }
  .fone--heroi { --incl: perspective(1400px) rotateY(-6deg) rotateX(2deg); width: 316px; }
  .heroi__cone { background: conic-gradient(from 186deg at 76% -8%, transparent 0deg, rgb(255 241 188 / 0.24) 9deg, rgb(245 166 35 / 0.1) 17deg, transparent 27deg), radial-gradient(ellipse 36% 55% at 76% 0%, rgb(255 211 107 / 0.2), transparent 70%); }
}
.como, .tem, .telas { background: var(--pagina); color: var(--texto); padding-block: calc(var(--corte) + 18px) calc(var(--corte) + 24px); }
.como { position: relative; }
.passos { display: grid; gap: 40px; margin: 0; padding: 0; list-style: none; }
.passo { display: grid; justify-items: center; text-align: center; gap: 6px; }
.passo__n { margin: 0; font: 700 3rem/1 var(--fonte-titulos); color: var(--destaque); }
.passo__titulo { font-size: clamp(1.5rem, 6vw, 2rem); text-wrap: balance; }
.passos__dica { display: none; margin: -14px 0 10px; color: var(--suave); font-size: 0.9375rem; }
.passos:focus-visible { outline: 3px solid var(--foco); outline-offset: -3px; }
.passo__texto { margin: 0 0 18px; max-width: 30ch; color: var(--suave); font-size: 1.0625rem; }
.fone--passo { width: min(60vw, 236px); }
@media (max-width: 859px) {
  .passos { display: flex; gap: 14px; overflow-x: auto; padding: 36px var(--margem) 20px; margin-inline: calc(var(--margem) * -1); scroll-snap-type: x mandatory; scroll-padding-inline: var(--margem); overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
  .passo { flex: 0 0 82%; scroll-snap-align: start; }
  .passos__dica { display: block; }
}
@media (min-width: 860px) {
  .passos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(36px, 5vw, 72px); align-items: start; }
  .fone--passo { width: min(100%, 290px); }
  .fone--passo .pausa { right: -10px; }
  .passo__titulo { min-height: 2.05em; display: grid; align-items: end; }
  .passo__texto { min-height: 3.2em; }
}
.bento { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.bento__item { display: grid; align-content: start; gap: 12px; padding: 14px; border-radius: 26px; background: var(--superficie); color: var(--texto); box-shadow: 0 6px 0 rgb(10 14 36 / 0.22), inset 0 0 0 1px rgb(142 151 192 / 0.35); transition: transform 0.15s ease; }
.bento__item h3 { font-size: clamp(1.15rem, 4.6vw, 1.5rem); }
.bento__item p { margin: 0; color: var(--suave); font-size: 1rem; }
.bento__texto { display: grid; gap: 6px; align-content: start; }
.bento__midia { position: relative; aspect-ratio: 393 / 851; border-radius: 20px; overflow: hidden; background: #0a0e24; box-shadow: 0 0 0 3px #1c2248; }
.bento__midia img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fone--bento { width: 100%; }
.fone--bento .fone__moldura { padding: 3px; border-radius: 22px; box-shadow: 0 0 0 3px #1c2248; background: #1c2248; }
.fone--bento .fone__tela { border-radius: 19px; }
.fone--bento .pausa { right: -10px; top: -14px; }
.bento__item--festa .fone__tela { aspect-ratio: 393 / 610; }
.bento__item--festa .fone__video { object-position: 50% 0; }
.bento__item--faixa, .bento__item--premium { grid-column: 1 / -1; align-content: center; padding: 22px; }
.bento__item--faixa { background: #ffd36b; color: #12163a; box-shadow: 0 6px 0 #8a5200; }
.bento__item--faixa p { color: #3a2a00; }
.bento__item--premium h3 { font-size: clamp(1.3rem, 5vw, 1.8rem); }
@media (hover: hover) { .bento__item:hover { transform: translateY(-4px) rotate(-0.4deg); } }
@media (min-width: 900px) {
  .bento { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 22px; }
  .bento__item { padding: 22px; }
  .bento__item--dia, .bento__item--3d, .bento__item--jornada, .bento__item--festa { grid-column: span 2; justify-items: center; text-align: center; }
  .bento__item--dia .bento__midia, .bento__item--3d .bento__midia, .bento__item--jornada .bento__midia { width: min(100%, 270px); }
  .bento__item--festa { grid-row: span 2; align-content: center; }
  .bento__item--festa .fone--bento { width: min(100%, 270px); }
  .bento__item--faixa, .bento__item--premium { grid-column: span 4; padding: 34px 38px; }
  .bento__item--faixa h3, .bento__item--premium h3 { font-size: clamp(1.7rem, 2.8vw, 2.4rem); }
  .bento__item--faixa p, .bento__item--premium p { font-size: 1.1875rem; max-width: 52ch; }
}
.jogue { position: relative; padding-block: calc(var(--corte) + 18px) calc(var(--corte) + 30px); background: linear-gradient(180deg, #0a0e24, var(--cena-frente)); }
.jogue__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: 26px; justify-items: center; }
.jogue__texto { width: 100%; }
.jogue__texto .titulo-sec { margin-bottom: 12px; }
.jogue__sub { margin: 0; max-width: 32ch; font-size: 1.1875rem; color: var(--cena-frase); }
.fone--jogo { width: min(100%, 392px); }
.fone--jogo { gap: 18px; }
.fone__tela--jogo { aspect-ratio: 393 / 620; background: #0e1228; }
.fone__tela--aberta { aspect-ratio: auto; min-height: 560px; }
.fone__tela--aberta iframe { position: static; display: block; width: 100%; height: 640px; }
.jogue__botao { padding: 0 38px; min-height: 60px; font-size: 1.3125rem; white-space: nowrap; }
.jogue__como { display: none; margin: 22px 0 0; padding: 0; list-style: none; counter-reset: p; max-width: 34ch; }
.jogue__como li { counter-increment: p; display: flex; gap: 12px; align-items: baseline; margin-bottom: 10px; color: var(--cena-frase); font-size: 1.125rem; }
.jogue__como li::before { content: counter(p); flex: none; font: 700 1.25rem/1 var(--fonte-titulos); color: #ffd770; }
.fone__tela--jogo iframe { border: 0; background: #0e1228; }
@media (min-width: 900px) {
  .jogue__grade { grid-template-columns: minmax(0, 1fr) auto; gap: 80px; align-items: center; }
  .fone--jogo { width: 372px; }
  .jogue__texto .titulo-sec { font-size: clamp(3.4rem, 6vw, 6rem); }
  .jogue__como { display: block; }
}
@media (max-width: 520px) {
  .jogue__grade { padding-inline: 0; }
  .jogue__texto { padding-inline: var(--margem); }
  .fone--jogo { width: 100%; }
  .fone--jogo .fone__moldura { padding: 0; border-radius: 0; background: none; box-shadow: none; }
  .fone--jogo .fone__tela { border-radius: 0; }
}
.videos { padding-block: calc(var(--corte) + 18px) calc(var(--corte) + 24px); background: linear-gradient(180deg, var(--cena-frente), #0a0e24); }
.curtos { display: flex; gap: 18px; overflow-x: auto; padding: 10px max(var(--margem), calc((100% - var(--largura)) / 2 + var(--margem))) 22px; scroll-snap-type: x mandatory; scroll-padding-inline: max(var(--margem), calc((100% - var(--largura)) / 2 + var(--margem))); overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.curtos:focus-visible { outline: 3px solid var(--foco); outline-offset: -3px; border-radius: 0; }
.curto { flex: 0 0 min(66vw, 252px); scroll-snap-align: start; display: grid; gap: 12px; margin: 0; align-content: start; }
.curto__tela { aspect-ratio: 9 / 16; border-radius: 24px; overflow: hidden; background: #0e1228; box-shadow: 0 26px 50px -26px #000, 0 0 60px -20px rgb(245 166 35 / 0.35), 0 0 0 1px rgb(142 151 192 / 0.4); }
.curto__video { display: block; width: 100%; height: 100%; object-fit: contain; background: #0e1228; }
.curto__video:focus-visible { outline: 3px solid var(--foco); outline-offset: -3px; }
.curto figcaption { font: 700 1.125rem/1.2 var(--fonte-titulos); text-align: center; color: var(--texto); }
.videos__nota { margin-top: 4px; color: var(--cena-frase); font-size: 0.9375rem; }
@media (min-width: 900px) {
  .curtos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px; max-width: var(--largura); margin-inline: auto; padding: 10px var(--margem) 26px; overflow: visible; scroll-snap-type: none; }
  .curto { flex: none; }
}
.telas { padding-bottom: calc(var(--corte) + 40px); }
.galeria { display: flex; gap: 18px; overflow-x: auto; padding: 10px max(var(--margem), calc((100% - var(--largura)) / 2 + var(--margem))) 30px; scroll-snap-type: x mandatory; scroll-padding-inline: max(var(--margem), calc((100% - var(--largura)) / 2 + var(--margem))); overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.galeria__item { flex: 0 0 calc(50% - 22px); max-width: 250px; scroll-snap-align: start; display: grid; gap: 12px; margin: 0; }
.galeria__item .fone__moldura { padding: 6px; border-radius: 30px; }
.galeria__item .fone__tela { border-radius: 24px; }
.galeria__item figcaption { font: 700 1.125rem/1.2 var(--fonte-titulos); text-align: center; color: var(--texto); }
.galeria__item .fone__moldura { width: 100%; }
@media (min-width: 900px) { .galeria { justify-content: center; } .galeria__item { flex: 0 0 270px; max-width: none; } }
@media (max-width: 899px) { .galeria { gap: 14px; justify-content: center; padding-inline: var(--margem); } }
.galeria:focus-visible { outline: 3px solid var(--foco); outline-offset: -3px; border-radius: 0; }
.final { position: relative; padding-block: calc(var(--corte) + 26px) calc(var(--corte) * 0.4 + 54px); overflow: hidden; background: linear-gradient(180deg, #0a0e24 0%, #0a0e24 60%, #1a1630 100%); }
.final__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px; align-items: center; justify-items: center; }
.final__cena { position: relative; width: min(100%, 520px); aspect-ratio: 393 / 400; border-radius: 28px; overflow: hidden; background: var(--cena-ceu-a); box-shadow: 0 30px 70px -30px #000, 0 0 100px -30px rgb(245 166 35 / 0.45), 0 0 0 1px rgb(142 151 192 / 0.28); }
.final__texto { display: grid; gap: 22px; justify-items: center; text-align: center; }
.final__titulo { font: 700 clamp(3rem, 12vw, 6.4rem)/0.95 var(--fonte-titulos); -webkit-text-stroke: 0.8px #fff3cf; text-shadow: 0 5px 0 rgb(245 166 35 / 0.22); overflow-wrap: anywhere; }
.final__ficha { margin: 0; color: var(--cena-frase); font-size: 1.0625rem; }
@media (min-width: 900px) {
  .final__grade { grid-template-columns: minmax(0, 520px) minmax(0, 1fr); gap: 72px; }
  .final__texto { justify-items: start; text-align: left; }
  .final__titulo { font-size: clamp(2.6rem, 3.9vw, 4rem); }
}
.poste-botao { position: absolute; z-index: 3; left: 65.2%; top: 40.5%; width: 104px; height: 74px; transform: translate(-50%, -50%); background: transparent; border: 0; border-radius: 20px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.poste-botao:focus-visible { outline: 3px solid var(--foco); outline-offset: 0; }
.palco.apagado .luz, .palco.apagado .poca, .palco.apagado .lampada, .palco.apagado .part { opacity: 0; }
.palco.apagado .jan--cone, .palco.apagado .jan--fora, .palco.apagado .jan--viva { fill: var(--cena-janela-apagada); filter: none; }
.rodape { padding-block: 26px 40px; background: #0a0e24; color: var(--cena-frase); font-size: 0.9375rem; }
.rodape p { margin: 0; }
.rodape__linha { display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center; justify-content: space-between; }
.rodape a { display: inline-flex; align-items: center; min-height: var(--alvo-min); color: #fff3cf; text-decoration-thickness: 2px; text-underline-offset: 4px; max-width: 100%; overflow-wrap: anywhere; }
.rodape__links { display: flex; flex-wrap: wrap; gap: 0 22px; }
.creditos { margin-top: 10px; }
.creditos summary { display: inline-flex; align-items: center; min-height: var(--alvo-min); cursor: pointer; color: #fff3cf; font-weight: 700; }
.creditos ul { margin: 6px 0 0; padding-left: 20px; display: grid; gap: 4px; max-width: 70ch; }
.rodape .creditos a { display: inline; min-height: 0; padding-block: 15px; }
.final__titulo, .titulo-sec, .selo-loja__texto { min-width: 0; }
.heroi__grade > *, .final__grade > *, .jogue__grade > * { min-width: 0; }
@media (prefers-reduced-motion: no-preference) {
  .abertura { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: #0a0e24; pointer-events: none; animation: ab-sai 0.6s ease 2.3s forwards; }
  .ab-vista .abertura { display: none; }
  .abertura .simbolo__lampada { animation: ab-lampada 0.9s steps(1, end) 0.25s both; }
  .abertura .simbolo__cone, .abertura .simbolo__feixe, .abertura .simbolo__nucleo, .abertura .simbolo__poca { animation: ab-cone 0.55s ease-out 0.85s both; }
  .abertura__brilho { opacity: 0; animation: ab-brilho 1.6s ease-out 0.85s both; }
  .abertura .nome__letras { fill: #5e698f; animation: ab-letras 0.7s ease-out 1.2s forwards; }
  .abertura .nome__luz { opacity: 0; animation: ab-nome-luz 0.8s ease-out 1.2s forwards; }
  .abertura__palco { animation: ab-palco 2.3s ease-out both; }
  @keyframes ab-sai { to { opacity: 0; visibility: hidden; } }
  @keyframes ab-lampada { 0% { fill: #6f6a5c; } 18% { fill: #fff3c4; } 38% { fill: #6f6a5c; } 58%, 100% { fill: #fff3c4; } }
  @keyframes ab-cone { from { opacity: 0; } to { opacity: 1; } }
  @keyframes ab-brilho { 0% { opacity: 0; } 40% { opacity: 1; } 100% { opacity: 0.85; } }
  @keyframes ab-letras { from { fill: #5e698f; } to { fill: var(--cena-nome); } }
  @keyframes ab-nome-luz { from { opacity: 0; } to { opacity: 0.6; } }
  @keyframes ab-palco { 0% { transform: scale(0.96); } 100% { transform: scale(1.04); } }
  .heroi__texto > *, .heroi__grade > .fone { animation: sobe 0.7s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
  .heroi__texto > h1 { animation-delay: 2.1s; }
  .heroi__texto > .chamada { animation-delay: 2.3s; }
  .heroi__texto > .heroi__sub { animation-delay: 2.5s; }
  .heroi__texto > .heroi__acoes { animation-delay: 2.7s; }
  .heroi__texto > .heroi__ficha { animation-delay: 2.85s; }
  .heroi__grade > .fone { animation-delay: 2.4s; }
  .ab-vista .heroi__texto > h1 { animation-delay: 0s; }
  .ab-vista .heroi__texto > .chamada { animation-delay: 0.1s; }
  .ab-vista .heroi__texto > .heroi__sub { animation-delay: 0.2s; }
  .ab-vista .heroi__texto > .heroi__acoes { animation-delay: 0.3s; }
  .ab-vista .heroi__texto > .heroi__ficha { animation-delay: 0.4s; }
  .ab-vista .heroi__grade > .fone { animation-delay: 0.15s; }
  .heroi__ceu i { animation: pisca 4s ease-in-out infinite; }
  .heroi__ceu i:nth-child(odd) { animation-duration: 5.2s; animation-delay: 0.7s; }
  .heroi__ceu i:nth-child(3n) { animation-delay: 1.6s; }
  .heroi__cone { animation: luz-respira 5s ease-in-out infinite; }
  .fone--heroi .fone__moldura { animation: fone-entra 1.2s cubic-bezier(0.2, 0.8, 0.2, 1) 2.4s both, flutua 7s ease-in-out 3.7s infinite; }
  .ab-vista .fone--heroi .fone__moldura { animation-delay: 0.15s, 1.5s; }
  .nome__luz { animation: nome-pulsa 4s ease-in-out infinite; }
  .chamada em { animation: chama-brilha 3.6s ease-in-out infinite; }
  .heroi .nome__letras { fill: #5e698f; animation: ab-letras 0.9s ease-out 2.2s forwards; }
  .heroi .nome__luz { opacity: 0; animation: ab-nome-luz 0.9s ease-out 2.2s forwards, nome-pulsa 4s ease-in-out 3.3s infinite; }
  .heroi .chamada em { animation: acende-em 0.9s ease-out 2.9s both, chama-brilha 3.6s ease-in-out 3.9s infinite; }
  .ab-vista .heroi .nome__letras { animation-delay: 0s; }
  .ab-vista .heroi .nome__luz { animation-delay: 0s, 1.1s; }
  .ab-vista .heroi .chamada em { animation-delay: 0.5s, 1.5s; }
  .heroi__poste .simbolo__lampada { animation: ab-lampada 0.9s steps(1, end) 2.5s both; }
  .heroi__poste .simbolo__cone, .heroi__poste .simbolo__feixe, .heroi__poste .simbolo__nucleo, .heroi__poste .simbolo__poca { animation: ab-cone 0.55s ease-out 3.1s both; }
  .ab-vista .heroi__poste .simbolo__lampada { animation-delay: 0.3s; }
  .ab-vista .heroi__poste .simbolo__cone, .ab-vista .heroi__poste .simbolo__feixe, .ab-vista .heroi__poste .simbolo__nucleo, .ab-vista .heroi__poste .simbolo__poca { animation-delay: 0.9s; }
  .heroi__cone { animation: aparece 1.2s ease-out 3s both, luz-respira 5s ease-in-out 4.2s infinite; }
  .ab-vista .heroi__cone { animation-delay: 0.9s, 2.1s; }
  .js .heroi__cidade:not(.ligada) .j { opacity: 0; }
  .heroi__cidade.ligada .j { animation: jan-onda 0.5s ease-out both; animation-delay: calc(var(--i, 0) * 0.05s); }
  .js .passo, .js .bento__item, .js .curto, .js .galeria__item { opacity: 0; transform: translateY(26px); transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1); }
  .js .passo.vi, .js .bento__item.vi, .js .curto.vi, .js .galeria__item.vi { opacity: 1; transform: none; }
  .js .passo:nth-child(2), .js .curto:nth-child(2), .js .bento__item:nth-child(2) { transition-delay: 0.1s; }
  .js .passo:nth-child(3), .js .curto:nth-child(3), .js .bento__item:nth-child(3) { transition-delay: 0.2s; }
  .js .curto:nth-child(4) { transition-delay: 0.3s; }
  @media (hover: hover) { .js .bento__item.vi:hover { transform: translateY(-4px) rotate(-0.4deg); transition-delay: 0s; } }
  .alvo { animation: alvo-pulsa 1.8s ease-in-out infinite; }
  .js .final__cena:not(.ligado) .luz, .js .final__cena:not(.ligado) .poca, .js .final__cena:not(.ligado) .lampada, .js .final__cena:not(.ligado) .part { opacity: 0; }
  .js .final__cena:not(.ligado) .jan--fora, .js .final__cena:not(.ligado) .jan--cone { fill: var(--cena-janela-apagada); filter: none; }
  .final__cena.ligado .lampada { animation: lampada-tremula 0.9s steps(1, end) 0s both; }
  .final__cena.ligado .luz .cone, .final__cena.ligado .luz .brilho { animation: luz-abre 0.5s cubic-bezier(0.2, 0.7, 0.2, 1) 0.3s both, luz-respira 3.2s ease-in-out 1.2s infinite; }
  .final__cena.ligado .poca { animation: aparece 0.4s ease-out 0.5s both; }
  .final__cena.ligado .jan--fora, .final__cena.ligado .jan--cone { animation: janela-acende 0.3s ease-out both; animation-delay: calc(0.5s + var(--dist, 0) * 0.7s); }
  .final__cena.ligado .part { animation: part-sobe 4s ease-in-out calc(1s + var(--i, 0) * 0.25s) infinite both; }
  .palco.apagado .luz .cone, .palco.apagado .luz .brilho, .palco.apagado .lampada, .palco.apagado .poca, .palco.apagado .part, .palco.apagado .jan--fora, .palco.apagado .jan--cone { animation: none !important; }
  .jan { transition: fill 0.5s ease, filter 0.5s ease; }
  .luz, .poca, .lampada { transition: opacity 0.35s ease; }
  .botao, .selo-loja, .bento__item { transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.2s; }
  .hud.bate { animation: hud-bate 0.5s cubic-bezier(0.2, 0.9, 0.3, 1.4); }
  .selo-loja--grande { animation: selo-pulsa 3.4s ease-in-out 1s infinite; }
  @keyframes sobe { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
  @keyframes pisca { 0%, 100% { opacity: 0.25; } 50% { opacity: 0.9; } }
  @keyframes luz-respira { 50% { opacity: 0.8; } }
  @keyframes flutua { 50% { transform: var(--incl) translateY(-8px); } }
  @keyframes fone-entra { from { opacity: 0; transform: perspective(1400px) translateY(46px) rotateY(-24deg) rotateX(9deg) scale(0.9); } }
  @keyframes acende-em { from { color: #6f7899; -webkit-text-stroke-color: #6f7899; text-shadow: none; } }
  @keyframes jan-onda { from { opacity: 0; } }
  @keyframes alvo-pulsa { 50% { transform: translate(-50%, -50%) scale(1.12); opacity: 0.75; } }
  @keyframes nome-pulsa { 50% { opacity: 0.8; } }
  @keyframes chama-brilha { 50% { text-shadow: 0 0 44px rgb(255 211 107 / 0.85); } }
  @keyframes lampada-tremula { 0% { opacity: 0.05; } 15% { opacity: 1; } 35% { opacity: 0.15; } 55%, 100% { opacity: 1; } }
  @keyframes luz-abre { from { opacity: 0; transform: scale(0.55, 0.04); } to { opacity: 1; transform: none; } }
  @keyframes aparece { from { opacity: 0; } to { opacity: 1; } }
  @keyframes janela-acende { from { fill: var(--cena-janela-apagada); filter: none; } }
  @keyframes part-sobe { 0% { opacity: 0; transform: translateY(0); } 30% { opacity: 0.7; } 100% { opacity: 0; transform: translateY(-16px); } }
  @keyframes hud-bate { 40% { transform: scale(1.18); } }
  @keyframes selo-pulsa { 50% { box-shadow: 0 5px 0 #8a5200, 0 14px 48px -6px rgb(255 211 107 / 0.95); } }
  .cena-inicio .luz .cone, .cena-inicio .luz .brilho { transform-box: fill-box; transform-origin: 50% 0; }
  .cena-inicio .luz .brilho { transform-origin: 50% 50%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .abertura { display: none !important; }
}
@media (forced-colors: active) {
  .botao, .selo-loja, .bento__item { border: 2px solid ButtonText; }
}
@media (max-width: 899px) {
  .como, .tem, .telas { padding-block: calc(var(--corte) + 2px) calc(var(--corte) + 6px); }
  .jogue, .videos { padding-block: calc(var(--corte) + 2px) calc(var(--corte) + 8px); }
  .telas { padding-bottom: calc(var(--corte) + 10px); }
  .heroi { padding-bottom: calc(var(--corte) + 70px); }
  .heroi__grade { gap: 52px; }
  .titulo-sec { margin-bottom: 18px; }
  .fone--passo { width: min(52vw, 204px); }
  .passos { padding-top: 30px; padding-bottom: 12px; }
  .bento { gap: 12px; }
  .bento__item { padding: 12px; gap: 10px; }
  .bento__midia { aspect-ratio: 393 / 640; }
  .bento__item--dia .bento__midia img, .bento__item--3d .bento__midia img, .bento__item--jornada .bento__midia img { object-position: 50% 0; }
  .bento__item--festa .fone__tela { aspect-ratio: 393 / 640; }
  .bento__item--faixa, .bento__item--premium { padding: 16px; }
  .curtos { padding-bottom: 14px; }
  .galeria { padding-bottom: 14px; }
}

/* Faixa do teste fechado (15/11/2026): o site aponta para o teste até o app estar na loja. */
.teste { margin-top: 28px; padding: 22px 22px 18px; border-radius: 18px; background: rgb(18 22 58 / 0.72); border: 1px solid rgb(255 211 107 / 0.45); text-align: left; max-width: 34rem; }
.teste__titulo { margin: 0 0 8px; font: 700 1.25rem/1.25 var(--fonte); color: #ffd36b; }
.teste__texto, .teste__nota { margin: 0 0 10px; font-size: 1rem; line-height: 1.5; color: #eef0ff; }
.teste__passos { margin: 0 0 12px; padding-left: 1.4rem; display: grid; gap: 8px; font-size: 1rem; line-height: 1.5; color: #eef0ff; }
.teste__passos a { color: #ffd36b; font-weight: 700; text-underline-offset: 3px; }
.teste__passos a:focus-visible { outline: 3px solid #ffd36b; outline-offset: 3px; border-radius: 4px; }
.teste__nota { font-size: 0.875rem; color: #c9cdf0; margin: 0; }