/* ══════════════════════════════════════════════════
   VEKTS LAB — BLOG CSS
   Estilos para home del blog y artículos individuales
   ══════════════════════════════════════════════════ */

/* ── BLOG HOME ── */
.blog-hero{padding:140px 0 80px;text-align:center;position:relative;overflow:hidden}
.blog-hero-glow{position:absolute;top:-20%;left:50%;width:800px;height:600px;transform:translateX(-50%);border-radius:50%;pointer-events:none}
[data-theme="dark"] .blog-hero-glow{background:radial-gradient(ellipse,rgba(124,109,250,.15) 0%,transparent 65%)}
[data-theme="light"] .blog-hero-glow{background:radial-gradient(ellipse,rgba(91,77,232,.08) 0%,transparent 65%)}
.blog-hero h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(42px,7vw,88px);font-weight:300;letter-spacing:-.04em;line-height:1;color:var(--tx);margin-bottom:20px}
.blog-hero p{color:var(--tx2);font-size:18px;line-height:1.7;max-width:520px;margin:0 auto 40px}
.blog-cats{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:0}
.blog-cat{padding:5px 16px;border:1px solid var(--brd);border-radius:9999px;font-size:12px;font-weight:600;color:var(--tx2);text-decoration:none;letter-spacing:.04em;transition:all .2s;background:var(--sur)}
.blog-cat:hover,.blog-cat.active{background:var(--ac);color:#fff;border-color:var(--ac)}

/* ── GRID POSTS ── */
.blog-grid-section{padding:40px 0 120px}
.blog-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:20px;margin-top:16px}
.bpost{background:var(--sur);border:1px solid var(--brd);border-radius:20px;overflow:hidden;transition:all .4s cubic-bezier(.23,1,.32,1);text-decoration:none;color:inherit;display:flex;flex-direction:column;position:relative}
.bpost:hover{transform:translateY(-6px);border-color:var(--acbrd);box-shadow:0 24px 60px rgba(0,0,0,.35)}
.bpost::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--ac),var(--ac2));transform:scaleX(0);transform-origin:left;transition:transform .4s}
.bpost:hover::after{transform:scaleX(1)}

/* Tamaños en el grid */
.bpost-featured{grid-column:span 7}
.bpost-side{grid-column:span 5}
.bpost-third{grid-column:span 4}

.bpost-img{aspect-ratio:16/9;overflow:hidden;position:relative}
.bpost-featured .bpost-img{aspect-ratio:16/8}
.bpost-img-inner{width:100%;height:100%;display:flex;align-items:center;justify-content:center;transition:transform .5s cubic-bezier(.23,1,.32,1)}
.bpost:hover .bpost-img-inner{transform:scale(1.04)}

/* Colores de categoría por tipo */
.bcat-seo{background:linear-gradient(135deg,rgba(124,109,250,.25),rgba(168,157,252,.12));border-bottom:1px solid var(--brd)}
.bcat-ia{background:linear-gradient(135deg,rgba(32,212,164,.2),rgba(124,109,250,.1));border-bottom:1px solid var(--brd)}
.bcat-strategy{background:linear-gradient(135deg,rgba(240,112,112,.15),rgba(124,109,250,.1));border-bottom:1px solid var(--brd)}

.bpost-body{padding:24px 26px 26px;flex:1;display:flex;flex-direction:column;gap:12px}
.bpost-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bpost-tag{display:inline-flex;align-items:center;gap:5px;background:var(--acbg);border:1px solid var(--acbrd);color:var(--ac2);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:3px 10px;border-radius:9999px}
.bpost-date{font-size:11px;color:var(--tx3);letter-spacing:.02em}
.bpost-read{font-size:11px;color:var(--tx3)}
.bpost-read::before{content:'·';margin-right:10px}
.bpost h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(17px,2vw,22px);font-weight:500;letter-spacing:-.02em;line-height:1.25;color:var(--tx)}
.bpost-featured h2{font-size:clamp(22px,2.5vw,30px)}
.bpost p.bpost-excerpt{font-size:14px;color:var(--tx2);line-height:1.65;flex:1}
.bpost-author{display:flex;align-items:center;gap:10px;padding-top:14px;border-top:1px solid var(--brd);margin-top:auto}
.bpost-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--ac),var(--ac2));display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0;overflow:hidden}
.bpost-avatar img{width:100%;height:100%;object-fit:cover}
.bpost-author-name{font-size:12px;font-weight:600;color:var(--tx)}
.bpost-author-role{font-size:11px;color:var(--tx3)}
.bpost-arrow{margin-left:auto;width:28px;height:28px;background:var(--acbg);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .3s;flex-shrink:0}
.bpost-arrow svg{width:12px;height:12px;stroke:var(--ac2);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s}
.bpost:hover .bpost-arrow{background:var(--ac)}
.bpost:hover .bpost-arrow svg{stroke:#fff;transform:translate(2px,-2px)}

/* SVG illustrations en las tarjetas */
.bpost-svg-wrap{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:24px}
.bpost-svg-wrap svg{width:100%;height:100%;max-height:200px}
.bpost-featured .bpost-svg-wrap svg{max-height:260px}

/* Newsletter strip */
.blog-nl{padding:80px 0;background:var(--bg2);border-top:1px solid var(--brd);border-bottom:1px solid var(--brd)}
.blog-nl-inner{display:flex;align-items:center;gap:48px;max-width:860px;margin:0 auto;padding:0 40px}
.blog-nl-text{flex:1}
.blog-nl-text h3{font-family:'Space Grotesk',sans-serif;font-size:clamp(22px,2.5vw,30px);font-weight:400;letter-spacing:-.03em;color:var(--tx);margin-bottom:8px}
.blog-nl-text p{font-size:15px;color:var(--tx2);line-height:1.6}
.blog-nl-form{display:flex;gap:10px;flex-shrink:0}
.blog-nl-input{background:var(--sur);border:1px solid var(--brd2);border-radius:12px;padding:11px 16px;font-size:14px;color:var(--tx);font-family:inherit;outline:none;width:240px;transition:border-color .2s}
.blog-nl-input::placeholder{color:var(--tx3)}
.blog-nl-input:focus{border-color:var(--ac)}

/* ══════════════════════════════════════════════════
   ARTÍCULO INDIVIDUAL
   ══════════════════════════════════════════════════ */

/* Hero del artículo */
.art-hero{padding:110px 0 64px;background:var(--bg);position:relative;overflow:hidden}
.art-hero::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 0%,var(--acbg),transparent);pointer-events:none}
.art-hero-inner{position:relative;z-index:1;max-width:800px}
.art-hero-tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.art-hero-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(30px,4.5vw,56px);font-weight:400;letter-spacing:-.04em;line-height:1.08;color:var(--tx);margin-bottom:20px}
.art-hero-title em{font-style:italic;color:var(--ac2)}
.art-hero-sub{font-size:clamp(16px,1.8vw,19px);color:var(--tx2);line-height:1.75;max-width:680px;margin-bottom:28px;font-weight:300}
.art-hero-meta{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--tx3)}
.art-hero-meta strong{color:var(--tx);font-weight:600}
.art-hero-meta span{color:var(--tx3)}

.art-layout{display:grid;grid-template-columns:1fr 240px;gap:40px;max-width:1100px;margin:0 auto;padding:80px 32px 120px;align-items:start}
.art-main{min-width:0}
.art-sidebar{position:sticky;top:90px;width:240px;min-width:0;overflow:visible}

/* TOC en cuerpo del artículo: visible sólo cuando sidebar está oculto */
.art-toc{display:none}
@media(max-width:1080px){.art-toc{display:block}}

/* Header del artículo */
.art-header{margin-bottom:48px}
.art-breadcrumb{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--tx3);margin-bottom:20px;flex-wrap:wrap}
.art-breadcrumb a{color:var(--tx3);text-decoration:none;transition:color .2s}
.art-breadcrumb a:hover{color:var(--ac2)}
.art-breadcrumb span{opacity:.5}
.art-tag{display:inline-flex;align-items:center;gap:5px;background:var(--acbg);border:1px solid var(--acbrd);color:var(--ac2);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 12px;border-radius:9999px;margin-bottom:18px}
.art-h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(28px,4vw,48px);font-weight:400;letter-spacing:-.03em;line-height:1.12;color:var(--tx);margin-bottom:18px}
.art-intro{font-size:18px;color:var(--tx2);line-height:1.75;margin-bottom:28px;font-weight:300}
.art-meta-bar{display:flex;align-items:center;gap:20px;padding:16px 20px;background:var(--sur2);border-radius:12px;border:1px solid var(--brd);flex-wrap:wrap}
.art-meta-item{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--tx3)}
.art-meta-item svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.art-meta-divider{width:1px;height:14px;background:var(--brd2)}

/* Hero visual del artículo */
.art-hero-visual{width:100%;border-radius:20px;overflow:hidden;border:1px solid var(--brd);margin-bottom:48px;background:var(--sur)}
.art-hero-svg{width:100%;display:block}

/* Índice de contenidos */
.art-toc{background:var(--sur);border:1px solid var(--brd);border-radius:16px;padding:24px;margin-bottom:48px}
.art-toc-title{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tx3);margin-bottom:14px;display:flex;align-items:center;gap:8px}
.art-toc-title::before{content:'';width:16px;height:1px;background:var(--ac)}
.art-toc ol,.art-toc-list{list-style:none;counter-reset:toc;display:flex;flex-direction:column;gap:4px;padding:0;margin:0}
.art-toc li{counter-increment:toc;display:flex;align-items:baseline;gap:10px;font-size:13.5px}
.art-toc li::before{content:counter(toc,decimal-leading-zero);font-size:10px;font-weight:700;color:var(--ac);font-family:'Space Grotesk',sans-serif;flex-shrink:0;min-width:18px}
.art-toc a,.art-toc-link{color:var(--tx2);text-decoration:none;line-height:1.4;transition:color .2s}
.art-toc a:hover,.art-toc-link:hover{color:var(--ac2)}

/* Cuerpo del artículo */
.art-body{font-size:16.5px;line-height:1.8;color:var(--tx2)}
.art-body h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(22px,2.8vw,32px);font-weight:400;letter-spacing:-.03em;color:var(--tx);margin:56px 0 20px;line-height:1.2;scroll-margin-top:90px}
.art-body h3{font-family:'Space Grotesk',sans-serif;font-size:clamp(17px,2vw,22px);font-weight:500;letter-spacing:-.02em;color:var(--tx);margin:36px 0 14px;line-height:1.3;scroll-margin-top:90px}
.art-body h4{font-size:15px;font-weight:700;color:var(--tx);margin:28px 0 10px;letter-spacing:.01em}
.art-body p{margin-bottom:22px}
.art-body strong{color:var(--tx);font-weight:600}
.art-body em{color:var(--ac3);font-style:italic}
.art-body a{color:var(--ac2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--acbrd);transition:color .2s,text-decoration-color .2s}
.art-body a:hover{color:var(--ac);text-decoration-color:var(--ac)}
.art-body ul,.art-body ol{padding-left:0;margin:0 0 22px;display:flex;flex-direction:column;gap:8px}
.art-body ul li,.art-body ol li{padding-left:24px;position:relative;font-size:16px;line-height:1.7}
.art-body ul li::before{content:'';position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:var(--ac)}
.art-body ol{counter-reset:ol}
.art-body ol li{counter-increment:ol}
.art-body ol li::before{content:counter(ol)'.';position:absolute;left:0;top:0;font-size:12px;font-weight:700;color:var(--ac);font-family:'Space Grotesk',sans-serif}

/* Callouts / destacados */
.art-callout{border-left:3px solid var(--ac);background:var(--acbg);border-radius:0 12px 12px 0;padding:18px 22px;margin:28px 0;font-size:15px;line-height:1.7}
.art-callout strong{color:var(--ac2)}
.art-callout-warn{border-color:var(--rd);background:rgba(240,112,112,.08)}
.art-callout-green{border-color:var(--gr);background:var(--grbg)}

/* Estadísticas en línea */
.art-stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:32px 0}
.art-stat,.art-stat-item{background:var(--sur);border:1px solid var(--brd);border-radius:14px;padding:20px;text-align:center;transition:border-color .3s}
.art-stat:hover,.art-stat-item:hover{border-color:var(--acbrd)}
.art-stat-val,.art-stat-number{font-family:'Space Grotesk',sans-serif;font-size:clamp(18px,2.5vw,30px);font-weight:600;letter-spacing:-.03em;margin-bottom:6px;line-height:1.2}
/* .art-stat-val usa gradient, .art-stat-number usa color inline del style attribute */
.art-stat-val{background:linear-gradient(135deg,var(--ac),var(--ac2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.art-stat-label{font-size:12px;color:var(--tx3);margin-top:4px;line-height:1.4}

/* Gráficas */
.art-chart-wrap{background:var(--sur);border:1px solid var(--brd);border-radius:16px;padding:24px;margin:32px 0;overflow:hidden}
.art-chart-title{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--tx3);margin-bottom:20px;display:flex;align-items:center;justify-content:space-between}
.art-chart-source{font-size:10px;color:var(--tx3);opacity:.7;font-weight:400;text-transform:none;letter-spacing:0}
.art-chart-svg{width:100%;overflow:visible}
.bar-fill{transition:width .8s cubic-bezier(.34,1.56,.64,1)}

/* ── TABLAS HTML NATIVAS ── */
/* Wrapper para tablas full-width aunque estén dentro de .art-compare */
.art-body .art-compare:has(table){display:block;grid-template-columns:none}
.art-body table{width:100%;min-width:480px;border-collapse:collapse;font-size:14px;margin:32px 0;background:var(--sur);border-radius:14px;border:1px solid var(--brd)}
/* Wrapper overflow para scroll horizontal sin romper border-radius */
.art-body .art-compare:has(table){overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:14px}
.art-body table thead{background:var(--sur2)}
.art-body table th{padding:12px 16px;text-align:left;font-family:'Space Grotesk',sans-serif;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--tx3);border-bottom:1px solid var(--brd2);white-space:nowrap;min-width:120px}
.art-body table th:first-child{min-width:140px}
.art-body table td{padding:12px 16px;border-bottom:1px solid var(--brd);color:var(--tx2);line-height:1.55;vertical-align:top;min-width:120px}
.art-body table tr:last-child td{border-bottom:none}
.art-body table tbody tr:hover td{background:var(--sur2)}
.art-body table td:first-child{color:var(--tx);font-weight:500;min-width:140px}
/* Tabla directa en art-body sin wrapper */
.art-body>table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* Comparativas / tablas */
.art-compare{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:32px 0}
.art-compare-col{background:var(--sur);border:1px solid var(--brd);border-radius:14px;padding:20px;overflow:hidden}
.art-compare-col.highlight{border-color:var(--acbrd);background:var(--acbg)}
.art-compare-head{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3);margin-bottom:14px;display:flex;align-items:center;gap:8px}
.art-compare-head span{width:8px;height:8px;border-radius:50%;background:var(--ac);display:inline-block}
.art-compare-col.highlight .art-compare-head span{background:var(--gr)}
.art-compare-item{display:flex;align-items:flex-start;gap:10px;padding:8px 0;border-bottom:1px solid var(--brd);font-size:13.5px;line-height:1.5}
.art-compare-item:last-child{border-bottom:none}
.art-compare-item svg{width:14px;height:14px;flex-shrink:0;margin-top:2px}

/* Proceso / steps */
.art-steps{display:flex;flex-direction:column;gap:0;margin:32px 0;position:relative}
.art-steps::before{content:'';position:absolute;left:20px;top:40px;bottom:40px;width:1px;background:linear-gradient(to bottom,var(--ac),transparent)}
.art-step{display:flex;gap:20px;padding:20px 0}
.art-step-num{width:40px;height:40px;min-width:40px;background:var(--sur);border:1px solid var(--acbrd);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:700;color:var(--ac);flex-shrink:0;z-index:1;transition:all .3s}
.art-step:hover .art-step-num{background:var(--ac);color:#fff;box-shadow:0 0 20px rgba(124,109,250,.4)}
.art-step-body h4{font-size:15px;font-weight:600;color:var(--tx);margin-bottom:6px}
.art-step-body p{font-size:14px;color:var(--tx2);line-height:1.6;margin:0}

/* ── SIDEBAR ── */
.sidebar-toc{background:var(--sur);border:1px solid var(--brd);border-radius:16px;padding:20px;margin-bottom:20px}
.sidebar-toc-title{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tx3);margin-bottom:12px}
.sidebar-toc nav,.sidebar-toc ul,.sidebar-toc-list{display:flex;flex-direction:column;gap:2px;list-style:none;padding:0;margin:0}
.sidebar-toc a,.sidebar-toc-link{font-size:13px;color:var(--tx2);text-decoration:none;padding:5px 8px;border-radius:8px;line-height:1.4;transition:all .2s;display:block;word-break:break-word;overflow-wrap:break-word}
.sidebar-toc a:hover,.sidebar-toc-link:hover,.sidebar-toc a.active,.sidebar-toc-link.active{color:var(--ac2);background:var(--acbg)}
.sidebar-toc a.h3-link,.sidebar-toc li.h3 a,.sidebar-toc-link.h3-link{padding-left:20px;font-size:12px;opacity:.8}

.sidebar-cta{background:linear-gradient(135deg,var(--acbg),var(--sur));border:1px solid var(--acbrd);border-radius:16px;padding:22px;margin-bottom:20px;text-align:center}
.sidebar-cta h4{font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:500;color:var(--tx);margin-bottom:8px;letter-spacing:-.02em}
.sidebar-cta p{font-size:13px;color:var(--tx2);line-height:1.55;margin-bottom:16px}
.sidebar-cta a.btn{display:inline-flex;align-items:center;gap:6px;background:var(--ac);color:#fff;text-decoration:none;font-size:13px;font-weight:600;padding:9px 18px;border-radius:9999px;transition:all .25s}
.sidebar-cta a.btn:hover{opacity:.88;transform:translateY(-1px)}

.sidebar-related{background:var(--sur);border:1px solid var(--brd);border-radius:16px;padding:20px}
.sidebar-related-title{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tx3);margin-bottom:14px}
.sidebar-related a,.sidebar-related-item{display:flex;gap:12px;align-items:flex-start;text-decoration:none;padding:10px 0;border-bottom:1px solid var(--brd);transition:opacity .2s}
.sidebar-related a:last-child,.sidebar-related-item:last-child{border-bottom:none;padding-bottom:0}
.sidebar-related a:hover,.sidebar-related-item:hover{opacity:.75}
.sidebar-rel-num{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:700;color:var(--acbrd);flex-shrink:0;line-height:1}
.sidebar-rel-text{font-size:12.5px;color:var(--tx2);line-height:1.5}
/* Variante con tag */
.sidebar-related-item-tag{font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--acbg);border:1px solid var(--acbrd);color:var(--ac2);padding:2px 7px;border-radius:9999px;flex-shrink:0;margin-top:2px;white-space:nowrap}
.sidebar-related-item-title{font-size:12.5px;color:var(--tx2);line-height:1.5;flex:1}

/* ── SIDEBAR CTA variantes ── */
.sidebar-cta-icon{font-size:24px;margin-bottom:10px;display:block}
.sidebar-cta-title{font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:500;color:var(--tx);margin-bottom:6px;letter-spacing:-.02em}
.sidebar-cta-sub,.sidebar-cta-text{font-size:13px;color:var(--tx2);line-height:1.55;margin-bottom:16px}
.sidebar-related-link{display:block;font-size:12.5px;color:var(--ac2);text-decoration:none;margin-top:10px;font-weight:500;transition:opacity .2s}
.sidebar-related-link:hover{opacity:.75}

/* ── CALLOUTS variantes ── */
.art-callout--info,.art-callout--warn,.art-callout--success,.art-callout-warning,.art-callout-error{border-left:3px solid var(--ac);background:var(--acbg);border-radius:0 12px 12px 0;padding:18px 22px;margin:28px 0;font-size:15px;line-height:1.7;display:flex;gap:12px;align-items:flex-start}
.art-callout--warn,.art-callout-warning{border-color:var(--rd);background:rgba(240,112,112,.08)}
.art-callout--success{border-color:var(--gr);background:var(--grbg)}
.art-callout-error{border-color:var(--rd);background:rgba(240,112,112,.08)}
.art-callout-icon{font-size:20px;flex-shrink:0;line-height:1.4}

/* ── CTA SECTION variantes ── */
.art-cta-label{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ac2);margin-bottom:8px}
.art-cta-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(20px,2.5vw,28px);font-weight:400;letter-spacing:-.03em;color:var(--tx);margin-bottom:10px}
.art-cta-sub{font-size:15px;color:var(--tx2);line-height:1.65;max-width:500px;margin:0 auto 24px}
.art-cta-actions,.art-cta-acts{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ── STEP variantes ── */
.art-step-content{flex:1}
.art-step-content h4{font-size:15px;font-weight:600;color:var(--tx);margin-bottom:6px}
.art-step-content p{font-size:14px;color:var(--tx2);line-height:1.6;margin:0}

/* ── AUTOR variantes ── */
.art-author-content{flex:1}
.art-author-badge{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:var(--acbg);border:1px solid var(--acbrd);color:var(--ac2);padding:3px 10px;border-radius:9999px;margin-bottom:6px}

/* ── CONF SLIDE (artículo GEO) ── */
.conf-slide{background:linear-gradient(135deg,#1a1a2e,#16213e);border:1px solid var(--brd);border-radius:20px;padding:40px;margin:32px 0;text-align:center;position:relative;overflow:hidden}
.conf-slide-tags{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.conf-slide-tag{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:9999px;font-size:12px;font-weight:600;border:1px solid var(--brd);color:var(--tx3)}
.conf-slide-tag.strikethrough{text-decoration:line-through;opacity:.5}
.conf-slide-tag.real,.real{background:var(--acbg);border-color:var(--acbrd);color:var(--ac2);text-decoration:none;opacity:1}
.conf-slide-quote{font-family:'Space Grotesk',sans-serif;font-size:clamp(22px,3.5vw,40px);font-weight:400;letter-spacing:-.03em;color:var(--tx);line-height:1.2;margin:20px 0 16px}
.conf-slide-label{font-size:13px;color:var(--tx2);line-height:1.6}
.conf-slide-source{font-size:11px;color:var(--tx3);margin-top:10px;letter-spacing:.02em}

/* ── CHART variantes ── */
.art-chart-subtitle{font-size:12px;color:var(--tx3);margin-top:4px;font-weight:400;text-transform:none;letter-spacing:0}

/* ── CAJA DE AUTOR ── */
.art-author-box{background:var(--sur);border:1px solid var(--brd);border-radius:20px;padding:28px 32px;margin-top:56px;display:flex;gap:24px;align-items:flex-start;position:relative;overflow:hidden}
.art-author-box::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--ac),var(--ac2),var(--ac3))}
.art-author-avatar{width:72px;height:72px;min-width:72px;border-radius:50%;background:linear-gradient(135deg,var(--ac),var(--ac2));display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-size:22px;font-weight:700;color:#fff;overflow:hidden;flex-shrink:0}
.art-author-avatar img{width:100%;height:100%;object-fit:cover}
.art-author-info{flex:1}
.art-author-label{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tx3);margin-bottom:4px}
.art-author-name{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:500;color:var(--tx);letter-spacing:-.02em;margin-bottom:2px}
.art-author-title{font-size:13px;color:var(--ac2);font-weight:500;margin-bottom:12px}
.art-author-bio{font-size:14px;color:var(--tx2);line-height:1.65;margin-bottom:16px}
.art-author-links{display:flex;gap:10px;flex-wrap:wrap}
.art-author-link{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--tx2);text-decoration:none;padding:5px 12px;border:1px solid var(--brd);border-radius:9999px;transition:all .2s}
.art-author-link:hover{color:var(--ac2);border-color:var(--acbrd);background:var(--acbg)}
.art-author-link svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ── CTA FINAL ── */
.art-cta-section{background:linear-gradient(135deg,var(--acbg),var(--bg2));border:1px solid var(--acbrd);border-radius:20px;padding:40px;margin-top:48px;text-align:center;position:relative;overflow:hidden}
.art-cta-section::before{content:'';position:absolute;inset:-1px;border-radius:21px;background:linear-gradient(135deg,var(--ac),var(--ac2),transparent);opacity:.15;pointer-events:none}
.art-cta-section h3{font-family:'Space Grotesk',sans-serif;font-size:clamp(20px,2.5vw,28px);font-weight:400;letter-spacing:-.03em;color:var(--tx);margin-bottom:12px}
.art-cta-section p{font-size:15px;color:var(--tx2);line-height:1.65;max-width:500px;margin:0 auto 24px}
.art-cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ── ARTÍCULOS RELACIONADOS ── */
.art-related{padding:48px 0 80px;background:var(--bg2);border-top:1px solid var(--brd);margin-top:56px}
.art-related-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(18px,2vw,24px);font-weight:400;letter-spacing:-.02em;color:var(--tx);margin-bottom:32px}
.art-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.art-related-card{display:flex;flex-direction:column;gap:10px;text-decoration:none;padding:24px;background:var(--sur);border:1px solid var(--brd);border-radius:16px;transition:all .3s cubic-bezier(.23,1,.32,1)}
.art-related-card:hover{border-color:var(--acbrd);transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.3)}
.art-related-tag{display:inline-flex;align-items:center;background:var(--acbg);border:1px solid var(--acbrd);color:var(--ac2);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:3px 10px;border-radius:9999px;width:fit-content}
.art-related-card-title{font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:500;color:var(--tx);line-height:1.35;letter-spacing:-.01em;flex:1}
.art-related-meta{font-size:12px;color:var(--tx3)}

/* ── PROGRESS BAR ── */
.read-progress{position:fixed;top:0;left:0;height:2px;background:linear-gradient(90deg,var(--ac),var(--ac2));z-index:9998;transition:width .1s;width:0}

/* ── RESPONSIVE ── */
@media(max-width:1080px){
  .art-layout{grid-template-columns:1fr;padding:60px 24px 80px}
  .art-sidebar{position:static;display:none}
  .bpost-featured{grid-column:span 12}
  .bpost-side{grid-column:span 12}
  .bpost-third{grid-column:span 6}
  .art-related-grid{grid-template-columns:1fr 1fr}
  .blog-nl-inner{flex-direction:column;text-align:center}
  .blog-nl-form{width:100%;flex-direction:column}
  .blog-nl-input{width:100%}
}
@media(max-width:768px){
  .bpost-third{grid-column:span 12}
  .art-stat-row{grid-template-columns:1fr 1fr}
  .art-compare{grid-template-columns:1fr}
  .art-author-box{flex-direction:column;align-items:center;text-align:center}
  .art-author-links{justify-content:center}
  .art-related-grid{grid-template-columns:1fr}
  .art-hero-visual{border-radius:14px}
  .blog-grid-section{padding:24px 0 80px}
  .art-layout{grid-template-columns:1fr;padding:40px 20px 60px}
  .art-sidebar{display:none}
  .art-hero{padding:90px 0 48px}
  .art-hero-inner{padding:0 20px}
}
@media(max-width:480px){
  .art-stat-row{grid-template-columns:1fr}
  .art-cta-btns{flex-direction:column;align-items:center}
  .art-hero{padding:80px 0 40px}
}
