/* ====== URAH mobile-base (21/10/2026) ======
   Carregado por ULTIMO em todas as paginas (depois do CSS proprio da pagina e dos <style> da pagina).
   Base do celular: tema claro sempre, margens, texto, alvos de toque, foco, movimento, tabelas largas,
   barra fixa do rodape (.bf), botao "Testar 14 dias" no cabecalho (.h58-teste) e correcoes pontuais.
   Papelada passada a limpo: folha branca, linhas finas, cantos de 4 px, sem sombra. */

/* ---------- tema claro sempre (o escuro forcado do Android escondia o logo) ---------- */
:root{color-scheme:only light;--mb-hdr:61px;--mb-bar:56px;--mb-gutter:16px}
@media (min-width:391px){:root{--mb-gutter:20px}}
@media (min-width:1280px){:root{--mb-hdr:73px}}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--mb-hdr) + 8px)}
body{background:#fff}

/* ---------- texto: corpo de 16 a 17 px, linha 1,58; titulos fluidos ---------- */
/* (so no celular: o computador e o tablet ficam como estavam) */
@media (max-width:767.98px){
  body{font-size:clamp(16px,15.2px + .25vw,17px);line-height:1.58}
  h1{font-size:clamp(1.75rem,1.2rem + 2.2vw,2.6rem)!important}
  main h2{font-size:clamp(1.4rem,1.1rem + 1.3vw,1.9rem)}
  /* coluna de leitura de texto corrido: no maximo 38 em */
  .article>p,.article>ul,.article>ol,.article>h2,.article>h3,.article>blockquote{max-width:38em}
}

/* ---------- margens laterais: 16 px (20 px acima de 390 px), sem rolagem lateral em 320 px ---------- */
@media (max-width:767.98px){
  .container{padding-left:var(--mb-gutter)!important;padding-right:var(--mb-gutter)!important}
  .h58-in,.h58-sheet-top{padding-left:var(--mb-gutter);padding-right:var(--mb-gutter)}
  html,body{overflow-x:clip}
  img,video,iframe,svg{max-width:100%}
  pre,code{white-space:pre-wrap;overflow-wrap:anywhere}
}
/* iPhone deitado: nada fica embaixo do entalhe (viewport-fit=cover) */
@supports (padding:max(0px)){
  body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
}

/* ---------- 100dvh no lugar de 100vh (barra de endereco do celular) ---------- */
@supports (height:100dvh){
  .h58-mega{max-height:calc(100dvh - 80px)}
}

/* ---------- foco sempre visivel ---------- */
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--azul,#1f4bb8)!important;outline-offset:2px}
main a:focus-visible,.site-footer a:focus-visible{outline:2px solid var(--azul,#1f4bb8)!important;outline-offset:2px;border-radius:2px}

/* ---------- toque ---------- */
a,button,summary,label,input,select,textarea,.btn{touch-action:manipulation}
a,button,summary{-webkit-tap-highlight-color:rgba(31,75,184,.14)}

/* alvos de toque de pelo menos 44 px, com 8 px entre eles (celular; o tablet fica como estava) */
@media (max-width:767.98px){
  .site-footer .f6-col{display:flex;flex-direction:column;gap:8px}
  .site-footer .f6-col a{display:flex!important;align-items:center;min-height:44px;font-size:14px!important;line-height:1.3}
  .site-footer .f6-col h4{margin-bottom:0!important}
  .site-footer .f6-line,.site-footer .f6-tag{font-size:14px!important}
  .site-footer .f6-bottom{font-size:13px}
  .site-footer .brand{display:inline-flex;align-items:center;min-height:44px}
  main .btn{min-height:44px}
  .bk-seg a,.hl-link,.h5-nlink,.h5-final-link,.post-cta-link{min-height:44px;display:inline-flex;align-items:center}
  .h5-cnames a{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center}
  .bl-f,.pr2-tab,.pr2-b{min-height:44px}
  .pp-menu-in a{min-height:44px;display:inline-flex;align-items:center}
  .pp-menu-in{gap:8px}
  main input:not([type=checkbox]):not([type=radio]):not([type=hidden]),main select{min-height:44px}
  .ck-item,main label.form-check{min-height:44px;align-items:center}
  main a.back{display:inline-flex;align-items:center;min-height:44px}
  /* link sozinho numa linha (fontes do artigo): area de toque maior sem mexer no texto */
  .article p>a:only-child{padding:12px 0}
}

/* ---------- etiquetas pequenas: nada abaixo de 13 px no celular ---------- */
@media (max-width:767.98px){
  main small,.sb-st,.pr2-badge,.badge,.shot-url,.bl-art span{font-size:13px!important}
}

/* ---------- movimento ---------- */
#snow-loader:not(.on) .sl-logo{animation:none!important}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  #snow-loader .sl-logo{animation:none!important}
}
/* a capa do artigo e a foto de abertura nao entram com efeito (sao o maior elemento da primeira tela) */
.post-cover img,.sb-banner img{opacity:1!important;transform:none!important;transition:none!important}

/* ---------- sem hover preso no toque ---------- */
@media (hover:none){
  .h5-cnames img{filter:none!important;opacity:1!important}
  .wa-float:hover{transform:none}
  .btn-navy:hover,.btn-gold:hover,.btn-primary:hover,.btn-sky:hover{background:var(--azul)!important}
  .btn-light:hover,.h5-final-btn:hover,.pr-final-btn:hover{background:#fff!important}
  .h58-btn--line:hover{background:#fff}
  .h58 .h58-btn--fill:hover{background:var(--azul);border-color:var(--azul)}
  .h58-link:hover,.h58-trig:hover,.h58-col a:hover,.h58-ttl:hover,.h58-login:hover{text-decoration:none}
  .h58-panel>a:hover,.h58-pl a:hover{background:transparent}
  .f6-col a:hover{color:var(--sec)!important}
  .h58-link:active,.h58-trig:active,.h58-panel>a:active,.h58-pl a:active{background:var(--papel2)}
}
@media (hover:none) and (max-width:1279.98px){
  .h58-link:hover,.h58-trig:hover{background:#fff;color:var(--tinta)}
}

/* ---------- tabelas largas: rolam so dentro do quadro, com aviso curto ---------- */
.pr2-tblwrap,.lg-tblwrap,.cmp-wrap,.cp-scroll,.h5-card--cmp{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.mb-rola{position:relative}
.mb-rola::before{content:"Deslize a tabela para o lado para ver tudo.";position:sticky;left:0;display:block;padding:8px 12px;
  font:500 13px/1.3 var(--font);color:var(--sec);background:var(--papel2);border-bottom:1px solid var(--regua)}
.mb-rola:focus-visible{outline:2px solid var(--azul);outline-offset:2px}

/* ---------- correcoes pontuais ---------- */
/* /sobre: a etiqueta "Novembro de 2026" ficava branca sobre branco no cartao em destaque */
@media (max-width:960px){.sb-p--on .sb-st{background:#fff!important;color:var(--sec)!important;border:1px solid var(--regua)!important}}

/* ---------- cabecalho: "Testar 14 dias" ao lado do "Menu" ---------- */
.h58-teste{display:none}
@media (max-width:1279.98px){
  .h58 .h58-teste{display:inline-flex;align-items:center;justify-content:center;margin-left:auto;min-height:44px;padding:0 12px;
    border:1px solid var(--azul);border-radius:4px;background:var(--azul);color:#fff;font:600 15px/1 var(--font);white-space:nowrap}
  .h58 .h58-teste:active{background:var(--azul-esc)}
  .h58-teste+.h58-menubtn{margin-left:8px}
  .h58-teste-l{display:none}
}
@media (min-width:768px) and (max-width:1279.98px){
  .h58-teste-c{display:none}
  .h58-teste-l{display:inline}
}
@media (max-width:359.98px){
  .h58 .h58-teste{display:none}
  .h58-teste+.h58-menubtn{margin-left:auto}
}
@media (hover:hover){.h58 .h58-teste:hover{background:var(--azul-esc);border-color:var(--azul-esc);color:#fff}}

/* ---------- barra fixa unica do rodape (celular) ---------- */
.bf{display:none}
@media (max-width:767.98px){
  /* a bolha verde do WhatsApp e a barra azul antiga saem do celular */
  .wa-float,.m-cta{display:none!important}
  .bf{display:flex;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:58;box-sizing:border-box;
    height:calc(var(--mb-bar) + env(safe-area-inset-bottom));
    padding:6px max(var(--mb-gutter),env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(var(--mb-gutter),env(safe-area-inset-left));
    background:#fff;border-top:1px solid var(--regua);
    transform:translateY(100%);visibility:hidden;transition:transform .2s ease,visibility 0s linear .2s}
  .bf.on{transform:none;visibility:visible;transition:transform .2s ease,visibility 0s}
  .bf a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 8px;border-radius:4px;text-align:center;
    font:600 15px/1.2 var(--font);text-decoration:none;border:1px solid var(--azul)}
  .bf .bf-a{flex:2 1 0;background:var(--azul);color:#fff}
  .bf .bf-wa{flex:1 1 0;background:#fff;color:var(--azul)}
  .bf .bf-a:active{background:var(--azul-esc)}
  .bf .bf-wa:active{background:var(--celula)}
  /* o fim da pagina (rodape do site) fica visivel por cima da barra; o campo em foco nunca fica embaixo dela */
  body.bf-pag{padding-bottom:calc(var(--mb-bar) + env(safe-area-inset-bottom))!important}
  html.bf-on{scroll-padding-bottom:calc(var(--mb-bar) + 16px + env(safe-area-inset-bottom))}
  body.menu-open .bf{display:none!important}
}
@media (max-width:767.98px) and (prefers-reduced-motion:reduce){
  .bf,.bf.on{transition:none}
}
@media print{.bf,.wa-float,.m-cta,#snow-loader{display:none!important}}