/* Moldura de foto de perfil · Camargo Minha Capital 33333. Tudo dentro de .mo-raiz para não brigar com o Tailwind do site. */
.mo-raiz{--mo-azul:#18388A;--mo-azul-2:#2055A5;--mo-tinta:#0F1B3D;--mo-texto:#33406A;--mo-suave:#4B5A80;
  --mo-amarelo:#F5B91C;--mo-linha:#DBE4F2;--mo-gelo:#F4F7FC;
  font-family:"Inter",system-ui,sans-serif;color:var(--mo-texto);font-size:17px;line-height:1.6}
.mo-raiz h1,.mo-raiz h2{font-family:"Archivo Black","Inter",sans-serif;font-weight:400;color:var(--mo-tinta);line-height:1.1;margin:0 0 .5em}
.mo-raiz p{margin:0 0 1em}
.mo-raiz strong{font-weight:700}
.mo-wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.mo-topo{background:linear-gradient(135deg,#18388A 0%,#0F1B3D 100%);color:#fff}
.mo-topo .mo-wrap{padding-top:36px;padding-bottom:36px}
.mo-topo h1{color:#fff;font-size:clamp(1.8rem,4.2vw,2.8rem)}
.mo-topo h1 em{font-style:normal;color:var(--mo-amarelo)}
.mo-topo p{color:#E1E9F7;max-width:60ch;margin:0}
.mo-topo p strong{color:#fff}
.mo-faixa{display:flex;height:8px}.mo-faixa i{flex:1}
.mo-faixa i:nth-child(1){background:#3CA456}.mo-faixa i:nth-child(2){background:#F5B91C}
.mo-faixa i:nth-child(3){background:#51A6D8}.mo-faixa i:nth-child(4){background:#18388A}
.mo-sec{padding:44px 0 56px;background:var(--mo-gelo)}
.mo-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:44px;align-items:start}
@media(max-width:860px){.mo-grid{grid-template-columns:1fr;gap:26px}.mo-sec{padding:24px 0 40px}}

/* o palco: canvas quadrado + convite posicionado dentro da janela redonda da arte
   (janela: centro 50% x 41,2%, raio 35,6% do lado) */
.mo-palco{position:relative;width:100%;max-width:520px;margin:0 auto;aspect-ratio:1;border-radius:18px;overflow:hidden;
  box-shadow:0 22px 56px -24px rgba(15,27,61,.5);background:var(--mo-azul);touch-action:none}
.mo-palco canvas{display:block;width:100%;height:100%;cursor:grab}
.mo-palco.tem-foto canvas{cursor:move}
.mo-vazio{position:absolute;left:14.4%;top:5.6%;width:71.2%;aspect-ratio:1;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;
  padding:0 12%;color:#fff;cursor:pointer;background:rgba(15,27,61,.35);border:2px dashed rgba(255,255,255,.6);
  transition:background .15s}
.mo-vazio:hover,.mo-vazio:focus-visible,.mo-vazio.arrastando{background:rgba(15,27,61,.55);outline:none}
.mo-vazio strong{font-size:1.15rem;line-height:1.25;color:#fff}
.mo-vazio span{font-size:.85rem;color:#E1E9F7;line-height:1.35}
.mo-vazio .mo-mais{width:58px;height:58px;border-radius:50%;background:var(--mo-amarelo);color:var(--mo-tinta);
  font:400 2.2rem/58px "Archivo Black",sans-serif;margin-bottom:6px}
.mo-vazio[hidden]{display:none}
.mo-dica{font-size:.88rem;color:var(--mo-suave);text-align:center;margin:12px auto 0;max-width:520px}

.mo-lado h2{font-size:1.6rem}
.mo-passos{margin:0 0 20px;padding-left:1.3em;list-style:decimal}
.mo-passos li{margin-bottom:8px}
.mo-botoes{display:flex;flex-direction:column;gap:10px}
.mo-raiz .mo-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;
  font:700 16px/1.2 "Inter",sans-serif;padding:15px 22px;border-radius:999px;border:2px solid transparent;cursor:pointer;
  text-decoration:none;transition:transform .15s}
.mo-raiz .mo-btn:hover{transform:translateY(-2px)}
.mo-raiz .mo-b1{background:#F5B91C;color:#0F1B3D;box-shadow:0 3px 0 #C99300}
.mo-raiz .mo-b2{background:#18388A;color:#fff;box-shadow:0 3px 0 #0F1B3D}
.mo-raiz .mo-b3{background:#fff;color:#18388A;border-color:#BFD0EA}
.mo-editor{display:flex;flex-direction:column;gap:12px;margin-top:4px}
.mo-raiz .mo-btn[hidden]{display:none}
.mo-editor[hidden]{display:none}
.mo-zoom{display:flex;align-items:center;gap:12px;font-weight:600;color:var(--mo-tinta)}
.mo-zoom input{flex:1;accent-color:#18388A}
.mo-aviso{background:#FDECEC;color:#8A1F1F;border:1px solid #F1B8B8;border-radius:10px;padding:10px 14px;font-size:.92rem}
.mo-aviso[hidden],.mo-ok[hidden]{display:none}
.mo-ok{background:#E9F6EC;border:1px solid #A9D8B4;color:#1C5A2C;border-radius:10px;padding:12px 16px;font-size:.93rem;margin-top:14px}
.mo-ok strong{display:block;color:#123D1E}
.mo-priv{margin-top:22px;background:#EAF1FB;border:1px solid var(--mo-linha);border-radius:10px;padding:14px 18px;font-size:.9rem;color:#18388A}
.mo-priv strong{color:#0F1B3D}
.mo-fecho{background:linear-gradient(135deg,#18388A 0%,#0F1B3D 100%);color:#fff;text-align:center}
.mo-fecho .mo-wrap{padding-top:52px;padding-bottom:52px;max-width:760px}
.mo-fecho h2{color:#fff;font-size:clamp(1.5rem,3.2vw,2.2rem)}
.mo-fecho p{color:#E1E9F7}
.mo-fecho .mo-acoes{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.mo-fecho .mo-btn{width:auto}
.mo-raiz .mo-b4{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
/* celular: botões logo abaixo da moldura, antes do passo a passo (ninguém rola até o fim no webview) */
@media(max-width:860px){
  .mo-lado{display:flex;flex-direction:column}
  .mo-lado .mo-aviso,.mo-lado .mo-botoes,.mo-lado .mo-editor,.mo-lado .mo-ok{order:-1}
  .mo-lado .mo-botoes,.mo-lado .mo-editor{margin-bottom:22px}
  .mo-lado .mo-ok{margin:-8px 0 22px}
}