/* Kairo Agência Digital — estilos complementares ao Tailwind */
[x-cloak] { display: none !important; }

html { scroll-behavior: smooth; scroll-padding-top: 6rem; }
body { font-size: 16px; line-height: 1.6; overflow-wrap: break-word; }
img { max-width: 100%; height: auto; }

.btn-gradiente { background-image: linear-gradient(90deg, #8A2BE2 0%, #00BFFF 100%); }
.texto-gradiente {
  background-image: linear-gradient(90deg, #B57BFF 0%, #00BFFF 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

.card-neon { transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease; }
.card-neon:hover, .card-neon:focus-within {
  border-color: rgba(138, 43, 226, .6);
  box-shadow: 0 0 0 1px rgba(138, 43, 226, .35), 0 0 28px rgba(0, 191, 255, .18);
  transform: translateY(-2px);
}

.borda-neon { box-shadow: 0 0 14px rgba(0, 191, 255, .35); }

a:focus-visible, button:focus-visible { outline: 2px solid #00BFFF; outline-offset: 3px; }

/* Conteúdo dos posts do blog */
.artigo h2 { font-family: Sora, Inter, system-ui, sans-serif; font-size: 1.6rem; line-height: 1.25; font-weight: 700; margin: 2.5rem 0 1rem; }
.artigo h3 { font-size: 1.25rem; font-weight: 600; margin: 2rem 0 .75rem; }
.artigo p { margin: 0 0 1.15rem; color: #D1D5DB; }
.artigo ul, .artigo ol { margin: 0 0 1.25rem 1.25rem; color: #D1D5DB; }
.artigo ul { list-style: disc; }
.artigo ol { list-style: decimal; }
.artigo li { margin-bottom: .5rem; }
.artigo a { color: #00BFFF; text-decoration: underline; text-underline-offset: 3px; }
.artigo strong { color: #F9FAFB; }
.artigo .tabela { overflow-x: auto; margin: 0 0 1.5rem; }
.artigo table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 1rem; }
.artigo th, .artigo td { border: 1px solid rgba(255,255,255,.12); padding: .7rem .8rem; text-align: left; vertical-align: top; }
.artigo th { background: #161616; color: #F9FAFB; }
.artigo td { color: #D1D5DB; }
