/* Páginas de apoio: obrigado, tutorial, termos, privacidade (redesign 14/09/2026) */
.doc-topo { position: sticky; top: 0; z-index: 60; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 24px; background: rgba(6, 6, 7, .8); backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); }
.doc-topo .nav-marca span { color: #fff; }
.doc-main { position: relative; overflow: hidden; padding: clamp(48px, 8vw, 96px) 0 100px; }
.doc-main .luz { width: 800px; height: 500px; left: 50%; top: -200px; transform: translateX(-50%); opacity: .35; }
.doc { width: 100%; max-width: 760px; margin: 0 auto; padding: 0 24px; position: relative; z-index: 1; }
.doc-largo { max-width: 980px; }
.doc h1 { font: 700 clamp(2.2rem, 5vw, 3.4rem)/1.02 var(--f-dp); letter-spacing: -.045em; margin: 14px 0 12px; }
.doc .sub { color: var(--tx-2); font-size: 1.05rem; margin: 0 0 40px; }
.doc h2 { font: 700 1.35rem/1.2 var(--f-dp); letter-spacing: -.03em; margin: 40px 0 10px; }
.doc p, .doc li { color: var(--tx-2); font-size: 15.5px; line-height: 1.7; }
.doc p { margin: 0 0 12px; }
.doc a { color: var(--azul); }
.doc a.btn { color: var(--tx-b); }
.doc ul { padding-left: 20px; }
.doc-secao { padding: 26px 28px; border-radius: var(--r-lg); background: var(--card); border: 1px solid var(--line); margin-bottom: 14px; }
.doc-secao h2 { margin-top: 0; }
.doc-secao p:last-child { margin-bottom: 0; }
.passos-uso { list-style: none; padding: 0; margin: 0; counter-reset: p; display: grid; gap: 10px; }
.passos-uso li { counter-increment: p; display: grid; grid-template-columns: 40px 1fr; gap: 14px; align-items: center; padding: 14px 16px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); color: var(--tx); }
.passos-uso li::before { content: counter(p); width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--azul), #7cd0ff); color: #001526; font: 700 15px/1 var(--f-dp); }
.video-tutorial { border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line-2); background: #000; box-shadow: var(--sombra); }
.video-tutorial video { width: 100%; aspect-ratio: 16 / 9; }
.chave-caixa { padding: 18px 20px; border-radius: 14px; background: var(--bg-2); border: 1px solid rgba(255, 210, 63, .35); font-family: var(--f-mono); font-size: clamp(15px, 4vw, 22px); font-weight: 600; letter-spacing: .06em; text-align: center; word-break: break-all; -webkit-user-select: all; user-select: all; color: var(--ouro); }
.girando { width: 40px; height: 40px; margin: 0 auto 18px; border: 3px solid var(--line-2); border-top-color: var(--azul); border-radius: 50%; animation: gira-s 1s linear infinite; }
@keyframes gira-s { to { transform: rotate(360deg); } }
.centro { text-align: center; }
.oculto { display: none !important; }
.entrega-acoes { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.entrega-acoes .btn { flex: 1 1 auto; }
.selo-ok { width: 72px; height: 72px; margin: 0 auto 18px; border-radius: 50%; display: grid; place-items: center; background: rgba(47, 211, 122, .12); border: 1px solid rgba(47, 211, 122, .35); color: var(--verde); }
.selo-ok svg { width: 34px; height: 34px; stroke: currentColor; fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.char-canto { position: absolute; right: -2%; bottom: -20px; width: clamp(160px, 22vw, 320px); pointer-events: none; opacity: .9; filter: drop-shadow(0 30px 50px rgba(0, 0, 0, .6)); z-index: 0; }
.char-canto img { animation: flutua 8s ease-in-out infinite; }
@media (max-width: 800px) { .char-canto { width: 120px; opacity: .35; } }
