/* Clareador Dental — estilo mobile first. Sem fontes externas. */
:root {
  --indigo: #374291;
  --indigo-escuro: #262e6b;
  --indigo-claro: #e9ebf7;
  --amarelo: #f0c84d;
  --amarelo-escuro: #d9ad22;
  --texto: #1d2140;
  --texto-suave: #4a4f6e;
  --fundo: #ffffff;
  --fundo-suave: #f5f6fb;
  --borda: #dcdfee;
  --alerta: #8a3b12;
  --alerta-fundo: #fff4e8;
  --raio: 14px;
  --topo-altura: 60px;
  --fonte-titulo: ui-rounded, "SF Pro Rounded", "Nunito", "Arial Rounded MT Bold", system-ui, sans-serif;
  --fonte-texto: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font-family: var(--fonte-texto);
  font-size: 1.0625rem;
  line-height: 1.6;
  overflow-x: hidden;
}
img, svg { max-width: 100%; height: auto; }
[id] { scroll-margin-top: calc(var(--topo-altura) + 12px); }
[hidden] { display: none !important; }

h1, h2, h3 { font-family: var(--fonte-titulo); line-height: 1.2; color: var(--indigo-escuro); }
h1 { font-size: clamp(1.75rem, 7vw, 3rem); font-weight: 800; margin: 0 0 1rem; color: #fff; letter-spacing: -0.01em; }
h2 { font-size: clamp(1.5rem, 5.5vw, 2.125rem); font-weight: 800; margin: 0 0 1rem; }
h3 { font-size: 1.1875rem; font-weight: 700; margin: 1.75rem 0 0.5rem; }
p { margin: 0 0 1rem; }
a { color: var(--indigo); text-underline-offset: 3px; }
a:hover { color: var(--indigo-escuro); }
:focus-visible { outline: 3px solid var(--amarelo); outline-offset: 3px; border-radius: 4px; }

.pular {
  position: absolute; left: 12px; top: -60px; z-index: 100;
  background: var(--amarelo); color: var(--texto); padding: 10px 16px; border-radius: 8px; font-weight: 700;
}
.pular:focus { top: 12px; }

/* Pendências de conteúdo: visíveis de propósito até serem preenchidas */
mark.pendente {
  background: #fff3b0; color: #5c4600; padding: 2px 6px; border-radius: 6px;
  outline: 1px dashed #c9a400; font-size: 0.9375rem;
}

/* Cabeçalho */
.topo {
  position: sticky; top: 0; z-index: 50;
  background: var(--indigo); color: #fff;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08);
}
.topo__interno {
  max-width: 1120px; margin: 0 auto; padding: 0 16px;
  min-height: var(--topo-altura);
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
}
.marca {
  display: inline-flex; align-items: center; gap: 10px;
  color: #fff; text-decoration: none; font-family: var(--fonte-titulo); line-height: 1;
  min-height: 48px;
}
.marca:hover { color: #fff; }
.marca img { display: block; height: 46px; width: auto; }
@media (min-width: 960px) { .marca img { height: 52px; } }

.menu-botao {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 48px; padding: 0 14px;
  background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 10px;
  font: 600 1rem var(--fonte-texto); cursor: pointer;
}
.menu-botao__icone, .menu-botao__icone::before, .menu-botao__icone::after {
  display: block; width: 18px; height: 2px; background: currentColor; border-radius: 2px; position: relative;
}
.menu-botao__icone::before, .menu-botao__icone::after { content: ""; position: absolute; left: 0; }
.menu-botao__icone::before { top: -6px; }
.menu-botao__icone::after { top: 6px; }
html:not(.js) .menu-botao { display: none; }

.menu { width: 100%; }
.js .menu { display: none; }
.js .menu.menu--aberto { display: block; }
.menu ul { list-style: none; margin: 0; padding: 4px 0 14px; }
.menu a {
  display: flex; align-items: center; min-height: 48px; padding: 0 4px;
  color: #fff; text-decoration: none; font-weight: 600; border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.menu a:hover { color: var(--amarelo); }
.menu a.menu__cta { color: var(--amarelo); border-bottom: 0; }

/* Primeira dobra */
.heroi { background-color: var(--indigo); color: #fff; position: relative; overflow: hidden; }
.heroi::before {
  content: ""; position: absolute; left: 0; bottom: 0; width: 120px; height: 100px;
  background-image: radial-gradient(rgba(255, 255, 255, 0.35) 2px, transparent 2.5px);
  background-size: 20px 20px;
}
.heroi::after {
  content: ""; position: absolute; right: 16px; top: 20px; width: 46px; height: 14px;
  background: var(--amarelo); border-radius: 3px;
}
.heroi__interno {
  position: relative; z-index: 1;
  max-width: 1120px; margin: 0 auto; padding: 44px 16px 56px;
  display: grid; gap: 44px;
}
.heroi__foto { position: relative; margin: 0 4px 0 12px; }
.heroi__foto::before {
  content: ""; position: absolute; left: -12px; bottom: -12px; width: 58%; height: 62%;
  background: var(--amarelo); border-radius: 22px;
}
.heroi__foto::after {
  content: ""; position: absolute; right: -14px; top: -14px; width: 104px; height: 74px;
  background-image: radial-gradient(rgba(255, 255, 255, 0.55) 2px, transparent 2.5px);
  background-size: 15px 15px;
}
.heroi__foto picture { position: relative; z-index: 1; display: block; }
.heroi__foto picture::after {
  content: ""; position: absolute; left: -10px; top: -26px; width: 46px; height: 46px;
  background:
    radial-gradient(circle at 70% 30%, #fff 0 11px, transparent 11.5px),
    radial-gradient(circle at 30% 62%, #fff 0 8px, transparent 8.5px),
    radial-gradient(circle at 10% 92%, #fff 0 4px, transparent 4.5px);
}
.heroi__foto img {
  display: block; width: 100%; height: auto; border-radius: 22px;
  box-shadow: 0 18px 40px rgba(15, 18, 60, 0.35);
}
.heroi__selo {
  display: inline-block; font-size: 0.875rem; font-weight: 700; letter-spacing: 0.02em;
  color: var(--amarelo); margin-bottom: 0.75rem;
}
.heroi__texto { font-size: 1.125rem; color: #eef0fb; max-width: 40rem; }
.heroi__acoes { display: flex; flex-direction: column; gap: 14px; margin-top: 1.5rem; }

.botao {
  display: inline-flex; align-items: center; justify-content: center; text-align: center;
  min-height: 52px; padding: 12px 22px; border-radius: 12px;
  font: 700 1.0625rem var(--fonte-texto); text-decoration: none; cursor: pointer; border: 2px solid transparent;
}
.botao--destaque { background: var(--amarelo); color: var(--texto); }
.botao--destaque:hover { background: #f6d670; color: var(--texto); }
.botao--primario { background: var(--indigo); color: #fff; }
.botao--primario:hover { background: var(--indigo-escuro); color: #fff; }
.botao--contorno { background: #fff; color: var(--indigo); border-color: var(--indigo); }
.botao--claro { background: #fff; color: var(--indigo-escuro); word-break: break-all; }
.link-claro {
  color: #fff; font-weight: 600; min-height: 48px; display: inline-flex; align-items: center; justify-content: center;
}
.link-claro:hover { color: var(--amarelo); }

/* Atalhos */
.atalhos { max-width: 792px; margin: 0 auto; padding: 20px 16px 4px; }
.atalhos__titulo { font-weight: 700; font-size: 0.9375rem; color: var(--texto-suave); margin-bottom: 0.5rem; }
.atalhos ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.atalhos a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px;
  background: var(--indigo-claro); color: var(--indigo-escuro); border-radius: 999px;
  font-weight: 600; font-size: 0.9375rem; text-decoration: none;
}
.atalhos a:hover { background: #dde0f3; }

/* Seções */
.secao { padding: 40px 0; }
.secao--suave { background: var(--fundo-suave); }
.secao__interno { max-width: 792px; margin: 0 auto; padding: 0 16px; }
.secao__intro { font-size: 1.125rem; color: var(--texto-suave); }
.secao h2 { position: relative; padding-top: 14px; }
.secao h2::before {
  content: ""; position: absolute; top: 0; left: 0; width: 40px; height: 5px; border-radius: 3px; background: var(--amarelo);
}

.aviso {
  background: var(--indigo-claro); border-left: 5px solid var(--indigo);
  border-radius: 10px; padding: 16px 16px 4px; margin: 0.75rem 0 1rem;
}
.aviso--alerta { background: var(--alerta-fundo); border-left-color: #d9731f; color: var(--alerta); }

.cartoes { display: grid; gap: 14px; margin-top: 1.25rem; }
.cartao { background: #fff; border: 1px solid var(--borda); border-radius: var(--raio); padding: 18px 18px 6px; }
.cartao h3 { margin-top: 0; }

.passos { padding-left: 1.4rem; margin: 0 0 1rem; }
.passos li { margin-bottom: 0.75rem; padding-left: 0.25rem; }
.passos li::marker { color: var(--indigo); font-weight: 800; }
.lista { padding-left: 1.25rem; margin: 0 0 1rem; }
.lista li { margin-bottom: 0.35rem; }

/* FAQ */
.busca { margin: 0.5rem 0 1.25rem; }
.busca label { display: block; font-weight: 700; margin-bottom: 0.4rem; }
.busca input {
  width: 100%; min-height: 52px; padding: 12px 14px;
  font: 1.0625rem var(--fonte-texto); color: var(--texto);
  border: 2px solid var(--borda); border-radius: 12px; background: #fff;
}
.busca input:focus { border-color: var(--indigo); outline: none; box-shadow: 0 0 0 3px rgba(240, 200, 77, 0.6); }
.busca__status { font-size: 0.9375rem; color: var(--texto-suave); margin: 0.5rem 0 0; min-height: 1.5em; }
.busca__vazio { margin-top: 0.5rem; }

.faq-lista { display: grid; gap: 10px; }
.faq { border: 1px solid var(--borda); border-radius: 12px; background: #fff; }
.faq[open] { border-color: #b9bfe2; }
.faq summary {
  list-style: none; cursor: pointer; position: relative;
  min-height: 56px; padding: 14px 48px 14px 16px;
  font-family: var(--fonte-titulo); font-weight: 700; font-size: 1.0625rem; color: var(--indigo-escuro);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+"; position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  font-size: 1.5rem; font-weight: 700; color: var(--indigo);
}
.faq[open] summary::after { content: "−"; }
.faq__resposta { padding: 0 16px 4px; }
.faq__mais a { font-weight: 600; }
.faq--oculta { display: none; }
.faq mark.destaque { background: #fde9a6; color: inherit; padding: 0 2px; border-radius: 3px; }

/* Assistente */
.assistente {
  margin-top: 2rem; padding: 20px 18px; border-radius: var(--raio);
  background: var(--indigo-claro); border: 1px solid #ccd1ec;
}
.assistente h3 { margin-top: 0; }
.assistente__area { margin-top: 1rem; }
.assistente__form label { display: block; font-weight: 700; margin-bottom: 0.4rem; }
.assistente__form textarea {
  width: 100%; min-height: 110px; padding: 12px 14px; resize: vertical;
  font: 1.0625rem var(--fonte-texto); border: 2px solid var(--borda); border-radius: 12px; background: #fff;
}
.assistente__form textarea:focus { border-color: var(--indigo); outline: none; box-shadow: 0 0 0 3px rgba(240, 200, 77, 0.6); }
.assistente__contador { font-size: 0.875rem; color: var(--texto-suave); text-align: right; margin: 0.25rem 0 0.75rem; }
.assistente__resposta {
  margin-top: 1rem; background: #fff; border-radius: 12px; padding: 16px 16px 4px; border: 1px solid var(--borda);
}
.assistente__resposta--alerta { background: var(--alerta-fundo); border-color: #f0c9a3; color: var(--alerta); }
.assistente__rotulo { font-size: 0.8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--texto-suave); }
.assistente__carregando { color: var(--texto-suave); }

/* Blog */
.blog-lista { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: 10px; }
.blog-lista a {
  display: block; padding: 14px 16px; background: #fff; border: 1px solid var(--borda); border-radius: 12px;
  font-weight: 600; text-decoration: none; color: var(--indigo-escuro);
}
.blog-lista a:hover { border-color: var(--indigo); }
.link-seta { font-weight: 700; }
.link-seta::after { content: " →"; }

/* Contato */
.contato { background: var(--indigo); color: #fff; padding: 44px 0; }
.contato h2 { color: #fff; }
.contato__acoes { display: flex; flex-direction: column; gap: 12px; margin-top: 1rem; }

/* Rodapé */
.rodape { background: var(--indigo-escuro); color: #d9dcf0; padding: 32px 0 40px; font-size: 0.9375rem; }
.rodape a { color: #fff; }
.rodape__marca { font-family: var(--fonte-titulo); font-weight: 800; color: #fff; font-size: 1.0625rem; }
.rodape__links { list-style: none; padding: 0; margin: 0 0 1rem; display: flex; flex-wrap: wrap; gap: 4px 18px; }
.rodape__links a { display: inline-flex; align-items: center; min-height: 44px; }
.rodape__aviso { color: #bfc4e6; }

.topo-voltar {
  position: fixed; left: 16px; bottom: 16px; z-index: 40;
  width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--amarelo); color: var(--texto); border-radius: 50%;
  font-size: 1.375rem; font-weight: 800; text-decoration: none; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
}

/* Ilustrações */
.figura {
  margin: 1.25rem 0 1.5rem; padding: 12px; background: var(--fundo-suave);
  border: 1px solid var(--borda); border-radius: var(--raio);
}
.secao--suave .figura { background: #fff; }
.figura picture, .figura img { display: block; width: 100%; height: auto; }
.figura img { border-radius: 10px; }
.figura figcaption { margin-top: 10px; font-size: 0.9375rem; line-height: 1.45; color: var(--texto-suave); }
@media (min-width: 960px) { .artigo .figura, .secao .figura { max-width: 720px; } }

/* Ícones de tema (decorativos) */
.guia__titulo, .central__titulo { display: flex; align-items: center; gap: 12px; }
.tema-icone {
  flex: 0 0 auto; width: 48px; height: 48px; padding: 4px;
  background: #fff; border: 1px solid var(--borda); border-radius: 12px;
}

/* Barra fixa de WhatsApp (celular) */
.barra-contato {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 35;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
  background: rgba(255, 255, 255, 0.96); border-top: 1px solid var(--borda);
  box-shadow: 0 -4px 14px rgba(38, 46, 107, 0.12);
}
.barra-contato .botao { width: 100%; }
.barra-contato[hidden] { display: none; }
body.com-barra { padding-bottom: 76px; }
body.com-barra .topo-voltar { bottom: 88px; }
@media (min-width: 960px) {
  .barra-contato { display: none; }
  body.com-barra { padding-bottom: 0; }
  body.com-barra .topo-voltar { bottom: 16px; }
}

/* Assistente: estado e erros */
.assistente__status { margin: 0.5rem 0; font-size: 0.9375rem; color: var(--texto-suave); }
.assistente__status:empty { display: none; }
.assistente__erro { margin: 0.25rem 0 0.5rem; color: var(--alerta); font-weight: 600; }
.assistente__erro:empty { display: none; }
.assistente__resposta--erro { background: var(--alerta-fundo); border-color: #e8b98f; }

/* Vídeo do YouTube (moldeira) */
.video-tutorial {
  margin: 1.25rem 0 1.5rem; padding: 16px 18px; background: var(--indigo-claro);
  border-left: 5px solid var(--amarelo); border-radius: var(--raio);
}
.video-tutorial__titulo { margin: 0 0 0.5rem; font-family: var(--fonte-titulo); font-weight: 800; color: var(--indigo-escuro); }
.video-tutorial p:last-child { margin-bottom: 0; }
.video-tutorial__aviso { font-weight: 500; font-size: 0.875rem; }

/* Chat flutuante */
.busca__acoes { display: flex; flex-wrap: wrap; gap: 10px; }
.chat-lancador {
  position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 45;
  display: inline-flex; align-items: center; gap: 8px; min-height: 52px; padding: 0 18px 0 14px;
  background: var(--indigo); color: var(--amarelo); border: 2px solid #fff; border-radius: 999px;
  font: 700 1rem var(--fonte-texto); cursor: pointer; box-shadow: 0 6px 18px rgba(38, 46, 107, 0.28);
}
.chat-lancador span { color: #fff; }
.chat-lancador:hover { background: var(--indigo-escuro); }
.chat-lancador[hidden] { display: none; }
body.com-barra .chat-lancador { bottom: 88px; }
body.chat-aberto .chat-lancador, body.chat-aberto .barra-contato, body.chat-aberto .topo-voltar { display: none; }

.chat {
  position: fixed; inset: 0; z-index: 60; display: flex; flex-direction: column;
  background: #fff; color: var(--texto); height: 100%; height: 100dvh;
}
.chat[hidden] { display: none; }
.chat__topo {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 12px 12px 16px; background: var(--indigo); color: #fff;
}
.chat__titulo { margin: 0; font-family: var(--fonte-titulo); font-weight: 800; font-size: 1.0625rem; }
.chat__sub { margin: 0; font-size: 0.875rem; color: #d9dcf2; }
.chat__fechar {
  flex: 0 0 auto; width: 44px; height: 44px; border: 0; border-radius: 12px;
  background: rgba(255, 255, 255, 0.12); color: #fff; font-size: 1.75rem; line-height: 1; cursor: pointer;
}
.chat__mensagens {
  flex: 1 1 auto; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px;
  background: var(--fundo-suave); overscroll-behavior: contain;
}
.chat__msg { max-width: 88%; padding: 10px 14px; border-radius: 16px; font-size: 1rem; line-height: 1.5; }
.chat__msg p { margin: 0 0 0.5rem; }
.chat__msg p:last-child { margin-bottom: 0; }
.chat__msg--cliente { align-self: flex-end; background: var(--indigo); color: #fff; border-bottom-right-radius: 4px; white-space: pre-wrap; overflow-wrap: anywhere; }
.chat__msg--assistente { align-self: flex-start; background: #fff; border: 1px solid var(--borda); border-bottom-left-radius: 4px; }
.chat__msg--alerta { background: var(--alerta-fundo); border-color: #f0c9a3; color: var(--alerta); }
.chat__msg--erro { background: var(--alerta-fundo); border-color: #e8b98f; }
.chat__digitando { color: var(--texto-suave); font-style: italic; }
.chat__rotulo { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--texto-suave); }
.chat__msg-titulo { font-weight: 700; color: var(--indigo-escuro); }
.chat__aviso { font-size: 0.8125rem; color: var(--texto-suave); }
.chat__links { list-style: none; margin: 0.5rem 0 0; padding: 0; }
.chat__links li { margin: 0; }
.chat__links a { display: block; padding: 6px 0 6px 18px; position: relative; font-weight: 600; }
.chat__links a::before { content: "›"; position: absolute; left: 4px; top: 5px; }
.chat__video { width: 100%; margin-top: 0.25rem; font-size: 0.9375rem; min-height: 44px; text-align: center; }
.chat__avaliar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 0.5rem; padding-top: 0.5rem; border-top: 1px solid var(--borda); font-size: 0.875rem; color: var(--texto-suave); }
.chat__avaliar-botao { min-height: 36px; padding: 0 14px; border: 1px solid var(--indigo); border-radius: 999px; background: #fff; color: var(--indigo); font: 600 0.875rem var(--fonte-texto); cursor: pointer; }
.chat__avaliar-botao:hover { background: var(--indigo-claro); }
.chat__whats { width: 100%; margin-top: 0.5rem; font-size: 0.9375rem; min-height: 44px; }
.chat__sugestoes { display: flex; gap: 8px; overflow-x: auto; padding: 10px 16px; background: var(--fundo-suave); border-top: 1px solid var(--borda); }
.chat__sugestoes[hidden] { display: none; }
.chat__sugestao {
  flex: 0 0 auto; min-height: 40px; padding: 0 14px; border: 1px solid var(--indigo); border-radius: 999px;
  background: #fff; color: var(--indigo); font: 600 0.9375rem var(--fonte-texto); cursor: pointer; white-space: nowrap;
}
.chat__form { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--borda); }
.chat__rotulo-campo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.chat__campo {
  flex: 1 1 auto; min-height: 46px; max-height: 120px; resize: none; padding: 11px 14px;
  font: 1rem/1.4 var(--fonte-texto); color: var(--texto); border: 2px solid var(--borda); border-radius: 14px;
}
.chat__campo:focus { border-color: var(--indigo); outline: none; box-shadow: 0 0 0 3px rgba(240, 200, 77, 0.6); }
.chat__enviar {
  flex: 0 0 auto; width: 48px; height: 48px; border: 0; border-radius: 14px;
  background: var(--amarelo); color: var(--indigo-escuro); cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
.chat__enviar:disabled { opacity: 0.5; cursor: wait; }
.chat__rodape {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0 14px; padding: 4px 16px calc(8px + env(safe-area-inset-bottom));
  font-size: 0.875rem;
}
.chat__rodape a, .chat__nova { display: inline-flex; align-items: center; min-height: 40px; }
.chat__nova { border: 0; background: none; padding: 0; color: var(--indigo); font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
@media (min-width: 640px) {
  .chat {
    inset: auto 16px 16px auto; width: 390px; height: min(640px, calc(100vh - 32px));
    border-radius: 18px; overflow: hidden; box-shadow: 0 16px 48px rgba(38, 46, 107, 0.3); border: 1px solid var(--borda);
  }
}
@media (min-width: 960px) { body.com-barra .chat-lancador { bottom: 16px; } }
@media (max-width: 639px) { body.chat-aberto { overflow: hidden; } }

/* Aviso de cookies (Google Analytics) */
.cookies {
  position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 70;
  background: #fff; border: 1px solid var(--borda); border-radius: var(--raio); padding: 14px 16px;
  box-shadow: 0 10px 30px rgba(38, 46, 107, 0.25); font-size: 0.9375rem;
}
.cookies p { margin: 0 0 10px; }
.cookies__acoes { display: flex; gap: 10px; flex-wrap: wrap; }
.cookies__acoes .botao { min-height: 44px; flex: 1 1 120px; }
@media (min-width: 640px) { .cookies { left: auto; max-width: 420px; } }

/* Tablet */
@media (min-width: 640px) {
  .heroi__acoes { flex-direction: row; align-items: center; flex-wrap: wrap; }
  .heroi__acoes .botao { min-width: 280px; }
  .cartoes { grid-template-columns: repeat(2, 1fr); }
  .contato__acoes { flex-direction: row; flex-wrap: wrap; }
  .botao--claro { word-break: normal; }
}

/* Computador */
@media (min-width: 960px) {
  .topo__interno { flex-wrap: nowrap; }
  .menu-botao { display: none; }
  .menu, .js .menu { display: block; width: auto; }
  .menu ul { display: flex; align-items: center; gap: 4px; padding: 0; }
  .menu a { border: 0; padding: 0 12px; }
  .menu a.menu__cta {
    background: var(--amarelo); color: var(--texto); border-radius: 10px; margin-left: 8px; padding: 0 18px; min-height: 44px;
  }
  .menu a.menu__cta:hover { background: #f6d670; color: var(--texto); }
  .heroi__interno { padding: 72px 16px 84px; grid-template-columns: 1.05fr 1fr; align-items: center; gap: 64px; }
  .heroi::before { width: 150px; height: 160px; }
  .heroi::after { right: 48px; top: 36px; width: 72px; height: 22px; }
  .heroi__foto { margin: 0 0 0 12px; }
  .secao { padding: 64px 0; }
  .atalhos { padding-top: 28px; }
}
.titulo-pagina { color: var(--indigo-escuro); }
.rodape__marca img { display: block; height: 44px; width: auto; }

/* Tabela de tempos de uso */
.tabela-rolagem { overflow-x: auto; margin: 0.5rem 0 1.25rem; -webkit-overflow-scrolling: touch; }
.tabela { width: 100%; border-collapse: collapse; font-size: 0.9375rem; background: #fff; border-radius: 12px; overflow: hidden; }
.tabela caption { text-align: left; font-size: 0.875rem; color: var(--texto-suave); padding: 0 0 0.5rem; }
.tabela th, .tabela td { padding: 10px 12px; border-bottom: 1px solid var(--borda); text-align: left; vertical-align: top; }
.tabela thead th { background: var(--indigo); color: #fff; font-weight: 700; }
.tabela tbody th { font-weight: 600; color: var(--indigo-escuro); }

/* Guias na página inicial */
.secao__interno--largo { max-width: 1120px; }
.cartoes--guias .cartao ul { padding-left: 1.1rem; margin: 0 0 1rem; }
.cartoes--guias .cartao li { margin-bottom: 0.5rem; }
.cartoes--guias .cartao li a { font-weight: 600; }
@media (min-width: 960px) { .cartoes--guias { grid-template-columns: repeat(3, 1fr); } }

/* Páginas de guias */
.artigo { padding: 24px 0 48px; }
.artigo h1 { color: var(--indigo-escuro); font-size: clamp(1.625rem, 6vw, 2.5rem); margin-top: 0.5rem; }
.migalhas { font-size: 0.875rem; color: var(--texto-suave); margin: 0 0 0.75rem; line-height: 1.5; }
.migalhas a { color: var(--indigo); }
.artigo__lead { font-size: 1.1875rem; color: var(--texto-suave); }
.artigo__corpo h2 { font-size: clamp(1.25rem, 4.5vw, 1.625rem); margin: 2rem 0 0.75rem; }
.artigo__corpo h3 { margin-top: 1.5rem; }
.artigo__corpo ul { padding-left: 1.25rem; margin: 0 0 1rem; }
.artigo__corpo li { margin-bottom: 0.4rem; }
.artigo__contato {
  margin: 2.5rem 0; padding: 20px 18px; border-radius: var(--raio);
  background: var(--indigo); color: #fff;
}
.artigo__contato-titulo { font-family: var(--fonte-titulo); font-weight: 800; font-size: 1.25rem; margin-bottom: 0.5rem; }
.artigo__relacionados { border-top: 1px solid var(--borda); padding-top: 1.5rem; }
.artigo__relacionados h2 { font-size: 1.25rem; }
.artigo__relacionados ul { padding-left: 1.25rem; }
.artigo__relacionados li { margin-bottom: 0.6rem; }
.artigo__relacionados li a, .central__lista a { font-weight: 600; }
.atalhos--interno { padding: 8px 0 0; max-width: none; }
.central__grupo { padding-top: 1.5rem; }
.central__lista { padding-left: 1.25rem; }
.central__lista li { margin-bottom: 0.6rem; }

/* Informação do fabricante nos guias de produto */
.artigo__fabricante { margin: 2rem 0 0; padding: 18px 18px 6px; border-radius: var(--raio); background: var(--indigo-claro); border-left: 5px solid var(--amarelo); }
.artigo__fabricante-titulo { font-family: var(--fonte-titulo); font-weight: 800; color: var(--indigo-escuro); margin-bottom: 0.5rem; }
.artigo__fabricante ul { padding-left: 1.1rem; margin: 0 0 0.75rem; }
.artigo__fabricante li { margin-bottom: 0.5rem; }
