/* Estilos do site no celular (até 760 px): casca (topo + abas) e peças das telas telas/Celular-*.html. Pode editar aqui. Desenho: canvas, linha "Celular". */
/* ---------- casca do celular: topo + abas de baixo (telas/CelularTopo.html e telas/CelularAbas.html) ---------- */
.cel-topo{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;height:56px;padding:0 16px;background:var(--cFAF9F6);border-bottom:1px solid var(--cECEAE5);box-sizing:border-box}
.cel-marca{display:flex;align-items:center;gap:8px;font-size:19px;font-weight:600;letter-spacing:-0.03em;color:var(--c111111);text-decoration:none}
.cel-marca span{font-weight:500;color:var(--c8A8984);font-size:13px}
.cel-acoes{display:flex;align-items:center;gap:8px}
.cel-tema{font:inherit;width:40px;height:40px;flex:none;border-radius:50%;border:1px solid var(--cE3E0D9);background:var(--cFFFFFF);color:var(--c3D3D3A);display:grid;place-items:center;cursor:pointer}
.cel-avatar{width:40px;height:40px;flex:none;border-radius:50%;background:var(--c111111);color:var(--cFFFFFF)!important;display:grid;place-items:center;font-size:14px;font-weight:600;text-decoration:none}
.cel-abas{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:var(--cFFFFFF);border-top:1px solid var(--cECEAE5);padding:6px 4px calc(8px + env(safe-area-inset-bottom))}
.cel-aba{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:52px;font-size:11px;position:relative;text-align:center;text-decoration:none}
.cel-aba-ico{display:grid;place-items:center;width:52px;height:30px;border-radius:999px}
.cel-badge{position:absolute;top:2px;left:calc(50% + 8px);font-size:10px;font-weight:700;line-height:1;background:var(--cC0392B);color:var(--cFFFFFF);border-radius:999px;padding:3px 5px}
.cel-tema:focus-visible,.cel-aba:focus-visible,.cel-avatar:focus-visible{outline:2px solid var(--cB27621);outline-offset:2px}
.cel-com-abas{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
/* No celular o menu lateral some (a casca acima entra no lugar) */
@media (max-width: 760px){.menu-lateral{display:none!important}}
/* ---------- peças das telas de celular ---------- */
.cel{background:var(--cFFFFFF);color:var(--c111111);min-height:calc(100vh - 56px)}
.cel a{color:var(--c111111);text-decoration:none}
.cel .conteudo{flex:1;box-sizing:border-box;padding:20px 16px 28px;display:flex;flex-direction:column;gap:20px;min-width:0}
.cel .titulo{margin:0;font-family:Newsreader,Georgia,serif;font-weight:500;font-size:32px;line-height:1.1;letter-spacing:-0.02em}
.cel .sub{font-size:13px;color:var(--c6B6A66)}
.cel .cab{display:flex;flex-direction:column;gap:6px}
.cel .seg-grupo{display:grid;gap:4px;padding:4px;border-radius:999px;background:var(--cF3F1EC)}
.cel .seg{font:inherit;font-size:13px;font-weight:500;border:0;border-radius:999px;padding:8px 4px;min-height:40px;cursor:pointer;white-space:nowrap}
.cel .card{background:var(--cFFFFFF);border:1px solid var(--cECEAE5);border-radius:18px;box-shadow:0 1px 2px rgba(17,17,17,.04),0 10px 24px -14px rgba(17,17,17,.14)}
.cel .suave{background:var(--cF3F1EC);border-radius:18px}
.cel .rola{display:flex;gap:8px;overflow-x:auto;margin:0 -16px;padding:0 16px 2px;scrollbar-width:none}
.cel .rola::-webkit-scrollbar{display:none}
.cel .chip{font:inherit;font-size:13px;font-weight:500;border-radius:999px;padding:8px 14px;min-height:40px;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;cursor:pointer;flex:none;border:1px solid var(--cE3E0D9);background:var(--cFFFFFF);color:var(--c111111)}
.cel .tag{font-size:12px;font-weight:500;padding:3px 9px;border-radius:999px;white-space:nowrap;font-variant-numeric:tabular-nums}
.cel .btn{font:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:999px;padding:12px 18px;min-height:46px;font-size:14px;font-weight:500;background:var(--c111111);color:var(--cFFFFFF);cursor:pointer;white-space:nowrap;box-sizing:border-box}
.cel .btn:hover{color:var(--cFFFFFF)}
.cel .btn-soft{font:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--cE3E0D9);border-radius:999px;padding:12px 18px;min-height:46px;font-size:14px;font-weight:500;background:var(--cFFFFFF);color:var(--c111111);cursor:pointer;white-space:nowrap;box-sizing:border-box}
.cel .sec{margin:0;font-size:16px;font-weight:600}
.cel .campo{font:inherit;font-size:16px;padding:12px 14px;border-radius:14px;border:1px solid var(--cDEDBD4);background:var(--cFFFFFF);color:var(--c111111);min-height:48px;box-sizing:border-box;width:100%}
.cel .campo:focus{outline:2px solid var(--cB27621);outline-offset:1px;border-color:var(--cB27621)}
.cel .busca{display:flex;align-items:center;gap:10px;padding:0 6px 0 16px;min-height:50px;border-radius:999px;background:var(--cF3F1EC);color:var(--c6B6A66)}
.cel .busca input{all:unset;flex:1;min-width:0;font-size:16px;color:var(--c111111)}
.cel .linha{display:flex;align-items:center;justify-content:space-between;gap:12px}
.cel .num{font-variant-numeric:tabular-nums}
.cel a.btn{color:var(--cFFFFFF)}
.cel .seg:focus-visible,.cel .chip:focus-visible,.cel .btn:focus-visible,.cel .btn-soft:focus-visible{outline:2px solid var(--cB27621);outline-offset:2px}
