/* Blog de Quantus-Hub — estilos compartidos por el índice y las notas.
   Tokens y tipografía del Manual de Identidad de Marca v1.0 (Inter + IBM Plex Mono, paleta oficial). */

@font-face{font-family:'Inter'; font-style:normal; font-weight:100 900; font-display:swap; src:url('../../fonts/Inter-Variable.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono'; font-style:normal; font-weight:400; font-display:swap; src:url('../../fonts/IBMPlexMono-Regular.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono'; font-style:normal; font-weight:500; font-display:swap; src:url('../../fonts/IBMPlexMono-Medium.woff2') format('woff2');}

:root{
  --void:#0A0910;
  --void-2:#15181D;
  --border:rgba(255,255,255,.09);
  --violet:#553E7F;
  --violet-light:#896CB5;
  --violet-2:#466EA0;
  --blue-mid:#389FC1;
  --blue:#29CFE2;
  --cyan-pulse:#6DE5F3;
  --ink:#F2F0F7;
  --body:#DAD8E3;
  --muted:#B9B9C4;
  --font-display:'Inter', 'Inter var', system-ui, -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --font-body:'Inter', 'Inter var', system-ui, -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --font-mono:'IBM Plex Mono', 'Courier New', monospace;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }
body{
  background:var(--void); color:var(--ink); font-family:var(--font-body);
  line-height:1.6; min-height:100svh; -webkit-font-smoothing:antialiased;
  display:flex; flex-direction:column; font-variant-numeric:tabular-nums;
}
a{color:inherit;}
img,svg{display:block; max-width:100%;}
::selection{background:var(--violet); color:var(--ink);}
a:focus-visible, button:focus-visible, input:focus-visible + .dx-box{outline:2px solid var(--cyan-pulse); outline-offset:3px; border-radius:3px;}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

.wrap{max-width:1180px; margin:0 auto; padding-inline:clamp(20px, 5vw, 48px); width:100%;}

/* ---------- Barra, botones, pie ---------- */
nav.top{
  position:sticky; top:0; z-index:30; display:flex; align-items:center; justify-content:space-between;
  padding:14px clamp(20px,5vw,48px); border-bottom:1px solid var(--border);
  background:rgba(10,9,16,.86); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
}
.brand{display:flex; align-items:center; gap:.5em; text-decoration:none;}
.brand-mark{height:38px; width:auto; flex:none;}
.brand-word{font-family:var(--font-display); font-weight:700; font-size:1.1rem; color:var(--ink);}
.top-links{display:flex; align-items:center; gap:clamp(14px,3vw,28px);}
.top-links a.plain{font-family:var(--font-mono); font-size:.8rem; letter-spacing:.06em; color:var(--muted); text-decoration:none; padding:6px 2px; border-bottom:1px solid transparent;}
.top-links a.plain:hover, .top-links a.plain[aria-current]{color:var(--ink); border-bottom-color:var(--blue);}
.btn{
  display:inline-flex; align-items:center; gap:.6em; font-family:var(--font-mono); font-size:.85rem; letter-spacing:.04em;
  padding:.9em 1.6em; border-radius:999px; text-decoration:none; cursor:pointer; border:1px solid transparent;
  transition:transform .3s var(--ease), background-color .3s ease, border-color .3s ease, color .3s ease, box-shadow .35s ease;
}
.btn-primary{color:var(--void); background:var(--blue); font-weight:600; box-shadow:0 6px 20px rgba(41,207,226,.35), 0 1px 2px rgba(0,0,0,.2);}
.btn-primary:hover{background:var(--cyan-pulse); transform:translateY(-2px); box-shadow:0 10px 28px rgba(41,207,226,.5), 0 2px 4px rgba(0,0,0,.25);}
.btn-ghost{color:var(--ink); border-color:var(--border); box-shadow:0 2px 10px rgba(0,0,0,.25);}
.btn-ghost:hover{border-color:var(--blue); color:var(--blue); transform:translateY(-2px); box-shadow:0 6px 18px rgba(41,207,226,.22);}
@media (max-width:560px){ .top-links a.plain{display:none;} }

main{flex:1;}
footer{border-top:1px solid var(--border); padding:28px 0; margin-top:clamp(56px,8vw,96px);}
.footer-inner{display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between;}
.footer-tag{font-family:var(--font-mono); font-size:.76rem; color:var(--muted);}
.footer-back{font-family:var(--font-mono); font-size:.78rem; color:var(--blue); text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:1px;}
.footer-back:hover{color:var(--ink);}

.eyebrow{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--blue); display:inline-flex; align-items:center; gap:.6em; margin-bottom:20px;
}
.eyebrow::before{content:""; width:22px; height:1px; background:var(--blue);}
h1 em, h2 em{font-style:normal; background:linear-gradient(100deg,var(--violet-light),var(--blue)); -webkit-background-clip:text; background-clip:text; color:transparent;}

/* ---------- Compartir ---------- */
.share{display:flex; flex-wrap:wrap; align-items:center; gap:10px;}
.share-label{font-family:var(--font-mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-right:4px;}
.chip{
  position:relative; z-index:2; display:inline-flex; align-items:center; gap:.5em; cursor:pointer;
  font-family:var(--font-mono); font-size:.78rem; letter-spacing:.03em; line-height:1;
  color:var(--ink); background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:999px;
  padding:.7em 1.05em; text-decoration:none; white-space:nowrap;
  transition:border-color .25s ease, color .25s ease, background-color .25s ease, transform .25s var(--ease);
}
.chip svg{width:15px; height:15px; flex:none;}
.chip:hover{border-color:var(--blue); color:var(--blue); transform:translateY(-1px);}
.chip.is-done{border-color:var(--blue); color:var(--void); background:var(--blue);}
.share-dock{display:none;}

/* ---------- La cadena ---------- */
.chain{list-style:none; display:flex; align-items:center; gap:0; margin:0 0 26px;}
.chain li{display:flex; align-items:center;}
.chain li:not(:last-child)::after{content:""; width:clamp(18px,4vw,34px); height:2px; background:repeating-linear-gradient(90deg, rgba(255,255,255,.22) 0 4px, transparent 4px 8px);}
.chain li.on:not(:last-child)::after{background:repeating-linear-gradient(90deg, rgba(255,255,255,.22) 0 4px, transparent 4px 8px);}
.chain .node{
  width:30px; height:30px; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); font-size:.72rem; font-weight:500; color:var(--muted);
  border:1px solid var(--border); background:var(--void-2); clip-path:polygon(15% 0, 100% 0, 85% 100%, 0 100%);
}
.chain li.on .node{background:var(--blue); color:var(--void); border-color:var(--blue);}
.chain-note{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-left:16px;}

/* ---------- Índice del blog ---------- */
.blog-hero{position:relative; overflow:hidden; padding-block:clamp(44px,7vw,84px) clamp(28px,4vw,44px);}
.blog-hero::before{content:""; position:absolute; inset:-30% -10% auto -10%; height:90%; background:radial-gradient(ellipse at 25% 20%, rgba(41,207,226,.13), transparent 60%); pointer-events:none;}
.blog-hero > .wrap{position:relative;}
.blog-hero h1{
  font-family:var(--font-display); font-weight:800; text-transform:uppercase; letter-spacing:.01em; line-height:1.04;
  text-wrap:balance; font-size:clamp(2.1rem,5.4vw,3.8rem); max-width:18ch; margin-bottom:20px;
}
.blog-hero .lede{color:var(--ink); opacity:.82; font-size:clamp(1.02rem,1.6vw,1.18rem); max-width:56ch;}

.serie-head{display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:8px 24px; margin-bottom:28px;}
.serie-head h2{font-family:var(--font-display); font-weight:800; text-transform:uppercase; font-size:clamp(1.15rem,2.4vw,1.5rem); letter-spacing:.01em;}
.serie-head p{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);}

.cadena{position:relative; list-style:none; display:grid; gap:22px; padding-left:clamp(44px,7vw,72px);}
.cadena > li{position:relative;}
.cadena > li::before{content:""; position:absolute; left:calc(-1 * clamp(44px,7vw,72px) / 2 - 1px); top:36px; bottom:-22px; width:2px; background:repeating-linear-gradient(180deg, rgba(255,255,255,.28) 0 5px, transparent 5px 10px);}
.cadena > li.done::before{background:var(--blue);}
.cadena > li:last-child::before{display:none;}
.cadena .pin{
  position:absolute; left:calc(-1 * clamp(44px,7vw,72px) + (clamp(44px,7vw,72px) / 2) - 18px); top:18px; width:36px; height:36px;
  display:flex; align-items:center; justify-content:center; font-family:var(--font-mono); font-size:.78rem; font-weight:500;
  z-index:1; background:var(--void); color:var(--muted); border:1px solid rgba(255,255,255,.22); clip-path:polygon(15% 0, 100% 0, 85% 100%, 0 100%);
}
.cadena .pin.on{background:var(--blue); color:var(--void); border-color:var(--blue);}

.card{
  position:relative; display:grid; grid-template-columns:1fr; background:var(--void-2); border:1px solid var(--border);
  border-left:3px solid var(--blue); border-radius:8px; overflow:hidden;
  transition:transform .35s var(--ease), border-color .3s ease, box-shadow .35s ease;
}
.card:hover{transform:translateY(-4px); border-color:var(--blue); box-shadow:0 18px 40px rgba(41,207,226,.16);}
@media (min-width:900px){ .card{grid-template-columns:1.05fr 1fr;} }
.card-img{position:relative; background:#050409; min-height:200px;}
.card-img img{width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease);}
.card:hover .card-img img{transform:scale(1.04);}
.card-body{padding:clamp(22px,3vw,34px); display:flex; flex-direction:column; gap:14px;}
.card-kicker{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--blue);}
.card h3{font-family:var(--font-display); font-weight:800; font-size:clamp(1.35rem,2.6vw,1.85rem); line-height:1.12; text-wrap:balance; letter-spacing:-.005em;}
.card h3 a{text-decoration:none;}
.card h3 a::after{content:""; position:absolute; inset:0; z-index:1;}
.card-sum{color:var(--body); font-size:1rem; line-height:1.6;}
.card-meta{font-family:var(--font-mono); font-size:.74rem; color:var(--muted); letter-spacing:.04em;}
.card-foot{margin-top:auto; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px 18px; padding-top:6px;}
.card-read{font-family:var(--font-mono); font-size:.84rem; font-weight:600; color:var(--blue); letter-spacing:.03em;}
.card:hover .card-read{color:var(--cyan-pulse);}

.card.is-locked{border-left-color:rgba(255,255,255,.2); border-style:dashed; border-left-style:dashed; background:transparent; grid-template-columns:1fr; padding:0;}
.card.is-locked:hover{transform:none; box-shadow:none; border-color:rgba(255,255,255,.2);}
.card.is-locked .card-body{padding:18px clamp(18px,3vw,26px); gap:6px;}
.card.is-locked h3{font-size:1.1rem; color:var(--muted); font-weight:700;}
.card.is-locked .card-kicker{color:var(--muted);}
.card.is-locked .card-sum{font-size:.94rem; color:var(--muted);}

/* ---------- Nota ---------- */
.progress{position:fixed; left:0; top:0; right:0; height:3px; z-index:40; pointer-events:none;}
.progress i{display:block; height:100%; background:linear-gradient(90deg, var(--violet-light), var(--blue)); transform-origin:0 50%; transform:scaleX(0);}

.post-head{padding-top:clamp(28px,5vw,56px);}
.crumb{display:inline-block; font-family:var(--font-mono); font-size:.78rem; color:var(--muted); text-decoration:none; margin-bottom:26px; border-bottom:1px solid transparent;}
.crumb:hover{color:var(--ink); border-bottom-color:var(--blue);}
.post-head h1{
  font-family:var(--font-display); font-weight:800; text-transform:uppercase; letter-spacing:.005em; line-height:1.04;
  text-wrap:balance; font-size:clamp(2.1rem,5.6vw,4rem); max-width:19ch; margin-bottom:22px;
}
.post-head .bajada{font-size:clamp(1.08rem,1.9vw,1.3rem); line-height:1.55; color:var(--ink); opacity:.88; max-width:62ch; margin-bottom:26px; text-wrap:pretty;}
.byline{display:flex; flex-wrap:wrap; gap:6px 18px; font-family:var(--font-mono); font-size:.78rem; color:var(--muted); margin-bottom:22px;}
.byline strong{color:var(--ink); font-weight:500;}
.cover{margin:clamp(26px,4vw,40px) 0 0;}
.cover img{width:100%; height:auto; border-radius:8px; border:1px solid var(--border);}
.cover figcaption{font-family:var(--font-mono); font-size:.7rem; letter-spacing:.06em; color:var(--muted); margin-top:10px;}

.post-grid{display:grid; grid-template-columns:minmax(0,1fr); gap:0 56px; padding-top:clamp(34px,5vw,60px);}
@media (min-width:1100px){ .post-grid{grid-template-columns:220px minmax(0,720px);} }
.map{display:none;}
@media (min-width:1100px){
  .map{display:block; position:sticky; top:96px; align-self:start; padding-right:8px;}
}
.map-title{font-family:var(--font-mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:16px;}
.map ol{list-style:none; position:relative; display:grid; gap:14px; padding-left:22px;}
.map-rail{position:relative;}
.map ol::before{content:""; position:absolute; left:4px; top:6px; bottom:6px; width:2px; background:rgba(255,255,255,.14);}
.map .fill{position:absolute; z-index:1; left:4px; top:6px; bottom:6px; width:2px; background:linear-gradient(180deg, var(--violet-light), var(--blue)); transform-origin:50% 0; transform:scaleY(0);}
.map li{position:relative;}
.map li::before{content:""; position:absolute; left:-22px; top:.42em; width:10px; height:10px; border-radius:50%; background:var(--void); border:2px solid rgba(255,255,255,.28); transition:border-color .3s ease, background-color .3s ease, box-shadow .3s ease;}
.map li.seen::before{border-color:var(--blue);}
.map li.active::before{background:var(--cyan-pulse); border-color:var(--cyan-pulse); box-shadow:0 0 0 4px rgba(109,229,243,.18);}
.map a{font-size:.84rem; line-height:1.35; color:var(--muted); text-decoration:none; transition:color .25s ease;}
.map li.active a, .map a:hover{color:var(--ink);}
.map .map-share{margin-top:26px; display:grid; gap:8px; justify-items:start;}

.prose{max-width:720px; min-width:0;}
.prose > * + *{margin-top:1.15em;}
.prose p{font-size:clamp(1.04rem,1.2vw,1.12rem); line-height:1.8; color:var(--body); text-wrap:pretty;}
.prose strong{color:var(--ink); font-weight:600;}
.prose h2{
  font-family:var(--font-display); font-weight:800; font-size:clamp(1.55rem,3vw,2.15rem); line-height:1.12; letter-spacing:-.005em;
  text-wrap:balance; margin-top:clamp(48px,7vw,76px); scroll-margin-top:96px;
}
.prose h2 .num{display:block; font-family:var(--font-mono); font-size:.74rem; font-weight:500; letter-spacing:.16em; color:var(--blue); margin-bottom:12px;}
.prose > h2:first-child{margin-top:0;}
.prose h3{display:flex; align-items:center; gap:14px; font-family:var(--font-display); font-weight:700; font-size:clamp(1.15rem,2vw,1.35rem); line-height:1.25; margin-top:2.1em; text-wrap:balance;}
.prose h3 .let{
  flex:none; width:38px; height:38px; display:flex; align-items:center; justify-content:center;
  font-weight:900; font-size:1.05rem; color:#fff; clip-path:polygon(15% 0, 100% 0, 85% 100%, 0 100%);
}
.let.l-a{background:var(--violet);} .let.l-b{background:var(--violet-2);} .let.l-c{background:var(--blue-mid); color:var(--void);}

.prose ul.marks{list-style:none; display:grid; gap:14px; margin-top:1.3em;}
.prose ul.marks li{position:relative; padding-left:30px; color:var(--body); font-size:clamp(1.02rem,1.2vw,1.1rem); line-height:1.7;}
.prose ul.marks li::before{content:""; position:absolute; left:2px; top:.55em; width:12px; height:12px; background:var(--blue); clip-path:polygon(25% 0, 100% 0, 75% 100%, 0 100%);}

/* Frase compartible dentro del texto */
.sq{background:linear-gradient(transparent 62%, rgba(137,108,181,.32) 62%); color:var(--ink);}
.sq-btn{
  display:none; vertical-align:baseline; margin-left:.45em; cursor:pointer;
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; line-height:1;
  color:var(--blue); background:transparent; border:1px solid rgba(41,207,226,.45); border-radius:999px; padding:.4em .75em;
  transition:background-color .25s ease, color .25s ease;
}
html.js .sq-btn{display:inline-block;}
.sq-btn:hover{background:var(--blue); color:var(--void);}
.sq-pop{
  position:absolute; z-index:60; display:flex; gap:8px; padding:10px; background:var(--void-2); border:1px solid var(--blue); border-radius:12px;
  box-shadow:0 18px 40px rgba(0,0,0,.55);
}
.sq-pop[hidden]{display:none;}

/* Cita destacada */
.pull{margin-top:clamp(40px,6vw,64px); padding:clamp(26px,4vw,40px) clamp(22px,4vw,44px); background:var(--void-2); border:1px solid var(--border); border-left:4px solid var(--blue); border-radius:8px;}
.pull blockquote{font-family:var(--font-display); font-weight:700; font-size:clamp(1.3rem,2.7vw,1.85rem); line-height:1.3; letter-spacing:-.005em; color:var(--ink); text-wrap:balance;}
.pull blockquote em{font-style:normal; color:var(--blue);}
.pull .share{margin-top:22px;}

/* Principios V.I.S.A. */
.steps{list-style:none; counter-reset:st; display:grid; gap:14px; margin-top:1.4em;}
.steps > li{counter-increment:st; position:relative; padding:20px 22px 20px 74px; background:var(--void-2); border:1px solid var(--border); border-radius:8px; color:var(--body); line-height:1.7; font-size:clamp(1rem,1.2vw,1.08rem);}
.steps > li::before{content:counter(st); position:absolute; left:20px; top:18px; width:38px; height:38px; display:flex; align-items:center; justify-content:center; font-weight:900; font-size:1.1rem; color:var(--void); background:var(--blue); clip-path:polygon(15% 0, 100% 0, 85% 100%, 0 100%);}
.steps strong{display:block; margin-bottom:4px; font-size:1.05rem;}
.steps ul{list-style:none; display:grid; gap:8px; margin-top:12px;}
.steps ul li{position:relative; padding-left:20px; font-size:.97rem; line-height:1.55;}
.steps ul li::before{content:""; position:absolute; left:0; top:.55em; width:8px; height:2px; background:var(--violet-light);}

/* Capacidades agénticas */
.agents{list-style:none; display:grid; gap:14px; grid-template-columns:1fr; margin-top:1.4em;}
@media (min-width:640px){ .agents{grid-template-columns:1fr 1fr;} }
.agents li{position:relative; padding:22px 22px 24px; background:var(--void-2); border:1px solid var(--border); border-top:3px solid var(--violet-light); border-radius:8px; color:var(--body); line-height:1.65; font-size:.99rem; transition:transform .3s var(--ease), border-color .3s ease;}
.agents li:hover{transform:translateY(-3px); border-top-color:var(--blue);}
.agents .ag-n{display:block; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.16em; color:var(--blue); margin-bottom:10px;}
.agents strong{display:block; font-size:1.06rem; margin-bottom:6px; line-height:1.3;}

/* Evidencia */
.proof{list-style:none; display:grid; gap:14px; margin-top:1.4em;}
.proof li{display:grid; grid-template-columns:1fr; gap:6px; padding:22px; background:var(--void-2); border:1px solid var(--border); border-left:3px solid var(--blue); border-radius:8px; color:var(--body); line-height:1.65;}
@media (min-width:640px){ .proof li{grid-template-columns:190px 1fr; gap:22px; align-items:center;} }
.proof .stat{font-family:var(--font-display); font-weight:900; font-size:clamp(1.5rem,3vw,2rem); line-height:1.05; letter-spacing:-.01em; color:var(--ink);}
.proof .stat small{display:block; font-family:var(--font-mono); font-weight:500; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--blue); margin-top:6px;}

/* Autodiagnóstico */
.dx{margin-top:clamp(52px,7vw,84px); padding:clamp(24px,4vw,40px); background:var(--void-2); border:1px solid var(--border); border-radius:12px; position:relative; overflow:hidden;}
.dx::before{content:""; position:absolute; inset:0 0 auto 0; height:3px; background:linear-gradient(90deg, var(--violet-light), var(--blue));}
.dx h2{margin-top:0 !important; font-size:clamp(1.5rem,3vw,2.1rem);}
.dx .dx-lede{margin-top:12px; color:var(--body);}
.dx fieldset{border:0; margin-top:26px; min-width:0;}
.dx legend{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--violet-light); padding:0; margin-bottom:12px;}
.dx-item{display:block; cursor:pointer; margin-top:10px;}
.dx-item input{position:absolute; opacity:0; width:1px; height:1px;}
.dx-row{display:flex; gap:14px; align-items:flex-start; padding:14px 16px; border:1px solid var(--border); border-radius:8px; color:var(--body); line-height:1.5; font-size:.98rem; transition:border-color .25s ease, background-color .25s ease;}
.dx-item:hover .dx-row{border-color:rgba(41,207,226,.5);}
.dx-box{flex:none; width:22px; height:22px; margin-top:1px; border:2px solid rgba(255,255,255,.35); border-radius:6px; display:flex; align-items:center; justify-content:center; transition:background-color .2s ease, border-color .2s ease;}
.dx-box::after{content:""; width:10px; height:6px; border-left:2.5px solid var(--void); border-bottom:2.5px solid var(--void); transform:rotate(-45deg) translate(1px,-1px); opacity:0;}
.dx-item input:checked + .dx-row{border-color:var(--blue); background:rgba(41,207,226,.08); color:var(--ink);}
.dx-item input:checked + .dx-row .dx-box{background:var(--blue); border-color:var(--blue);}
.dx-item input:checked + .dx-row .dx-box::after{opacity:1;}
.dx-item input:focus-visible + .dx-row{outline:2px solid var(--cyan-pulse); outline-offset:2px;}
.dx-result{margin-top:30px; padding:24px; border:1px solid var(--border); border-radius:8px; background:rgba(10,9,16,.55);}
.dx-meter{display:grid; grid-template-columns:repeat(var(--n, 8), 1fr); gap:6px; margin-bottom:18px;}
.dx-meter i{height:10px; border-radius:2px; background:rgba(255,255,255,.12); transition:background-color .3s ease;}
.dx-meter i.on{background:var(--blue);}
.dx-result[data-band="mid"] .dx-meter i.on{background:var(--violet-light);}
.dx-result[data-band="high"] .dx-meter i.on{background:#B58CFF;}
.dx-count{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);}
.dx-title{font-family:var(--font-display); font-weight:800; font-size:clamp(1.25rem,2.4vw,1.6rem); line-height:1.2; margin-top:6px; color:var(--ink);}
.dx-text{margin-top:8px; color:var(--body); font-size:1rem; line-height:1.65;}
.dx-break{display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:14px; font-family:var(--font-mono); font-size:.74rem; color:var(--muted);}
.dx-break b{color:var(--ink); font-weight:500;}
.dx-foot{margin-top:20px; display:flex; flex-wrap:wrap; gap:14px 20px; align-items:center;}
.dx-note{margin-top:16px; font-size:.82rem; color:var(--muted); line-height:1.5;}

/* Siguiente capítulo + cierre */
.next{margin-top:clamp(40px,6vw,60px); padding:22px 24px; border:1px dashed rgba(255,255,255,.28); border-radius:8px;}
.next .card-kicker{display:block; margin-bottom:8px; color:var(--violet-light);}
.next p{color:var(--body); line-height:1.65;}
.next p strong{color:var(--ink);}
.closing{margin-top:clamp(40px,6vw,64px); padding:clamp(26px,4vw,44px); background:var(--void-2); border:1px solid var(--border); border-radius:12px;}
.closing .brandline{font-family:var(--font-display); font-weight:800; font-size:1.1rem; text-transform:uppercase; letter-spacing:.01em;}
.closing .tag{font-family:var(--font-mono); font-size:.8rem; color:var(--blue); margin-top:4px;}
.closing .ask{font-family:var(--font-display); font-weight:700; font-size:clamp(1.15rem,2.2vw,1.45rem); line-height:1.35; margin:22px 0 24px; max-width:40ch; text-wrap:balance;}
.after{margin-top:clamp(36px,5vw,52px); display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px;}

/* Barra de compartir fija (móvil) */
@media (max-width:1099px){
  .share-dock{
    position:fixed; left:50%; bottom:16px; z-index:35; display:flex; gap:8px; padding:8px; border-radius:999px;
    background:rgba(21,24,29,.92); border:1px solid var(--border); box-shadow:0 12px 32px rgba(0,0,0,.5);
    -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
    transform:translate(-50%, 140%); transition:transform .4s var(--ease);
  }
  body.past-head .share-dock{transform:translate(-50%, 0);}
}
@media (prefers-reduced-motion: reduce){ .share-dock, .card, .card-img img, .chip, .agents li{transition:none;} }
