/* Estilos del blog Control ObraX — livianos, sin dependencias */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { -webkit-font-smoothing: antialiased; }
body { font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; color: #0a1628; line-height: 1.75; background: #fff; }
a { color: #0f4c81; }
.topbar { display: flex; justify-content: space-between; align-items: center; padding: 16px 24px; border-bottom: 1px solid #e2e8f0; }
.topbar .logo { font-weight: 800; font-size: 18px; color: #0a1628; text-decoration: none; }
.topbar .logo span { color: #0f4c81; }
.topbar .cta { background: #f59e0b; color: #0a1628; font-weight: 700; padding: 9px 18px; border-radius: 8px; text-decoration: none; font-size: 14px; }
main { max-width: 760px; margin: 0 auto; padding: 40px 24px 72px; }
.meta { color: #64748b; font-size: 14px; margin-bottom: 8px; }
h1 { font-size: clamp(28px, 4.5vw, 40px); line-height: 1.2; margin-bottom: 18px; letter-spacing: -0.5px; }
h2 { font-size: 24px; margin: 36px 0 12px; letter-spacing: -0.3px; }
h3 { font-size: 19px; margin: 26px 0 8px; }
p, ul, ol { margin-bottom: 16px; color: #1e293b; }
ul, ol { padding-left: 24px; }
li { margin-bottom: 6px; }
strong { color: #0a1628; }
table { border-collapse: collapse; width: 100%; margin: 16px 0 24px; font-size: 15px; }
th, td { border: 1px solid #e2e8f0; padding: 10px 12px; text-align: left; }
th { background: #f8fafc; }
blockquote { border-left: 4px solid #0f4c81; padding: 10px 18px; background: #f8fafc; margin: 18px 0; color: #334155; }
.cta-box { background: #0f4c81; color: #fff; border-radius: 14px; padding: 28px; margin-top: 44px; }
.cta-box h2 { color: #fff; margin-top: 0; }
.cta-box p { color: #dbeafe; }
.cta-box a.btn { display: inline-block; background: #f59e0b; color: #0a1628; font-weight: 700; padding: 12px 24px; border-radius: 8px; text-decoration: none; margin-top: 8px; }
.volver { display: inline-block; margin-bottom: 24px; font-size: 14px; color: #64748b; text-decoration: none; }
footer { border-top: 1px solid #e2e8f0; padding: 24px; text-align: center; color: #64748b; font-size: 14px; }
footer a { color: #0f4c81; text-decoration: none; }
.card-list { display: grid; gap: 18px; margin-top: 28px; }
.card { border: 1px solid #e2e8f0; border-radius: 12px; padding: 22px; }
.card h2 { margin: 0 0 8px; font-size: 20px; }
.card a { text-decoration: none; }
.card p { margin-bottom: 0; color: #475569; font-size: 15px; }

/* Imagen de apoyo dentro de la guía */
.guia-img { margin: 28px 0; }
.guia-img img { width: 100%; height: auto; border-radius: 12px; border: 1px solid rgba(15,76,129,.14); box-shadow: 0 6px 22px rgba(15,23,42,.08); display: block; }
.guia-img figcaption { font-size: .82rem; color: #64748b; text-align: center; margin-top: 10px; line-height: 1.45; }

/* Firma del autor al pie del artículo */
.autor-bio { margin: 40px 0 8px; padding: 20px 22px; border-left: 3px solid #0F4C81; background: #f8fafc; border-radius: 0 10px 10px 0; }
.autor-bio p { margin: 0; font-size: .92rem; line-height: 1.6; color: #334155; }
.autor-bio a { color: #0F4C81; }
