/* Estilos de contenido de artículo — COMPARTIDOS entre el editor (CMS) y el sitio (SSR).
   Scope .article → WYSIWYG: en el panel se ve igual que publicado. Colores de marca fijos. */
.article{--ab-gold:#c9a24a;--ab-gold2:#e6c877;--ab-cream:#ece6d6;--ab-txt:#e7e2d4;--ab-mut:#9a9aa6;--ab-line:#2b2b33;--ab-panel:#17171c;
  color:var(--ab-txt);line-height:1.85;font-size:1.02rem}
.article > *:first-child{margin-top:0}
.article p{margin:0 0 1.15rem}
.article h2{font-family:'Cinzel',Georgia,serif;font-size:1.55rem;color:var(--ab-gold2);margin:2rem 0 .8rem;line-height:1.2}
.article h3{font-size:1.2rem;color:var(--ab-cream);margin:1.6rem 0 .55rem;font-weight:600}
.article a{color:var(--ab-gold2);text-decoration:underline;text-underline-offset:2px}
.article strong{color:#fff}
.article ul,.article ol{margin:0 0 1.2rem;padding-left:1.4rem}
.article li{margin:.3rem 0}
.article blockquote{border-left:3px solid var(--ab-gold);margin:1.4rem 0;padding:.4rem 0 .4rem 1.2rem;color:#e4d9bf;font-style:italic;font-size:1.15rem}
.article hr{border:none;border-top:1px solid var(--ab-line);margin:2rem 0}
.article img{max-width:100%;height:auto;border-radius:10px;margin:1.2rem 0;border:1px solid var(--ab-line);display:block}
.article pre{background:rgba(0,0,0,.4);border:1px solid var(--ab-line);border-radius:8px;padding:1rem;overflow:auto;margin:1.2rem 0}
.article code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.9em;color:#d9c99f}
.article pre code{color:#d9c99f}

/* tablas (incluye "tabla comparativa") */
.article table{width:100%;border-collapse:collapse;margin:1.4rem 0;font-size:.95rem}
.article th,.article td{border:1px solid var(--ab-line);padding:.6rem .8rem;text-align:left}
.article th{background:rgba(201,162,74,.1);color:var(--ab-gold2)}

/* checklist (task list) */
.article ul[data-type="taskList"]{list-style:none;padding-left:.2rem}
.article ul[data-type="taskList"] li{display:flex;gap:.55rem;align-items:flex-start}
.article ul[data-type="taskList"] li>label{flex:none;margin-top:.15rem}
.article ul[data-type="taskList"] input{accent-color:var(--ab-gold)}

/* YouTube */
.article div[data-youtube-video]{position:relative;padding-bottom:56.25%;height:0;margin:1.4rem 0;border-radius:12px;overflow:hidden;border:1px solid var(--ab-line)}
.article div[data-youtube-video] iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Callout */
.article .nota-callout{position:relative;border:1px solid var(--ab-line);border-left:3px solid var(--ab-gold);background:rgba(201,162,74,.06);border-radius:10px;padding:.9rem 1.1rem .9rem 2.7rem;margin:1.4rem 0}
.article .nota-callout::before{content:"◆";position:absolute;left:1rem;top:.85rem;color:var(--ab-gold)}
.article .nota-callout[data-tone="tip"]{border-left-color:#5fd08a}.article .nota-callout[data-tone="tip"]::before{content:"✦";color:#5fd08a}
.article .nota-callout[data-tone="warn"]{border-left-color:#e0a63a;background:rgba(224,166,58,.06)}.article .nota-callout[data-tone="warn"]::before{content:"!";color:#e0a63a}
.article .nota-callout>*{margin:.3rem 0}
.article .nota-callout>*:first-child{margin-top:0}.article .nota-callout>*:last-child{margin-bottom:0}

/* FAQ (details/summary) */
.article .nota-faq{border:1px solid var(--ab-line);border-radius:10px;margin:.7rem 0;background:var(--ab-panel);overflow:hidden}
.article .nota-faq>summary{cursor:pointer;padding:.85rem 1.1rem;font-weight:600;color:var(--ab-cream);list-style:none;position:relative}
.article .nota-faq>summary::-webkit-details-marker{display:none}
.article .nota-faq>summary::after{content:"+";position:absolute;right:1.1rem;color:var(--ab-gold)}
.article .nota-faq[open]>summary::after{content:"–"}
.article .nota-faq .faq-a{padding:0 1.1rem 1rem;color:var(--ab-mut)}
.article .nota-faq .faq-a>*{margin:.4rem 0}

/* Botón / CTA */
.article .nota-btn{display:inline-block;background:linear-gradient(180deg,#e6c877,#c9a24a 60%,#8a6a2a);color:#1a1408;font-weight:700;letter-spacing:.03em;padding:.7rem 1.4rem;border-radius:9px;text-decoration:none;margin:1rem 0}
.article a.nota-btn:hover{filter:brightness(1.06)}

/* Galería */
.article .nota-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.6rem;margin:1.4rem 0}
.article .nota-gallery img{margin:0;height:100%;object-fit:cover;aspect-ratio:4/3}

/* Índice automático */
.article .nota-toc{border:1px solid var(--ab-line);border-radius:10px;padding:1rem 1.2rem;margin:1.4rem 0;background:var(--ab-panel)}
.article .nota-toc-h{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ab-gold);margin-bottom:.5rem}
.article .nota-toc a{display:block;color:var(--ab-mut);text-decoration:none;padding:.2rem 0;font-size:.92rem}
.article .nota-toc a:hover{color:var(--ab-gold2)}
.article .nota-toc a.lvl3{padding-left:1rem;font-size:.86rem}