/* Estilos comunes de los artículos del blog de Icomunitat.
   No hace falta tocarlos para escribir artículos. */

html { scroll-behavior: smooth; }
.articulo h2, .articulo h3 { scroll-margin-top: 90px; }

/* Texto del artículo */
.articulo { color: #2b3138; }
.articulo h2 { font-weight: 900; letter-spacing: -0.02em; color: #111418; }
.articulo h3 { font-weight: 800; color: #111418; }
.articulo strong { color: #111418; }
.articulo a { color: #0b5cb5; }
.articulo li::marker { color: #137fec; }

/* Texto del artículo (sustituye al plugin "prose" de Tailwind) */
.articulo { font-size: 1.125rem; line-height: 1.78; }
.articulo > :first-child { margin-top: 0; }
.articulo p { margin: 1.2em 0; }
.articulo h2 { font-size: 1.85rem; line-height: 1.25; margin: 2em 0 .8em; }
.articulo h3 { font-size: 1.35rem; line-height: 1.4; margin: 1.6em 0 .6em; }
.articulo ul, .articulo ol { margin: 1.2em 0; padding-left: 1.5em; }
.articulo ul { list-style: disc; }
.articulo ol { list-style: decimal; }
.articulo li { margin: .5em 0; padding-left: .25em; }
.articulo a { text-decoration: underline; font-weight: 500; }
.articulo .nota a, .articulo .tabla a { font-weight: 600; }
@media (max-width: 640px) { .articulo { font-size: 1.0625rem; } .articulo h2 { font-size: 1.55rem; } }

/* Índice del artículo */
.indice { background: #f6f7f8; border-radius: 1.25rem; padding: 1.5rem 1.75rem; }
.indice ol { list-style: decimal; padding-left: 1.25rem; display: grid; gap: .4rem; color: #137fec; }
.indice a { color: #2b3138; text-decoration: none; }
.indice a:hover { color: #0b5cb5; text-decoration: underline; }
@media (min-width: 640px) { .indice ol { grid-template-columns: 1fr 1fr; column-gap: 2rem; } }

/* Recuadro "Nota del instalador" */
.nota { border-left: 4px solid #E6B800; background: #fffbea; border-radius: 0 1rem 1rem 0; padding: 1.25rem 1.5rem; margin: 2rem 0; }
.nota p { margin: 0 !important; }
.nota p + p { margin-top: .5rem !important; }
.nota .nota-titulo { font-weight: 800; font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: #8a6d00; }

/* Tablas */
.tabla-scroll { overflow-x: auto; margin: 2rem 0; border: 1px solid #e5e7eb; border-radius: 1rem; }
.tabla { width: 100%; border-collapse: collapse; font-size: .95rem; min-width: 540px; }
.tabla caption { caption-side: bottom; text-align: left; padding: .75rem 1rem; font-size: .8rem; color: #6b7280; }
.tabla th, .tabla td { padding: .85rem 1rem; text-align: left; border-bottom: 1px solid #f0f1f3; vertical-align: top; }
.tabla thead th { background: #f6f7f8; font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: #6b7280; }
.tabla tbody th { font-weight: 800; color: #111418; }
.tabla td span { font-size: .8rem; color: #4b5563; }
.tabla td strong { color: #c2410c; }
.tabla tr.destacada { background: #eef6ff; }
.tabla tbody tr:last-child th, .tabla tbody tr:last-child td { border-bottom: 0; }