/* =============================================================================
 *  Presivo — single article (magazine layout)
 *  Scoped under .art; uses --accent (set inline). Loaded only on article pages.
 * ========================================================================== */
.art { --line:#e5e7eb; --muted:#6b7280; --ink:#14181f; max-width:1180px; margin:0 auto;
       display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:2.4rem; }
.art a { color:inherit; }
.art .badge-cat { display:inline-block; background:var(--accent); color:#fff; font-size:.68rem; font-weight:800;
                  text-transform:uppercase; letter-spacing:.05em; padding:.18rem .55rem; border-radius:3px; text-decoration:none; }

/* ---- header ---- */
.art__main { min-width:0; }
.art__head { margin-bottom:1.2rem; }
.art__disclosure { background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; font-size:.82rem; padding:.5rem .8rem; border-radius:7px; margin-bottom:1rem; }
.art__kicker { color:var(--accent); font-weight:700; text-transform:uppercase; letter-spacing:.04em; font-size:.8rem; margin:.6rem 0 .2rem; }
.art__title { font-size:2.3rem; line-height:1.12; font-weight:800; letter-spacing:-.01em; margin:.5rem 0 .6rem; color:var(--ink); }
.art__standfirst { font-size:1.12rem; line-height:1.5; color:#374151; margin:0 0 1rem; }
.art__byline { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem .7rem; padding:.8rem 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:var(--muted); font-size:.85rem; }
.art__byline .by-author { color:var(--accent); font-weight:700; }
.art__byline .by-sep { color:#cbd5e1; }
.art__byline .by-views strong { color:var(--ink); }

/* ---- share ---- */
.art__share { display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0 0; }
.art-share { display:inline-flex; align-items:center; gap:.4rem; padding:.42rem .7rem; border-radius:6px; color:#fff;
             text-decoration:none; font-size:.82rem; font-weight:700; }
.art-share svg { width:15px; height:15px; }
.art-share--facebook { background:#1877f2; } .art-share--x { background:#111; }
.art-share--whatsapp { background:#25d366; } .art-share--telegram { background:#0088cc; }
.art-share--linkedin { background:#0a66c2; }
.art-share:hover { filter:brightness(1.08); }

/* ---- cover ---- */
.art__cover { margin:1.4rem 0; }
.art__cover img { width:100%; height:auto; border-radius:10px; display:block; }
.art__cover figcaption { display:flex; flex-wrap:wrap; gap:.8rem; color:var(--muted); font-size:.76rem; margin-top:.5rem; }

/* ---- body ---- */
.art__body { font-size:1.06rem; line-height:1.75; color:#1f2733; }
.art__body > p { margin:0 0 1.1rem; }
.art__body > p:first-of-type::first-letter { float:left; font-size:3.4rem; line-height:.82; font-weight:800; color:var(--accent); padding:.1rem .6rem .1rem 0; }
.art__body h2 { font-size:1.5rem; font-weight:800; margin:1.8rem 0 .7rem; line-height:1.25; }
.art__body h3 { font-size:1.2rem; font-weight:700; margin:1.4rem 0 .6rem; }
.art__body ul, .art__body ol { margin:0 0 1.1rem 1.3rem; }
.art__body li { margin:.3rem 0; }
.art__body a { color:var(--accent); text-decoration:underline; text-underline-offset:2px; }
.art__body blockquote { margin:1.5rem 0; padding:.4rem 0 .4rem 1.2rem; border-left:4px solid var(--accent); font-style:italic; color:#374151; }
.art__body blockquote cite { display:block; font-style:normal; font-weight:700; color:var(--muted); font-size:.85rem; margin-top:.4rem; }
.art__body .article-pullquote { border:0; border-top:3px solid var(--accent); border-bottom:3px solid var(--accent); padding:1.1rem 0; margin:1.8rem 0; font-size:1.4rem; line-height:1.4; font-weight:700; font-style:normal; color:var(--ink); text-align:center; }
.art__body .article-figure { margin:1.5rem 0; }
.art__body .article-figure img { width:100%; border-radius:10px; }
.art__body .article-figure figcaption { color:var(--muted); font-size:.78rem; margin-top:.4rem; }
.art__body .article-callout { border:1px solid var(--line); border-left:4px solid var(--accent); background:#f8fafc; border-radius:8px; padding:.9rem 1rem; margin:1.4rem 0; }
.art__body .article-callout__title { font-weight:800; margin:0 0 .3rem; }
.art__body .article-rule { border:0; border-top:1px solid var(--line); margin:2rem 0; }
.art__body .article-gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:.6rem; margin:1.5rem 0; }
.art__body .article-gallery img { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:8px; }
.art__body .article-embed { margin:1.5rem 0; }
.art__body .article-embed__consent { border:1px dashed var(--line); border-radius:8px; padding:1.2rem; text-align:center; background:#f8fafc; }
.art__body .article-embed__load { margin-top:.5rem; background:var(--accent); color:#fff; border:0; border-radius:6px; padding:.5rem 1rem; font-weight:700; cursor:pointer; }
.art__inline-ad { display:flex; justify-content:center; margin:1.8rem 0; }

/* ---- tags row ---- */
.art__tags { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin:1.8rem 0 0; padding-top:1.2rem; border-top:1px solid var(--line); }
.tag-pill { display:inline-block; background:#f1f3f5; color:#4b5563; font-size:.78rem; font-weight:600; padding:.25rem .6rem; border-radius:999px; }
.tag-pill::before { content:"#"; color:var(--accent); font-weight:800; }

/* ---- author box ---- */
.art__author { display:flex; gap:1rem; align-items:flex-start; margin:2rem 0 0; padding:1.2rem; border:1px solid var(--line); border-radius:12px; background:#fafbfc; }
.art__author-avatar { width:64px; height:64px; border-radius:50%; overflow:hidden; flex:0 0 auto; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:1.5rem; }
.art__author-avatar img { width:100%; height:100%; object-fit:cover; }
.art__author-name { font-weight:800; font-size:1.05rem; margin:0 0 .2rem; }
.art__author-role { color:var(--accent); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.art__author-bio { color:var(--muted); font-size:.88rem; line-height:1.55; margin:.4rem 0 0; }

/* ---- sidebar ---- */
.art__side { align-self:start; min-width:0; }
.art-widget { margin-bottom:1.8rem; }
.art-widget__head { font-weight:800; text-transform:uppercase; font-size:.85rem; letter-spacing:.04em; margin:0 0 1rem; padding-bottom:.5rem; border-bottom:2px solid var(--accent); display:inline-block; }
.art-search { display:flex; border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.art-search input { flex:1; min-width:0; border:0; outline:none; padding:.55rem .7rem; font-size:.88rem; }
.art-search button { border:0; background:var(--accent); color:#fff; padding:0 .9rem; cursor:pointer; }

.art-pop { list-style:none; margin:0; padding:0; }
.art-pop__item { display:grid; grid-template-columns:auto 1fr; gap:.7rem; align-items:start; padding:.6rem 0; border-bottom:1px solid var(--line); }
.art-pop__item:last-child { border-bottom:0; }
.art-pop__rank { font-weight:800; font-size:1.2rem; color:#d1d5db; line-height:1.1; }
.art-pop__item:nth-child(1) .art-pop__rank, .art-pop__item:nth-child(2) .art-pop__rank, .art-pop__item:nth-child(3) .art-pop__rank { color:var(--accent); }
.art-pop__title { font-weight:700; font-size:.9rem; line-height:1.3; text-decoration:none; color:var(--ink); }
.art-pop__title:hover { color:var(--accent); }
.art-pop__meta { display:block; color:var(--muted); font-size:.72rem; margin-top:.15rem; }

.art-feat { display:block; text-decoration:none; color:inherit; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.art-feat__img { aspect-ratio:16/9; background:#eef1f4; }
.art-feat__img img { width:100%; height:100%; object-fit:cover; display:block; }
.art-feat__body { padding:.9rem; }
.art-feat__title { font-weight:800; font-size:1rem; line-height:1.3; margin:.5rem 0 .4rem; }
.art-feat:hover .art-feat__title { color:var(--accent); }
.art-feat__lead { color:var(--muted); font-size:.84rem; line-height:1.5; margin:0 0 .7rem; }
.art-feat__btn { display:inline-block; background:var(--accent); color:#fff; font-weight:700; font-size:.8rem; padding:.4rem .8rem; border-radius:6px; }

.art-social { display:flex; flex-direction:column; gap:.5rem; }
.art-social a { display:flex; align-items:center; justify-content:space-between; padding:.6rem .8rem; border-radius:7px; color:#fff; text-decoration:none; font-weight:700; font-size:.88rem; }
.art-social a span.cta { font-weight:600; font-size:.78rem; opacity:.95; }
.art-social .s-facebook { background:#1877f2; } .art-social .s-x { background:#111; } .art-social .s-instagram { background:linear-gradient(45deg,#f09433,#dc2743,#bc1888); }

.art-tags { display:flex; flex-wrap:wrap; gap:.4rem; }

.art-nl { border:1px solid var(--line); border-radius:10px; padding:1rem; background:#fafbfc; }
.art-nl p { font-size:.85rem; color:var(--muted); line-height:1.5; margin:0 0 .7rem; }
.art-nl input { width:100%; border:1px solid var(--line); border-radius:7px; padding:.55rem .7rem; font-size:.85rem; margin-bottom:.5rem; outline:none; }
.art-nl button { width:100%; border:0; background:var(--accent); color:#fff; font-weight:700; border-radius:7px; padding:.55rem; cursor:pointer; }
.art-widget--ad { display:flex; justify-content:center; }

/* ---- responsive ---- */
@media (max-width:980px) {
  .art { grid-template-columns:1fr; gap:1.6rem; }
  .art__title { font-size:1.85rem; }
}
