/* ═══════════════════════════════════════════════════════════════════
   BRAXIL — Portal e app do cliente · design system
   Mesma linguagem do site (ipbraxil.com.br): branco institucional, verde
   da marca, dourado dos certificados, títulos em serifa editorial.
   Um único arquivo para portal (/cliente) e app (app.ipbraxil.com.br).
   Sem Bootstrap. Ícones: Remix Icon.
   ═══════════════════════════════════════════════════════════════════ */

:root {
  /* Base */
  --papel:        #FFFFFF;
  --areia:        #F7F8F6;
  --areia-2:      #EFF2EE;
  --tinta:        #10241C;
  --tinta-media:  #4A5A53;
  --tinta-fraca:  #66756E;   /* 4,8:1 no branco (antes #7D8C85, 3,5:1) */
  --linha:        #E2E7E3;
  --linha-forte:  #CDD6D0;

  /* Marca */
  --verde:        #0E6B3F;
  --verde-escuro: #08472A;
  --verde-claro:  #E8F3EC;
  --verde-borda:  #C6E2D1;
  --verde-vivo:   #16A05C;

  /* Selo / certificado */
  --ouro:         #A9852F;
  --ouro-escuro:  #7A5F1C;
  --ouro-claro:   #FBF6E9;
  --ouro-borda:   #EBDCB4;

  /* Estados */
  --alerta:       #B4471F;
  --alerta-claro: #FDF1EC;
  --alerta-borda: #F2D5C8;
  --info:         #2F5D8C;
  --info-claro:   #EEF3F8;
  --info-borda:   #D3DFEB;

  /* Tipografia */
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --sans:  "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --mono:  ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --t-xs: .75rem; --t-sm: .875rem; --t-base: 1rem; --t-md: 1.125rem;
  --t-lg: 1.375rem; --t-xl: 1.75rem; --t-2xl: 2.125rem;

  /* Forma */
  --raio: 6px;
  --raio-sm: 4px;
  --raio-lg: 10px;
  --sombra: 0 1px 2px rgba(16,36,28,.05), 0 8px 24px -14px rgba(8,71,42,.22);
  --sombra-alta: 0 22px 54px -18px rgba(8,71,42,.38);
  --lateral: 264px;
  --topo: 64px;
  --abas: 64px;
  --seguro-b: env(safe-area-inset-bottom, 0px);

  /* Aliases do tema antigo (páginas e o assistente ainda usam estes nomes) */
  --bg: var(--areia); --bg-card: var(--papel); --bg-card-2: var(--areia);
  --card: var(--papel); --card-2: var(--areia); --surface: var(--papel);
  --border: var(--linha); --border-hover: var(--linha-forte); --line: var(--linha); --line-2: var(--linha-forte);
  --text: var(--tinta); --text-2: var(--tinta-media); --text-3: var(--tinta-fraca);
  --muted: var(--tinta-fraca); --soft: var(--tinta-media);
  --primary: var(--verde); --primary-2: var(--verde-escuro);
  --success: var(--verde-vivo); --warning: var(--ouro); --danger: var(--alerta); --info-old: var(--info);
  --radius-md: var(--raio); --radius-sm: var(--raio); --radius-xs: var(--raio-sm); --radius-lg: var(--raio-lg);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
body {
  margin: 0; background: var(--areia); color: var(--tinta);
  font-family: var(--sans); font-size: var(--t-base); line-height: 1.55;
  -webkit-font-smoothing: antialiased; font-variant-numeric: tabular-nums;
}
h1, h2, h3, h4 {
  font-family: var(--serif); font-weight: 600; line-height: 1.2;
  letter-spacing: -.012em; margin: 0 0 .45em; color: var(--tinta); text-wrap: balance;
}
h1 { font-size: var(--t-xl); }
h2 { font-size: var(--t-lg); }
h3 { font-size: var(--t-md); }
h4 { font-size: var(--t-base); }
p { margin: 0 0 .9em; }
a { color: var(--verde); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--verde-escuro); }
img { max-width: 100%; height: auto; }
small { font-size: var(--t-sm); }
hr { border: 0; border-top: 1px solid var(--linha); margin: 18px 0; }
:focus-visible { outline: 2.5px solid var(--verde-vivo); outline-offset: 2px; border-radius: 2px; }
::selection { background: var(--verde-claro); }
[hidden] { display: none !important; }

.bx-skip { position: absolute; left: -9999px; top: 0; background: var(--verde); color: #fff; padding: 10px 18px; z-index: 500; }
.bx-skip:focus { left: 8px; top: 8px; }

/* ═══ SHELL ═══════════════════════════════════════════════════════ */
.bx-side {
  position: fixed; inset: 0 auto 0 0; width: var(--lateral); z-index: 60;
  background: var(--papel); border-right: 1px solid var(--linha);
  display: flex; flex-direction: column;
}
.bx-marca { display: flex; align-items: center; gap: 10px; padding: 18px 22px; text-decoration: none; height: var(--topo); border-bottom: 1px solid var(--linha); }
.bx-marca img { height: 34px; width: auto; }
.bx-marca span { font-family: var(--serif); font-size: 1.35rem; font-weight: 600; color: var(--verde-escuro); letter-spacing: -.02em; }
.bx-marca small { display: block; font-family: var(--sans); font-size: .68rem; font-weight: 650; color: var(--ouro-escuro); letter-spacing: .08em; text-transform: uppercase; margin-top: -2px; }

.bx-nav { flex: 1; overflow-y: auto; padding: 10px 12px 18px; }
.bx-nav-sec { font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--tinta-fraca); padding: 14px 12px 5px; }
.bx-nav-link {
  display: flex; align-items: center; gap: 11px; padding: 8px 12px; border-radius: var(--raio);
  color: var(--tinta-media); text-decoration: none; font-size: var(--t-sm); font-weight: 550;
  position: relative; transition: background-color .15s, color .15s;
}
.bx-nav-link i { font-size: 1.15rem; color: var(--tinta-fraca); width: 20px; text-align: center; transition: color .15s; }
.bx-nav-link:hover { background: var(--areia); color: var(--tinta); }
.bx-nav-link.is-ativo { background: var(--verde-claro); color: var(--verde-escuro); font-weight: 650; }
.bx-nav-link.is-ativo i { color: var(--verde); }
.bx-nav-link.is-ativo::before { content: ""; position: absolute; left: -12px; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: var(--verde); }
.bx-nav-link .contador { margin-left: auto; }

.bx-side-pe { padding: 14px; border-top: 1px solid var(--linha); }
.bx-ajuda { display: flex; gap: 10px; align-items: center; padding: 12px; border-radius: var(--raio); background: var(--areia); text-decoration: none; color: var(--tinta); border: 1px solid var(--linha); }
.bx-ajuda:hover { border-color: var(--verde-borda); background: var(--verde-claro); color: var(--tinta); }
.bx-ajuda i { font-size: 1.4rem; color: #1FAA56; }
.bx-ajuda strong { display: block; font-size: var(--t-sm); }
.bx-ajuda span { font-size: var(--t-xs); color: var(--tinta-media); }

.bx-main { margin-left: var(--lateral); min-height: 100vh; display: flex; flex-direction: column; }
.bx-top {
  position: sticky; top: 0; z-index: 50; height: var(--topo);
  background: rgba(255,255,255,.94); backdrop-filter: saturate(160%) blur(10px);
  border-bottom: 1px solid var(--linha); display: flex; align-items: center; gap: 12px; padding: 0 28px;
}
.bx-top-marca { display: none; align-items: center; gap: 8px; text-decoration: none; }
.bx-top-marca img { height: 30px; width: auto; }
.bx-top-marca span { font-family: var(--serif); font-size: 1.2rem; font-weight: 600; color: var(--verde-escuro); }
.bx-top-titulo { font-size: var(--t-sm); color: var(--tinta-media); font-weight: 550; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bx-top-titulo b { color: var(--tinta); font-weight: 650; }
.bx-top-acoes { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.bx-icone-btn {
  position: relative; width: 40px; height: 40px; border-radius: 50%; border: 1px solid transparent;
  display: inline-flex; align-items: center; justify-content: center; background: none; color: var(--tinta-media);
  cursor: pointer; text-decoration: none; font-size: 1.25rem;
}
.bx-icone-btn:hover { background: var(--areia); color: var(--tinta); }
.bx-icone-btn .ponto { position: absolute; top: 1px; right: -2px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: var(--alerta); color: #fff; font-size: .62rem; font-weight: 700; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; }

.bx-conta { position: relative; }
.bx-conta-btn { display: flex; align-items: center; gap: 9px; padding: 4px 10px 4px 4px; border-radius: 99px; border: 1px solid var(--linha); background: #fff; cursor: pointer; font: inherit; color: var(--tinta); }
.bx-conta-btn:hover { border-color: var(--linha-forte); }
.bx-conta-btn .nome { font-size: var(--t-sm); font-weight: 600; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bx-conta-btn i { color: var(--tinta-fraca); }
.bx-menu {
  position: absolute; right: 0; top: calc(100% + 8px); width: 280px; z-index: 80;
  background: #fff; border: 1px solid var(--linha); border-radius: var(--raio-lg); box-shadow: var(--sombra-alta);
  padding: 6px; display: none;
}
.bx-menu.is-aberto { display: block; animation: surgir .14s ease; }
.bx-menu-cab { padding: 10px 10px 12px; border-bottom: 1px solid var(--linha); margin-bottom: 6px; }
.bx-menu-cab strong { display: block; font-size: var(--t-sm); }
.bx-menu-cab span { font-size: var(--t-xs); color: var(--tinta-media); word-break: break-all; }
.bx-menu-rot { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--tinta-fraca); padding: 8px 10px 4px; }
.bx-menu a, .bx-menu button.bx-menu-item {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border-radius: var(--raio);
  color: var(--tinta); text-decoration: none; font-size: var(--t-sm); background: none; border: 0; cursor: pointer; font-family: inherit; text-align: left;
}
.bx-menu a:hover, .bx-menu button.bx-menu-item:hover { background: var(--areia); }
.bx-menu a i, .bx-menu button.bx-menu-item i { color: var(--tinta-fraca); font-size: 1.05rem; }
.bx-menu .sair { color: var(--alerta); }
.bx-menu .sair i { color: var(--alerta); }
.bx-menu small { display: block; font-size: var(--t-xs); color: var(--tinta-fraca); }

.bx-page { width: 100%; max-width: 1180px; margin: 0 auto; padding: 30px 28px 64px; flex: 1; }
.bx-rodape { max-width: 1180px; margin: 0 auto; width: 100%; padding: 0 28px 28px; font-size: var(--t-xs); color: var(--tinta-fraca); display: flex; gap: 14px; flex-wrap: wrap; justify-content: space-between; }
.bx-rodape a { color: var(--tinta-fraca); }

/* Barra inferior (celular) e folha "Mais" */
.bx-abas { display: none; }
.bx-folha-fundo { position: fixed; inset: 0; background: rgba(16,36,28,.42); z-index: 90; display: none; }
.bx-folha-fundo.is-aberto { display: block; animation: aparecer .15s ease; }
.bx-folha {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 95; background: #fff;
  border-radius: 16px 16px 0 0; box-shadow: 0 -18px 40px -16px rgba(8,71,42,.35);
  padding: 8px 16px calc(18px + var(--seguro-b)); max-height: 86vh; overflow-y: auto;
  transform: translateY(105%); transition: transform .22s ease; visibility: hidden;
}
.bx-folha.is-aberto { transform: none; visibility: visible; }
.bx-folha-alca { width: 40px; height: 4px; border-radius: 3px; background: var(--linha-forte); margin: 6px auto 12px; }
.bx-folha h3 { font-size: var(--t-md); margin: 4px 4px 10px; }
.bx-folha-grade { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.bx-folha-grade a {
  display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center;
  padding: 14px 6px; border-radius: var(--raio); border: 1px solid var(--linha); text-decoration: none;
  color: var(--tinta); font-size: var(--t-xs); font-weight: 600; position: relative;
}
.bx-folha-grade a i { font-size: 1.45rem; color: var(--verde); }
.bx-folha-grade a.is-ativo { background: var(--verde-claro); border-color: var(--verde-borda); }
.bx-folha-grade a .contador { position: absolute; top: 6px; right: 6px; }
.bx-folha-lista a { display: flex; align-items: center; gap: 12px; padding: 13px 6px; border-bottom: 1px solid var(--linha); color: var(--tinta); text-decoration: none; font-weight: 600; font-size: var(--t-sm); }
.bx-folha-lista a:last-child { border-bottom: 0; }
.bx-folha-lista a i { font-size: 1.3rem; color: var(--verde); width: 26px; }
.bx-folha-lista a span { display: block; font-weight: 400; color: var(--tinta-media); font-size: var(--t-xs); }

/* ═══ PÁGINA ═════════════════════════════════════════════════════ */
.pagina-cab { display: flex; align-items: flex-end; gap: 16px 24px; justify-content: space-between; flex-wrap: wrap; margin-bottom: 24px; }
.pagina-cab h1 { margin: 0; font-size: var(--t-xl); }
.pagina-cab p { margin: 4px 0 0; color: var(--tinta-media); max-width: 70ch; }
.pagina-cab .acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.voltar { display: inline-flex; align-items: center; gap: 6px; font-size: var(--t-sm); color: var(--tinta-media); text-decoration: none; margin-bottom: 10px; font-weight: 550; }
.voltar:hover { color: var(--verde); }
.secao-titulo { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 30px 0 12px; }
.secao-titulo h2 { font-size: var(--t-lg); margin: 0; }
.secao-titulo a { font-size: var(--t-sm); font-weight: 600; text-decoration: none; }

.pilha > * + * { margin-top: 16px; }
.grade { display: grid; gap: 16px; }
.grade-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grade-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grade-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grade-auto { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.grade-lateral { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; }

/* ═══ CARTÃO ═════════════════════════════════════════════════════ */
.cartao { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio-lg); box-shadow: 0 1px 2px rgba(16,36,28,.04); }
.cartao-cab { display: flex; align-items: center; gap: 12px; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--linha); }
.cartao-cab h2, .cartao-cab h3, .cartao-titulo { margin: 0; font-size: var(--t-md); font-family: var(--serif); font-weight: 600; display: flex; align-items: center; gap: 8px; }
.cartao-cab h2 i, .cartao-cab h3 i, .cartao-titulo i { color: var(--verde); font-size: 1.1em; }
.cartao-cab a { font-size: var(--t-sm); font-weight: 600; text-decoration: none; }
.cartao-corpo { padding: 18px 20px; }
.cartao-corpo > :last-child { margin-bottom: 0; }
.cartao-rodape { padding: 14px 20px; border-top: 1px solid var(--linha); display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; background: #FCFDFC; border-radius: 0 0 var(--raio-lg) var(--raio-lg); }
.cartao--destaque { border-left: 3px solid var(--ouro); }
.cartao--verde { background: var(--verde-escuro); border-color: var(--verde-escuro); color: #fff; position: relative; overflow: hidden; }
.cartao--verde h2, .cartao--verde h3 { color: #fff; }
.cartao--verde p { color: rgba(255,255,255,.82); }
.cartao--verde::after { content: ""; position: absolute; right: -80px; top: -120px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, rgba(22,160,92,.38), transparent 66%); pointer-events: none; }
.cartao--link { display: block; text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s; }
.cartao--link:hover { border-color: var(--verde-borda); box-shadow: var(--sombra); color: inherit; }

/* Números (como na landing: régua dourada em cima) */
.numeros { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.numero { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio-lg); padding: 16px 18px; text-decoration: none; color: inherit; display: block; position: relative; overflow: hidden; }
.numero::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--ouro); opacity: .85; }
.numero strong { display: block; font-family: var(--serif); font-size: 1.85rem; font-weight: 600; color: var(--verde-escuro); line-height: 1.1; }
.numero span { font-size: var(--t-sm); color: var(--tinta-media); }
.numero small { display: block; margin-top: 6px; font-size: var(--t-xs); color: var(--tinta-fraca); }
a.numero:hover { border-color: var(--verde-borda); box-shadow: var(--sombra); }
.numero--alerta::before { background: var(--alerta); }
.numero--alerta strong { color: var(--alerta); }
.numero--valor strong { font-size: 1.45rem; }

/* ═══ BOTÕES ═════════════════════════════════════════════════════ */
.btn, .btn-braxil {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--sans); font-size: var(--t-sm); font-weight: 650; line-height: 1;
  padding: 11px 18px; min-height: 42px; border-radius: var(--raio); border: 1.5px solid transparent;
  cursor: pointer; text-decoration: none; white-space: nowrap;
  transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s;
  background: var(--papel); color: var(--verde); border-color: var(--linha);
}
.btn i, .btn-braxil i { font-size: 1.1em; }
.btn:hover, .btn-braxil:hover { border-color: var(--verde); color: var(--verde-escuro); }
.btn--principal, .btn-primary-b { background: var(--verde); color: #fff; border-color: var(--verde); }
.btn--principal:hover, .btn-primary-b:hover { background: var(--verde-escuro); border-color: var(--verde-escuro); color: #fff; }
.btn--contorno, .btn-outline-b { background: var(--papel); color: var(--verde); border-color: var(--linha); }
.btn--fantasma, .btn-ghost-b { background: transparent; border-color: transparent; color: var(--tinta-media); }
.btn--fantasma:hover, .btn-ghost-b:hover { background: var(--areia); color: var(--tinta); border-color: transparent; }
.btn--ouro { background: #8F6E22; border-color: #8F6E22; color: #fff; }   /* ouro um tom abaixo: texto branco legível (4,7:1) */
.btn--ouro:hover { background: var(--ouro-escuro); border-color: var(--ouro-escuro); color: #fff; }
.btn--perigo, .btn-danger-b { background: var(--papel); color: var(--alerta); border-color: var(--alerta-borda); }
.btn--perigo:hover, .btn-danger-b:hover { background: var(--alerta-claro); border-color: var(--alerta); color: var(--alerta); }
.btn--whats { background: #15803D; border-color: #15803D; color: #fff; }
.btn--whats:hover { background: #126B33; border-color: #126B33; color: #fff; }
.btn-success-b { background: var(--verde-vivo); border-color: var(--verde-vivo); color: #fff; }
.btn--claro { background: #fff; color: var(--verde-escuro); border-color: #fff; }
.btn--claro:hover { background: var(--verde-claro); color: var(--verde-escuro); border-color: var(--verde-claro); }
.btn--pequeno, .btn-sm-b { padding: 7px 12px; min-height: 34px; font-size: var(--t-xs); }
.btn--grande, .btn-lg-b { padding: 15px 26px; min-height: 52px; font-size: var(--t-base); }
.btn--bloco, .btn-block-b { width: 100%; }
.btn--icone { width: 40px; min-height: 40px; padding: 0; }
.btn[disabled], .btn.is-carregando, .btn-braxil[disabled] { opacity: .55; cursor: not-allowed; pointer-events: none; }
.btn.is-carregando::after { content: ""; width: 14px; height: 14px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: girar .7s linear infinite; }
.botoes { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* ═══ SELOS, CONTADORES, CHIPS ══════════════════════════════════ */
.selo, .status-pill, .badge-braxil {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 99px;
  font-size: .75rem; font-weight: 650; line-height: 1.35; border: 1px solid var(--linha);
  background: var(--areia); color: var(--tinta-media); white-space: nowrap; max-width: 100%;
}
.selo::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .75; flex-shrink: 0; }
.selo--sem-ponto::before { display: none; }
.selo--ok, .status-approved, .badge-success { background: var(--verde-claro); color: var(--verde-escuro); border-color: var(--verde-borda); }
.selo--atencao, .status-pending, .badge-warning { background: var(--ouro-claro); color: var(--ouro-escuro); border-color: var(--ouro-borda); }
.selo--erro, .status-danger, .badge-danger { background: var(--alerta-claro); color: var(--alerta); border-color: var(--alerta-borda); }
.selo--info, .status-info, .badge-info { background: var(--info-claro); color: var(--info); border-color: var(--info-borda); }
.selo--neutro, .status-muted, .badge-muted { background: var(--areia); color: var(--tinta-media); border-color: var(--linha); }
.selo--ouro { background: var(--ouro-claro); color: var(--ouro-escuro); border-color: var(--ouro-borda); }
.selo--quebra { white-space: normal; text-align: left; }
.contador { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--alerta); color: #fff; font-size: .68rem; font-weight: 700; }
.contador--verde { background: var(--verde); }
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 99px; font-size: var(--t-xs); font-weight: 650; background: var(--verde-claro); border: 1px solid var(--verde-borda); color: var(--verde-escuro); }
.chip button { border: 0; background: none; cursor: pointer; color: inherit; opacity: .6; font-size: 15px; line-height: 1; padding: 0 1px; min-width: 22px; min-height: 22px; display: inline-flex; align-items: center; justify-content: center; }
.chip button:hover { opacity: 1; }
.etiqueta { display: inline-block; font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 2px 7px; border-radius: 3px; background: var(--areia); border: 1px solid var(--linha); color: var(--tinta-media); }
.etiqueta--ouro { background: var(--ouro-claro); border-color: var(--ouro-borda); color: var(--ouro-escuro); }
.etiqueta--verde { background: var(--verde-claro); border-color: var(--verde-borda); color: var(--verde-escuro); }
.ncl { display: inline-block; font-family: var(--mono); font-size: .75rem; font-weight: 600; padding: 2px 7px; border-radius: 3px; background: var(--areia); border: 1px solid var(--linha); color: var(--tinta-media); }

/* ═══ AVISOS ═════════════════════════════════════════════════════ */
.aviso, .alert-braxil { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: var(--raio); border: 1px solid var(--linha); background: var(--papel); color: var(--tinta); font-size: var(--t-sm); margin-bottom: 16px; }
.aviso > i, .alert-braxil > i { font-size: 1.25rem; line-height: 1.2; flex-shrink: 0; }
.aviso strong { display: block; margin-bottom: 2px; font-size: var(--t-sm); }
.aviso p { margin: 0; }
.aviso > div:not(.acoes), .aviso > p { flex: 1 1 200px; min-width: 0; }
.aviso .acoes { margin-left: auto; display: flex; gap: 8px; flex-shrink: 0; align-self: center; }
.aviso--ok, .alert-succ-b { background: var(--verde-claro); border-color: var(--verde-borda); color: var(--verde-escuro); }
.aviso--atencao, .alert-warn-b { background: var(--ouro-claro); border-color: var(--ouro-borda); color: #5E4813; }
.aviso--erro, .alert-dang-b { background: var(--alerta-claro); border-color: var(--alerta-borda); color: var(--alerta); }
.aviso--info, .alert-info-b { background: var(--info-claro); border-color: var(--info-borda); color: #22476C; }

/* ═══ LISTA (linhas clicáveis, ótimas no celular) ═══════════════ */
.lista { list-style: none; margin: 0; padding: 0; }
.lista-item { display: flex; align-items: center; gap: 14px; padding: 14px 20px; border-bottom: 1px solid var(--linha); text-decoration: none; color: inherit; position: relative; }
.lista-item:last-child { border-bottom: 0; }
a.lista-item:hover, button.lista-item:hover { background: #FAFBFA; color: inherit; }
button.lista-item { width: 100%; background: none; border-left: 0; border-right: 0; border-top: 0; font: inherit; text-align: left; cursor: pointer; }
.lista-icone { width: 40px; height: 40px; border-radius: var(--raio); flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; background: var(--verde-claro); color: var(--verde); }
.lista-icone--ouro { background: var(--ouro-claro); color: var(--ouro-escuro); }
.lista-icone--alerta { background: var(--alerta-claro); color: var(--alerta); }
.lista-icone--info { background: var(--info-claro); color: var(--info); }
.lista-icone--neutro { background: var(--areia); color: var(--tinta-media); }
.lista-corpo { flex: 1; min-width: 0; }
.lista-titulo { display: block; font-weight: 650; font-size: var(--t-sm); color: var(--tinta); overflow-wrap: anywhere; }
.lista-sub { display: block; font-size: var(--t-xs); color: var(--tinta-media); margin-top: 2px; overflow-wrap: anywhere; }
.lista-lado { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex-shrink: 0; text-align: right; }
.lista-seta { color: var(--tinta-fraca); font-size: 1.2rem; flex-shrink: 0; }

/* Logo de marca (miniatura) */
.logo-marca { width: 52px; height: 52px; border-radius: var(--raio); background: var(--areia); border: 1px solid var(--linha); flex-shrink: 0; display: flex; align-items: center; justify-content: center; overflow: hidden; font-family: var(--serif); font-weight: 600; color: var(--verde-escuro); font-size: 1.05rem; }
.logo-marca img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.logo-marca--grande { width: 96px; height: 96px; font-size: 1.8rem; }
.avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--verde); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: .85rem; flex-shrink: 0; }

/* ═══ TABELA (vira cartões no celular via data-rotulo) ══════════ */
.tabela-envolve, .table-responsive { width: 100%; overflow-x: auto; }
.tabela, .braxil-table { width: 100%; border-collapse: collapse; font-size: var(--t-sm); }
.tabela thead th, .braxil-table thead th { text-align: left; font-weight: 650; color: var(--tinta-media); font-size: var(--t-xs); padding: 10px 16px; border-bottom: 1.5px solid var(--linha); white-space: nowrap; background: #FCFDFC; }
.tabela td, .braxil-table td { padding: 13px 16px; border-bottom: 1px solid var(--linha); vertical-align: middle; }
.tabela tbody tr:last-child td, .braxil-table tbody tr:last-child td { border-bottom: 0; }
.tabela tbody tr:hover td { background: #FAFBFA; }
.tabela .num { text-align: right; white-space: nowrap; }

/* ═══ FORMULÁRIOS ════════════════════════════════════════════════ */
.campo { display: block; margin-bottom: 16px; }
.campo > label, .campo-rotulo { display: block; font-size: var(--t-sm); font-weight: 650; color: var(--tinta); margin-bottom: 6px; }
.campo-dica { display: block; font-size: var(--t-xs); color: var(--tinta-fraca); margin-top: 5px; }
.entrada, .form-braxil input, .form-braxil select, .form-braxil textarea, .form-input, .form-control {
  width: 100%; font-family: var(--sans); font-size: var(--t-base); color: var(--tinta);
  padding: 11px 13px; min-height: 46px; border: 1.5px solid var(--linha); border-radius: var(--raio);
  background: var(--papel); transition: border-color .15s, box-shadow .15s;
}
textarea.entrada, .form-braxil textarea { min-height: 96px; resize: vertical; line-height: 1.5; }
.entrada:focus, .form-braxil input:focus, .form-braxil select:focus, .form-braxil textarea:focus, .form-input:focus, .form-control:focus { outline: none; border-color: var(--verde); box-shadow: 0 0 0 3px rgba(14,107,63,.12); }
.entrada::placeholder { color: var(--tinta-fraca); }
.entrada[disabled], .entrada[readonly] { background: var(--areia); color: var(--tinta-media); }
.form-braxil label { display: block; font-size: var(--t-sm); font-weight: 650; margin: 0 0 6px; }
.campo-linha { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.campo-icone { position: relative; }
.campo-icone > i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--tinta-fraca); font-size: 1.1rem; pointer-events: none; }
.campo-icone .entrada { padding-left: 40px; }
.busca-barra { display: flex; gap: 8px; flex-wrap: wrap; }
.busca-barra .campo-icone { flex: 1; min-width: 220px; }
.opcao { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1.5px solid var(--linha); border-radius: var(--raio); cursor: pointer; background: #fff; }
.opcao:hover { border-color: var(--linha-forte); }
.opcao input { margin-top: 3px; accent-color: var(--verde); }
.opcao.is-marcada, .opcao:has(input:checked) { border-color: var(--verde); background: var(--verde-claro); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--verde); }

/* ═══ ABAS ═══════════════════════════════════════════════════════ */
.abas { display: flex; gap: 4px; border-bottom: 1px solid var(--linha); margin-bottom: 20px; overflow-x: auto; scrollbar-width: none; }
.abas::-webkit-scrollbar { display: none; }
.aba { padding: 10px 14px; font-size: var(--t-sm); font-weight: 600; color: var(--tinta-media); text-decoration: none; border: 0; background: none; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; white-space: nowrap; display: inline-flex; align-items: center; gap: 7px; font-family: inherit; }
.aba:hover { color: var(--tinta); }
.aba.is-ativa { color: var(--verde-escuro); border-bottom-color: var(--verde); }
.filtros { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.filtro { padding: 6px 12px; border-radius: 99px; border: 1px solid var(--linha); background: #fff; font-size: var(--t-xs); font-weight: 650; color: var(--tinta-media); text-decoration: none; cursor: pointer; font-family: inherit; display: inline-flex; gap: 6px; align-items: center; }
.filtro:hover { border-color: var(--linha-forte); color: var(--tinta); }
.filtro.is-ativo { background: var(--verde-escuro); border-color: var(--verde-escuro); color: #fff; }
.filtro b { font-weight: 700; opacity: .75; }

/* ═══ VAZIO, CARREGANDO ══════════════════════════════════════════ */
.vazio, .empty-state { text-align: center; padding: 44px 22px; color: var(--tinta-media); }
.vazio > i, .empty-state > i { font-size: 2.2rem; color: var(--verde-borda); display: block; margin-bottom: 10px; }
.vazio h3 { margin-bottom: 6px; }
.vazio p { max-width: 46ch; margin: 0 auto 16px; font-size: var(--t-sm); }
.girando, .spinner-braxil { width: 22px; height: 22px; border: 2.5px solid var(--linha); border-top-color: var(--verde); border-radius: 50%; animation: girar .8s linear infinite; display: inline-block; vertical-align: middle; }
.carregando { text-align: center; padding: 34px 20px; color: var(--tinta-media); font-size: var(--t-sm); }
.carregando .girando { display: block; margin: 0 auto 10px; }
.esqueleto { background: linear-gradient(90deg, var(--areia) 25%, var(--areia-2) 37%, var(--areia) 63%); background-size: 400% 100%; animation: brilho 1.3s ease infinite; border-radius: var(--raio-sm); }

/* ═══ BARRA DE PROGRESSO, ETAPAS, LINHA DO TEMPO ═══════════════ */
.barra { height: 6px; border-radius: 4px; background: var(--areia-2); overflow: hidden; }
.barra > span { display: block; height: 100%; border-radius: 4px; background: var(--verde); }
.barra--ouro > span { background: var(--ouro); }
.barra--alerta > span { background: var(--alerta); }

.etapas { display: flex; gap: 0; list-style: none; margin: 0; padding: 0; counter-reset: etapa; }
.etapa { flex: 1; position: relative; padding-top: 30px; font-size: var(--t-xs); color: var(--tinta-fraca); text-align: center; font-weight: 600; }
.etapa::before { counter-increment: etapa; content: counter(etapa); position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 2px solid var(--linha-forte); color: var(--tinta-fraca); display: flex; align-items: center; justify-content: center; font-size: .7rem; z-index: 1; }
.etapa::after { content: ""; position: absolute; top: 11px; left: calc(-50% + 12px); right: calc(50% + 12px); height: 2px; background: var(--linha); }
.etapa:first-child::after { display: none; }
.etapa.is-feita { color: var(--verde-escuro); }
.etapa.is-feita::before { content: "✓"; background: var(--verde); border-color: var(--verde); color: #fff; }
.etapa.is-feita::after, .etapa.is-atual::after { background: var(--verde); }
.etapa.is-atual { color: var(--tinta); }
.etapa.is-atual::before { border-color: var(--verde); color: var(--verde); box-shadow: 0 0 0 4px var(--verde-claro); }

.linha-tempo { list-style: none; margin: 0; padding: 0; }
.lt-item { position: relative; padding: 0 0 20px 30px; }
.lt-item::before { content: ""; position: absolute; left: 7px; top: 18px; bottom: 0; width: 2px; background: var(--linha); }
.lt-item:last-child::before { display: none; }
.lt-ponto { position: absolute; left: 0; top: 4px; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 3px solid var(--linha-forte); }
.lt-item.is-atual .lt-ponto { border-color: var(--verde); background: var(--verde); box-shadow: 0 0 0 4px var(--verde-claro); }
.lt-item--ok .lt-ponto { border-color: var(--verde-vivo); }
.lt-item--atencao .lt-ponto { border-color: var(--ouro); }
.lt-item--erro .lt-ponto { border-color: var(--alerta); }
.lt-data { font-size: var(--t-xs); color: var(--tinta-fraca); font-weight: 600; }
.lt-titulo { font-weight: 650; font-size: var(--t-sm); margin: 2px 0; }
.lt-texto { font-size: var(--t-sm); color: var(--tinta-media); }

/* Pares rótulo/valor */
.dados { display: grid; grid-template-columns: minmax(110px, 38%) 1fr; gap: 8px 14px; margin: 0; font-size: var(--t-sm); }
.dados dt { color: var(--tinta-fraca); font-weight: 550; }
.dados dd { margin: 0; color: var(--tinta); font-weight: 600; overflow-wrap: anywhere; }
.valor-grande { font-family: var(--serif); font-size: 2rem; font-weight: 600; color: var(--verde-escuro); line-height: 1.1; }

/* ═══ MODAL ══════════════════════════════════════════════════════ */
.modal { position: fixed; inset: 0; z-index: 120; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(16,36,28,.5); }
.modal.is-aberto { display: flex; animation: aparecer .15s ease; }
.modal-caixa { background: #fff; border-radius: var(--raio-lg); box-shadow: var(--sombra-alta); width: 100%; max-width: 560px; max-height: calc(100vh - 40px); display: flex; flex-direction: column; animation: subir .2s ease; }
.modal-caixa--larga { max-width: 900px; }
.modal-caixa--cheia { max-width: 1100px; height: calc(100vh - 40px); }
.modal-cab { display: flex; align-items: center; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--linha); }
.modal-cab h2 { font-size: var(--t-md); margin: 0; flex: 1; }
.modal-fechar { margin-left: auto; width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--areia); color: var(--tinta-media); cursor: pointer; font-size: 1.15rem; display: inline-flex; align-items: center; justify-content: center; }
.modal-fechar:hover { background: var(--areia-2); color: var(--tinta); }
.modal-corpo { padding: 18px 20px; overflow-y: auto; flex: 1 1 auto; min-height: 0; overscroll-behavior: contain; }
/* formulário envolvendo corpo + rodapé: mantém o rodapé visível e o corpo rolando (antes o botão sumia no celular) */
.modal-caixa > form { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; margin: 0; }
.modal-corpo iframe { width: 100%; height: 100%; min-height: 60vh; border: 0; display: block; }
.modal-rodape { padding: 14px 20px; border-top: 1px solid var(--linha); display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
body.bx-travado { overflow: hidden; }

/* ═══ TOAST ══════════════════════════════════════════════════════ */
#toast-container { position: fixed; z-index: 200; right: 20px; bottom: 20px; display: flex; flex-direction: column; gap: 8px; max-width: min(420px, calc(100vw - 32px)); }
.toast-braxil { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: var(--raio); background: var(--tinta); color: #fff; font-size: var(--t-sm); box-shadow: var(--sombra-alta); animation: subir .2s ease; }
.toast-braxil i { font-size: 1.1rem; line-height: 1.3; }
.toast-braxil.ok i { color: #7FD8A6; }
.toast-braxil.erro i { color: #FFB59E; }
.toast-braxil.atencao i { color: #F2D58A; }

/* ═══ OFERTA / LAUDOS ════════════════════════════════════════════ */
.ofertas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.oferta { background: #fff; border: 1.5px solid var(--linha); border-radius: var(--raio-lg); padding: 22px; display: flex; flex-direction: column; gap: 12px; position: relative; }
.oferta--destaque { border-color: var(--ouro); box-shadow: 0 16px 40px -22px rgba(169,133,47,.55); }
.oferta-selo { position: absolute; top: -11px; left: 20px; background: var(--ouro); color: #fff; font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 4px 10px; border-radius: 99px; }
.oferta h3 { margin: 0; font-size: var(--t-lg); }
.oferta-preco { font-family: var(--serif); font-size: 2rem; font-weight: 600; color: var(--verde-escuro); line-height: 1; }
.oferta-preco small { font-family: var(--sans); font-size: var(--t-sm); color: var(--tinta-media); font-weight: 500; }
.oferta ul { list-style: none; margin: 0; padding: 0; font-size: var(--t-sm); color: var(--tinta-media); }
.oferta li { display: flex; gap: 8px; padding: 4px 0; }
.oferta li i { color: var(--verde); flex-shrink: 0; margin-top: 2px; }
.oferta li.mais i { color: var(--ouro); }
.oferta li.mais { color: var(--tinta); font-weight: 600; }
.oferta .botoes { margin-top: auto; }

/* ═══ UTILITÁRIOS ════════════════════════════════════════════════ */
.mudo { color: var(--tinta-media); }
.fraco { color: var(--tinta-fraca); }
.mono { font-family: var(--mono); font-size: .92em; }
.serif { font-family: var(--serif); }
.verde { color: var(--verde); }
.ouro { color: var(--ouro-escuro); }
.alerta { color: var(--alerta); }
.negrito { font-weight: 650; }
.pequeno { font-size: var(--t-sm); }
.mini { font-size: var(--t-xs); }
.direita { text-align: right; }
.centro { text-align: center; }
.quebra { overflow-wrap: anywhere; }
.linha-unica { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.flex { display: flex; gap: 10px; align-items: center; }
.flex-entre { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.cresce { flex: 1; min-width: 0; }
.mt-0 { margin-top: 0 !important; } .mt-1 { margin-top: 8px; } .mt-2 { margin-top: 16px; } .mt-3 { margin-top: 24px; } .mt-4 { margin-top: 36px; }
.mb-0 { margin-bottom: 0 !important; } .mb-1 { margin-bottom: 8px; } .mb-2 { margin-bottom: 16px; } .mb-3 { margin-bottom: 24px; }
.so-celular, .show-mobile { display: none !important; }

/* ═══ ANIMAÇÕES ══════════════════════════════════════════════════ */
@keyframes girar { to { transform: rotate(360deg); } }
@keyframes aparecer { from { opacity: 0; } to { opacity: 1; } }
@keyframes surgir { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes subir { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes brilho { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }
@keyframes spin { to { transform: rotate(360deg); } }

/* ═══ RESPONSIVO ═════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .numeros { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grade-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grade-lateral { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  :root { --lateral: 0px; }
  .bx-side { display: none; }
  .bx-main { margin-left: 0; }
  .bx-top { padding: 0 12px 0 16px; }
  .bx-top-marca { display: flex; }
  .bx-top-titulo { display: none; }
  .bx-conta-btn .nome, .bx-conta-btn > i { display: none; }
  .bx-conta-btn { padding: 3px; }
  .bx-page { padding: 20px 16px calc(var(--abas) + 32px + var(--seguro-b)); }
  .bx-rodape { display: none; }
  .bx-abas {
    display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 70;
    height: calc(var(--abas) + var(--seguro-b)); padding-bottom: var(--seguro-b);
    background: rgba(255,255,255,.97); backdrop-filter: blur(10px); border-top: 1px solid var(--linha);
  }
  .bx-aba { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; text-decoration: none; color: var(--tinta-fraca); font: 650 .68rem/1.2 var(--sans); padding: 0; background: none; border: 0; cursor: pointer; position: relative; }
  .bx-aba i { font-size: 1.35rem; }
  .bx-aba.is-ativo { color: var(--verde-escuro); }
  .bx-aba.is-ativo i { color: var(--verde); }
  .bx-aba .contador { position: absolute; top: 6px; left: calc(50% + 6px); min-width: 17px; height: 17px; font-size: .6rem; border: 2px solid #fff; }
  .bx-aba--central i { width: 46px; height: 46px; border-radius: 50%; background: var(--verde); color: #fff !important; display: flex; align-items: center; justify-content: center; margin-top: -20px; box-shadow: 0 8px 18px -6px rgba(8,71,42,.6); border: 3px solid #fff; font-size: 1.4rem; }
  .bx-aba--central { color: var(--verde-escuro); }
  #toast-container { left: 16px; right: 16px; bottom: calc(var(--abas) + 14px + var(--seguro-b)); max-width: none; }
  .so-celular, .show-mobile { display: revert !important; }
  .oculto-celular, .hide-mobile { display: none !important; }
  .grade-2, .grade-3, .ofertas { grid-template-columns: 1fr; }
  .campo-linha { grid-template-columns: 1fr; }
  .pagina-cab { align-items: stretch; margin-bottom: 18px; }
  .pagina-cab h1 { font-size: 1.55rem; }
  .pagina-cab .acoes { width: 100%; }
  .pagina-cab .acoes .btn { flex: 1; }
  .cartao-cab, .cartao-corpo, .lista-item { padding-left: 16px; padding-right: 16px; }
  .modal { padding: 0; align-items: flex-end; }
  .modal-caixa { max-height: 92vh; border-radius: 16px 16px 0 0; max-width: none; animation: subirFolha .22s ease; }
  .modal-caixa--cheia { height: 92vh; }
  .modal-rodape { padding-bottom: calc(14px + var(--seguro-b)); }
  .modal-rodape .btn { flex: 1; }
  /* Tabelas viram cartões: cada <td> mostra o rótulo do data-rotulo */
  .tabela--cartoes thead { display: none; }
  .tabela--cartoes, .tabela--cartoes tbody, .tabela--cartoes tr, .tabela--cartoes td { display: block; width: 100%; }
  .tabela--cartoes tr { padding: 12px 16px; border-bottom: 1px solid var(--linha); }
  .tabela--cartoes td { border: 0; padding: 3px 0; display: flex; justify-content: space-between; gap: 12px; text-align: right; }
  .tabela--cartoes td::before { content: attr(data-rotulo); color: var(--tinta-fraca); font-size: var(--t-xs); font-weight: 600; text-align: left; flex-shrink: 0; }
  .tabela--cartoes td[data-rotulo=""]::before { display: none; }
  .tabela--cartoes td.td-principal { display: block; text-align: left; font-weight: 650; padding-bottom: 6px; }
  .tabela--cartoes td.td-principal::before { display: none; }
  .tabela--cartoes td.td-acoes { justify-content: flex-start; padding-top: 10px; }
  .tabela--cartoes td.td-acoes::before { display: none; }
}
@media (max-width: 520px) {
  .numeros { gap: 8px; }
  .numero { padding: 14px; }
  .numero strong { font-size: 1.5rem; }
  .dados { grid-template-columns: 1fr; gap: 2px; }
  .dados dd { margin-bottom: 8px; }
  .etapa { font-size: .62rem; }
  .bx-folha-grade { grid-template-columns: repeat(3, 1fr); }
  .aviso:has(> .acoes) { flex-wrap: wrap; }
  .aviso .acoes { margin-left: 0; width: 100%; }
}
@keyframes subirFolha { from { transform: translateY(40px); opacity: .4; } to { transform: none; opacity: 1; } }

@media print {
  .bx-side, .bx-top, .bx-abas, .bx-folha, .bx-folha-fundo, #toast-container, .iac-fab, .nao-imprimir { display: none !important; }
  .bx-main { margin: 0; }
  .bx-page { padding: 0; max-width: none; }
  body { background: #fff; }
  .cartao { box-shadow: none; }
}

/* ── v3.1: utilitários pedidos pelas páginas ─────────────── */
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.campo-erro { display: block; font-size: var(--t-xs); color: var(--alerta); margin-top: 4px; }
.entrada.is-erro, .is-erro .entrada { border-color: var(--alerta); box-shadow: 0 0 0 3px var(--alerta-claro); }
.oferta.is-escolhida { border-color: var(--verde); box-shadow: 0 0 0 3px var(--verde-claro); }

/* ── v3.1: revisão de experiência ─────────────────────────── */
/* menu lateral em notebooks de 768–900 px de altura: compacto e sem o cartão do WhatsApp (o item "Ajuda e contato" continua) */
@media (min-width: 901px) and (max-height: 860px) {
  .bx-side-pe { display: none; }
  .bx-nav-link { padding-top: 6px; padding-bottom: 6px; }
  .bx-nav-sec { padding-top: 10px; }
}
/* alvos de toque de pelo menos 40 px no celular */
@media (max-width: 760px) {
  .btn--pequeno, .btn-sm-b { min-height: 40px; padding-top: 9px; padding-bottom: 9px; }
  .filtro { min-height: 40px; padding: 8px 14px; }
  .chip button { min-width: 32px; min-height: 32px; }
  .cartao-cab > a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 4px; }
  .numeros > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}
.num, .valor, .tel { white-space: nowrap; }
/* botão do assistente no topo (o botão flutuante cobria ações das páginas) */
.bx-assist-btn { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 12px; border-radius: 99px; border: 1px solid var(--linha); background: #fff; color: var(--verde-escuro); font: 600 var(--t-sm) var(--sans); cursor: pointer; }
.bx-assist-btn:hover { border-color: var(--verde-borda); background: var(--verde-claro); }
.bx-assist-btn i { font-size: 1.1rem; color: var(--verde); }
@media (max-width: 900px) {
  .bx-assist-btn { width: 40px; padding: 0; justify-content: center; border-color: transparent; background: none; }
  .bx-assist-btn span { display: none; }
}