/* OctoForms, Onda 2: formulario PUBLICO (modo Persuadir: corpo 18px, alvo de toque 44px, mobile primeiro).
   As cores vem de `design_json` (variaveis --of-*, so #rrggbb validado no servidor). Sem `design_json`
   (classe .of-padrao) usa o azul da Universidade da Libras e troca para escuro com o sistema. */
:root{--of-fundo:#F5F8FC;--of-pergunta:#003366;--of-resposta:#1D2126;--of-botao:#006699;--of-botao-hover:#003366;--of-botao-texto:#FFFFFF;
  --of-card:#FFFFFF;--of-borda:#C9D3DF;--of-suave:#4B5A6B;--of-erro:#9C2C22;--of-erro-bg:#FDECEB;--of-foco:#0099FF;--of-ok:#0B7A55;
  --of-cor-azul:#0B63B5;--of-cor-verde:#0B7A55;--of-cor-roxo:#6B3FA0;--of-cor-vermelho:#B3261E}
@media (prefers-color-scheme:dark){
  body.of-padrao{--of-fundo:#0E1620;--of-pergunta:#E8F1FB;--of-resposta:#E6EBF1;--of-botao:#0099FF;--of-botao-hover:#33ADFF;--of-botao-texto:#00243F;
    --of-card:#16212E;--of-borda:#2C3C50;--of-suave:#A9B8C9;--of-erro:#FFB4AB;--of-erro-bg:#3A1A17;--of-ok:#5BD6A9;
    --of-cor-azul:#5CB8FF;--of-cor-verde:#5BD6A9;--of-cor-roxo:#C9A8FF;--of-cor-vermelho:#FF9C94}
}
/* escopo no .of: o mesmo CSS e carregado DENTRO de paginas do OctoSite (embed, Onda 9) e nao pode vazar */
.of,.of *,.of *::before,.of *::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.of-corpo{margin:0;background:var(--of-fundo);color:var(--of-resposta);font:400 18px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  min-height:100vh;min-height:100dvh}
.of{max-width:640px;margin:0 auto;padding:24px 16px 56px}
.of-cartao{background:var(--of-card);border:1px solid var(--of-borda);border-radius:16px;padding:24px 20px;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.of-logo{display:block;max-height:56px;max-width:60%;margin:0 auto 20px}
/* Marca da empresa: fixa no canto superior direito durante todo o formulario (12/10/2026). Nao recebe toque. */
.of-marca-empresa{position:fixed;top:12px;right:16px;z-index:20;display:block;pointer-events:none;max-width:110px}
.of-marca-empresa img{display:block;max-height:32px;max-width:110px;width:auto;height:auto;object-fit:contain}
@media (min-width:600px){.of-marca-empresa{top:16px;right:24px;max-width:150px}.of-marca-empresa img{max-height:44px;max-width:150px}}
/* tela larga: a marca acompanha o lado DIREITO da coluna do formulario (640px), nao o canto longe da tela */
@media (min-width:720px){.of-marca-empresa{right:calc(50% - 320px)}}
.of-imagem{display:block;max-width:100%;height:auto;border-radius:12px;margin:0 0 16px}
.of-titulo{font-size:1.5rem;line-height:1.25;font-weight:600;color:var(--of-pergunta);margin:0 0 12px;outline:none;overflow-wrap:anywhere}
.of-texto,.of-desc{color:var(--of-suave);margin:0 0 16px;overflow-wrap:anywhere}
.of-progresso{font-size:.875rem;color:var(--of-suave);margin:0 0 8px}
.of-barra{height:6px;border-radius:999px;background:var(--of-borda);margin:0 0 20px;overflow:hidden}
.of-barra>span{display:block;height:100%;background:var(--of-botao);transition:width .25s ease}
.of-campo{display:block;width:100%;min-height:48px;padding:12px 14px;font:inherit;color:var(--of-resposta);background:var(--of-card);
  border:1.5px solid var(--of-borda);border-radius:10px}
textarea.of-campo{min-height:132px;resize:vertical}
.of-campo:focus-visible,.of-botao:focus-visible,.of-botao-sec:focus-visible,.of-opcao input:focus-visible+span,.of a:focus-visible{outline:3px solid var(--of-foco);outline-offset:2px}
.of-prefixo{display:flex;align-items:center;gap:8px}
.of-prefixo .of-ddi{flex:0 0 auto;min-height:48px;display:flex;align-items:center;padding:0 12px;border:1.5px solid var(--of-borda);border-radius:10px;color:var(--of-suave)}
fieldset.of-grupo{border:0;margin:0;padding:0;min-width:0}
fieldset.of-grupo>legend{padding:0;margin:0 0 8px;font-size:.875rem;color:var(--of-suave)}
.of-opcoes{display:grid;gap:10px;margin:0 0 4px}
.of-opcao{display:block;position:relative}
.of-opcao input{position:absolute;opacity:0;width:44px;height:44px;margin:0;left:0;top:0}
.of-opcao span{display:flex;align-items:center;gap:12px;min-height:52px;padding:12px 14px;border:1.5px solid var(--of-borda);border-radius:12px;
  background:var(--of-card);cursor:pointer;overflow-wrap:anywhere}
.of-opcao span::before{content:"";flex:0 0 22px;height:22px;border:2px solid var(--of-borda);border-radius:50%;background:var(--of-card)}
.of-opcao.multi span::before{border-radius:6px}
.of-opcao input:checked+span{border-color:var(--of-botao);box-shadow:0 0 0 1px var(--of-botao)}
.of-opcao input:checked+span::before{border-color:var(--of-botao);background:var(--of-botao);box-shadow:inset 0 0 0 4px var(--of-card)}
.of-outro{margin-top:10px}
.of-acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px;align-items:center}
.of-botao,.of-botao-sec{min-height:48px;padding:12px 22px;font:inherit;font-weight:600;border-radius:10px;cursor:pointer;text-decoration:none;
  display:inline-flex;align-items:center;justify-content:center;border:1.5px solid transparent}
.of-botao{background:var(--of-botao);color:var(--of-botao-texto)}
.of-botao:hover{background:var(--of-botao-hover)}
.of-botao[disabled]{opacity:.55;cursor:not-allowed}
.of-botao-sec{background:transparent;color:var(--of-pergunta);border-color:var(--of-borda)}
.of-botao-sec:hover{border-color:var(--of-pergunta)}
.of-erro{margin:12px 0 0;padding:10px 14px;border-radius:10px;background:var(--of-erro-bg);color:var(--of-erro);font-size:.95rem}
.of-aviso{margin:12px 0 0;padding:10px 14px;border-radius:10px;background:var(--of-card);border:1px solid var(--of-borda);color:var(--of-suave);font-size:.95rem}
.of-sensivel{font-size:.9rem;color:var(--of-suave);margin:0 0 12px}
.of-aceite{margin:18px 0 6px;font-size:1rem;line-height:1.5;color:var(--of-resposta)}
.of-aceite a{color:var(--of-pergunta);text-decoration:underline}
.of-consent{display:flex;gap:12px;align-items:flex-start;margin:18px 0 6px;font-size:.95rem;color:var(--of-resposta)}
.of-consent input{flex:0 0 24px;width:24px;height:24px;margin:2px 0 0;accent-color:var(--of-botao)}
.of-consent a,.of-texto a{color:var(--of-pergunta);text-decoration:underline}
.of-seguro{display:flex;align-items:center;gap:8px;margin:12px 0 0;font-size:.875rem;color:var(--of-suave)}
.of-seguro svg{flex:0 0 18px}
.of-hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.of-carregando{color:var(--of-suave);text-align:center;margin-top:20vh}
.of-lista-item{margin:0 0 28px}
.of [hidden],.of-lista-item[hidden]{display:none!important}
.of-ok{color:var(--of-ok)}
@media (min-width:600px){.of{padding-top:48px}.of-cartao{padding:32px 32px}}
@media (prefers-reduced-motion:reduce){.of-barra>span{transition:none}}
/* ---------- Onda 8: modo conversa (bot). Mobile primeiro; mesmas variaveis --of-*. ---------- */
.of.of-conversa{padding:0;height:100vh;height:100dvh;display:flex;flex-direction:column}
.of-chat{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--of-card)}
.of-chat-cab{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--of-borda)}
.of-chat-nome{font-weight:600;color:var(--of-pergunta);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.of-chat-barra{height:4px;margin:0;border-radius:0}
.of-chat-log{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:16px 12px;display:flex;flex-direction:column;gap:8px;background:var(--of-fundo)}
.of-avatar{flex:0 0 36px;width:36px;height:36px;border-radius:50%;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;
  background:var(--of-botao);color:var(--of-botao-texto);font-weight:600}
.of-avatar img{width:100%;height:100%;object-fit:contain;background:#fff;padding:3px}
.of-msg{display:flex;align-items:flex-end;gap:8px;max-width:100%}
.of-msg-eu{justify-content:flex-end}
.of-bolha{max-width:85%;padding:10px 14px;border-radius:18px;overflow-wrap:anywhere;font-size:1rem;line-height:1.45}
.of-msg-bot .of-bolha{background:var(--of-card);border:1px solid var(--of-borda);color:var(--of-resposta);border-bottom-left-radius:6px}
.of-msg-eu .of-bolha{background:var(--of-botao);color:var(--of-botao-texto);border-bottom-right-radius:6px}
.of-msg-nota .of-bolha{font-size:.9rem;color:var(--of-suave)}
.of-msg-nota .of-bolha a{color:var(--of-pergunta);text-decoration:underline}
.of-msg-erro .of-bolha{background:var(--of-erro-bg);color:var(--of-erro);border-color:var(--of-erro)}
.of-bolha .of-imagem{margin:0;max-height:220px;object-fit:contain}
.of-bolha .of-botao{margin:2px 0}
.of-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.of-digitando .of-bolha{display:flex;gap:5px;padding:14px 16px}
.of-digitando i{width:8px;height:8px;border-radius:50%;background:var(--of-suave);animation:of-pulo 1.1s infinite ease-in-out}
.of-digitando i:nth-child(2){animation-delay:.15s}.of-digitando i:nth-child(3){animation-delay:.3s}
@keyframes of-pulo{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.of-chat-comp{flex:0 0 auto;max-height:55%;overflow-y:auto;padding:12px 12px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--of-borda);background:var(--of-card)}
.of-chat-comp:empty{display:none}
.of-chat-linha{display:flex;gap:8px;align-items:flex-end}
.of-chat-linha>div{flex:1;min-width:0}
.of-chat-go{flex:0 0 48px;width:48px;padding:0}
.of-chat-extras{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.of-chat-extras:empty{display:none}
.of-chat-extras .of-botao{width:100%}
.of-chat-peq{min-height:44px;padding:8px 16px;font-weight:500}
.of-rr-grupo{display:flex;flex-wrap:wrap;gap:8px}
.of-rr{min-height:44px;padding:10px 18px;font:inherit;font-weight:500;color:var(--of-botao);background:var(--of-card);border:1.5px solid var(--of-botao);border-radius:22px;cursor:pointer;max-width:100%;overflow-wrap:anywhere;text-align:left}
.of-rr:hover{background:var(--of-fundo)}
.of-rr[aria-pressed="true"]{background:var(--of-botao);color:var(--of-botao-texto)}
.of-rr:focus-visible,.of-chat-go:focus-visible{outline:3px solid var(--of-foco);outline-offset:2px}
.of-rr[disabled]{opacity:.55;cursor:not-allowed}
.of-msg:focus{outline:none}
@media (min-width:600px){.of.of-conversa{padding:24px 16px;height:min(100dvh,820px)}.of-chat{border:1px solid var(--of-borda);border-radius:16px;overflow:hidden}}
@media (prefers-reduced-motion:reduce){.of-digitando i{animation:none}}
/* ---------- Onda 9: embed dentro de pagina do OctoSite (herda fonte da pagina; so desenha o formulario) ---------- */
.of.of-embed{max-width:none;padding:0;margin:0;color:var(--of-resposta);font-size:18px;line-height:1.55}
.of.of-embed .of-carregando{margin-top:0;padding:24px 0}
.of.of-embed.of-conversa{padding:0;height:min(80vh,640px);height:min(80dvh,640px)}
.of.of-embed .of-chat{border:1px solid var(--of-borda);border-radius:16px;overflow:hidden}
/* ---------- Tela inicial redesenhada (pedido do dono, 06/10/2026) ----------
   Modo Persuadir. Assinatura: a foto dos fundadores em circulo, metade para fora do topo do cartao.
   Titulo = primeira linha do texto; o resto do texto (ENTER) vira paragrafos; aviso legal ABAIXO do botao. */
.of-titulo,.of-desc{white-space:pre-line}
.of-bolha{white-space:pre-line}
.of-cartao.of-inicio{position:relative;text-align:center}
.of-cartao.of-inicio.com-foto{margin-top:66px;padding-top:88px}
.of-foto{position:absolute;top:-66px;left:50%;transform:translateX(-50%);width:132px;height:132px;border-radius:50%;overflow:hidden;
  background:#d6ecff;
  box-shadow:0 0 0 5px var(--of-card),0 0 0 7px var(--of-borda),0 8px 20px rgba(0,0,0,.14)}
.of-foto img{display:block;position:absolute;left:4%;top:14%;width:92%;height:auto;max-width:none}
.of-acoes-final{justify-content:center}
.of-titulo-inicio{font-size:1.75rem;font-weight:700;line-height:1.2;margin:0 0 16px;text-wrap:balance}
.of-intro{text-align:left;margin:0 0 20px}
.of-conhecida .of-link{background:none;border:0;padding:0;margin:0;color:inherit;font:inherit;text-decoration:underline;cursor:pointer;min-height:44px}
.of-intro p{margin:0 0 12px;color:var(--of-suave);overflow-wrap:anywhere}
.of-intro p:last-child{margin-bottom:0}
/* cor de destaque do texto (4 cores fixas da marca, contraste >= 4,5:1 sobre o cartao) e lista com marcadores */
.of-cor-azul{color:var(--of-cor-azul)}.of-cor-verde{color:var(--of-cor-verde)}.of-cor-roxo{color:var(--of-cor-roxo)}.of-cor-vermelho{color:var(--of-cor-vermelho)}
.of-marc{margin:0 0 16px;padding-left:1.4em;color:var(--of-suave)}
.of-marc li{margin:0 0 6px;overflow-wrap:anywhere}
.of-intro .of-marc{margin-bottom:12px}
.of-marc-bolha p{margin:0 0 6px}.of-marc-bolha .of-marc{margin:0 0 6px;padding-left:1.2em;color:inherit}
.of-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;margin:0 0 20px;font-size:.875rem;color:var(--of-suave)}
.of-meta-item{display:inline-flex;align-items:center;gap:6px}
.of-meta-item svg{flex:0 0 18px;color:var(--of-botao)}
.of-botao{transition:background-color .15s ease,transform .1s ease}
.of-botao:active,.of-botao-sec:active,.of-rr:active{transform:scale(.98)}
.of-acoes-inicio{margin-top:0}
.of-botao-grande{width:100%;min-height:56px;font-size:1.0625rem;gap:12px}
.of-tecla{display:none;font-size:.75rem;font-weight:500;line-height:1;padding:4px 8px;border:1px solid currentColor;border-radius:6px;opacity:.8}
.of-legal{margin:16px 0 0;text-align:left;font-size:.875rem;line-height:1.5;color:var(--of-suave)}
.of-legal p{margin:0 0 8px}
.of-legal p:last-child{margin-bottom:0}
.of-legal a{color:var(--of-pergunta);text-decoration:underline}
.of-legal-chat{margin-top:12px}
.of-avatar-foto{background:var(--of-borda);background:color-mix(in srgb,var(--of-botao) 16%,var(--of-card))}
.of-avatar-foto{position:relative}
.of-avatar-foto img{position:absolute;left:4%;top:14%;width:92%;height:auto;max-width:none;padding:0;background:transparent;object-fit:fill}
.of-lista-foco{outline:2px solid var(--of-foco);outline-offset:8px;border-radius:8px}
@media (hover:hover) and (pointer:fine){.of-tecla{display:inline-block}}
@media (max-width:420px){.of-foto{width:112px;height:112px;top:-56px}.of-cartao.of-inicio.com-foto{margin-top:56px;padding-top:72px}.of-titulo-inicio{font-size:1.5rem}}
@media (prefers-reduced-motion:reduce){.of-botao{transition:none}.of-botao:active{transform:none}}