/* =====================================================
   Páginas interiores: movimiento sutil
   (se carga al final, después de styles.css, caso.css y blog.css)
   ===================================================== */

/* Desplazamiento suave al usar índices y anclas */
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

/* Barra de lectura */
.progreso{position:fixed;top:0;left:0;right:0;height:2px;z-index:1000;pointer-events:none}
.progreso i{display:block;height:100%;background:var(--ac);transform:scaleX(var(--p,0));transform-origin:left center}

/* Ex libris de fondo en los encabezados (se desplaza más despacio que el texto) */
.caso-cab::before{content:"";position:absolute;top:-10px;right:-140px;width:520px;height:542px;z-index:-1;pointer-events:none;opacity:.075;background:url("/emblema.svg") center/contain no-repeat;transform:translate3d(0,var(--emb-y,0px),0)}

/* Menú: subrayado que se dibuja y página actual marcada */
nav[aria-label="Principal"] a{background:linear-gradient(var(--ac),var(--ac)) no-repeat 0 calc(100% - 9px)/0 2px;transition:background-size .3s ease,color .2s ease}
nav[aria-label="Principal"] a:hover{background-size:100% 2px}
nav[aria-label="Principal"] a[aria-current="page"]{background-size:100% 2px}
nav[aria-label="Principal"] .idi a{background-image:none}

/* Revelado suave al llegar a cada bloque */
.rv{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,.61,.36,1)}
.rv.rv-in{opacity:1;transform:none}

/* Cifras que suben hasta su valor */
.cnt-wrap{position:relative;color:transparent}
.cnt-wrap::after{content:attr(data-n);content:attr(data-n) / "";position:absolute;top:0;left:0;right:0;text-align:inherit;white-space:nowrap;color:var(--ac);font-style:normal;font-variant-numeric:lining-nums tabular-nums}
.res-lista b{display:inline-block}

/* Barras mínimas en las tablas de resultados: año anterior contra año actual */
.mini{display:block;margin-top:9px;max-width:200px}
.mini i{display:block;height:3px;margin-top:3px;width:0;background:rgba(233,230,231,.3);transition:width 1.1s cubic-bezier(.22,.61,.36,1)}
.mini i.ahora{background:var(--ac);transition-delay:.15s}
.tabla-w.llena .mini i{width:var(--w)}
.tabla tbody tr{transition:background .2s ease}
.tabla tbody tr:hover{background:rgba(233,230,231,.05)}

/* Detalles al pasar el cursor */
.pasos-caso li{transition:padding-left .25s ease}
.pasos-caso li:hover{padding-left:6px}
.pager a{transition:border-color .25s ease,transform .25s ease}
.pager a:hover{border-top-color:var(--ac);transform:translateY(-2px)}
.chips a{transition:border-color .2s ease,color .2s ease,transform .2s ease}
.chips a:hover{transform:translateY(-1px)}
.entradas a{transition:padding-left .3s ease}
.entradas a:hover{padding-left:12px}

/* Ilustraciones de los pliegos: flotan apenas y aparecen junto con su texto */
@keyframes flota{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.pliego .caso-sec::after{animation:flota 11s ease-in-out infinite;transition:opacity .9s ease .25s}
#documental .caso-sec::after{animation-delay:-1.5s}
#prensa .caso-sec::after{animation-delay:-3s}
#impreso .caso-sec::after{animation-delay:-4.5s}
#editorial .caso-sec::after{animation-delay:-6s}
#gaio .caso-sec::after{animation-delay:-7.5s}
#blog .caso-sec::after{animation-delay:-9s}
.pliego .caso-sec:has(> .rv:not(.rv-in))::after{opacity:0}

/* Blog: índice lateral de la entrada */
.toc{display:none;margin-top:22px;padding-top:18px;border-top:1px solid var(--linea)}
.toc-t{margin:0 0 10px;font-family:var(--sans);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ap)}
.toc ol{list-style:none;margin:0;padding:0}
.toc a{display:block;padding:6px 0 6px 12px;border-left:2px solid transparent;font-family:var(--sans);font-size:13px;line-height:1.4;color:var(--sec);text-decoration:none;transition:color .2s ease,border-color .2s ease}
.toc a:hover{color:var(--tinta)}
.toc a.activo{color:var(--tinta);border-left-color:var(--ac)}
@media(min-width:1000px){
.toc{display:block}
.entrada-meta{position:sticky;top:24px;align-self:start}
.entrada-meta dl{position:static}
}

@media(max-width:900px){
.caso-cab::before{width:300px;height:313px;right:-110px;top:0;opacity:.05}
}
@media print{.rv{opacity:1;transform:none}.progreso{display:none}}

/* Pliegos: las ilustraciones como láminas al margen del texto */
.pliego .caso-sec::after{box-sizing:border-box;padding:14px;background-color:rgba(43,39,36,.035);background-origin:content-box;background-clip:border-box;border:1px solid var(--linea)}
@media(min-width:1060px){
.pliego .caso-sec::after{position:sticky;top:32px;align-self:start;justify-self:end;margin-top:6px}
}
@media(min-width:901px) and (max-width:1059px){
.pliego .caso-sec{grid-template-rows:auto 1fr}
.pliego .caso-sec > .rot{grid-column:1;grid-row:1}
.pliego .caso-sec > div:last-child{grid-column:2;grid-row:1 / span 2}
.pliego .caso-sec::after{grid-column:1;grid-row:2;position:sticky;top:24px;align-self:start;justify-self:start;width:124px;height:124px;margin-top:8px;padding:10px}
}
@media(max-width:900px){
.pliego .caso-sec{grid-template-columns:minmax(0,1fr) 108px;column-gap:16px;row-gap:16px}
.pliego .caso-sec > .rot{grid-column:1;grid-row:1}
.pliego .caso-sec::after{grid-column:2;grid-row:1;width:108px;height:108px;padding:10px;margin:0;justify-self:end;align-self:start}
.pliego .caso-sec > div:last-child{grid-column:1 / -1;grid-row:2}
}