/* Diario El Callao — portal de noticias
   Principio: nada encajonado. El contenido flota sobre el papel con aire, fotos de esquinas suaves,
   separaciones hechas con espacio y degradados que se funden con la página. Movimiento lento y con curva.
   Identidad: azul del logo y marino del puerto; rosado solo para Sport Boys; rojo solo para la última hora.
   Tipos: Libre Franklin (logo, menú, datos), Newsreader (titulares y lectura), Libre Bodoni itálica (cifras). */
:root{
  --papel:#fbfcfd; --papel-2:#f1f5f8; --papel-3:#e5ecf1; --velo:rgba(37,137,191,.07);
  --tinta:#132230; --tinta-2:#46566a; --tinta-3:#77838f;
  --linea:rgba(19,34,48,.08); --regla:#132230;
  --azul:#1d6a94; --azul-logo:#2a7aa5; --cielo:#2589bf; --azul-claro:#e8f3f9;
  --marino:#0d2a42; --marino-2:#173f61; --noche:#0a1826;
  --rosa:#c52a6f; --rosa-vivo:#e5438a; --rojo:#c4161c; --verde:#1faa53; --turquesa:#23796b;
  --sobre-oscuro:#eef4f7; --sobre-oscuro-2:rgba(238,244,247,.7);
  --sombra:0 10px 30px -18px rgba(13,42,66,.35);
  --sombra-alta:0 24px 50px -24px rgba(13,42,66,.5);
  --r:18px; --r-s:12px; --curva:cubic-bezier(.22,.61,.36,1);
  --f-logo:"Libre Franklin","Franklin Gothic Heavy","Arial Black",sans-serif;
  --f-ui:"Libre Franklin","Helvetica Neue",Arial,sans-serif;
  --f-tit:"Newsreader",Georgia,"Times New Roman",serif;
  --f-cifra:"Libre Bodoni","Bodoni 72",Didot,serif;
  --max:1240px; --gut:max(16px,env(safe-area-inset-left,0px));
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --papel:#0c141b; --papel-2:#131f28; --papel-3:#1b2a35; --velo:rgba(106,184,226,.08);
  --tinta:#e8eef2; --tinta-2:#b4c1cb; --tinta-3:#8795a1;
  --linea:rgba(232,238,242,.09); --regla:#d5dee4;
  --azul:#6ab8e2; --azul-logo:#6ab8e2; --cielo:#3a9bd0; --azul-claro:#132f3e;
  --marino:#08192a; --marino-2:#11304a; --noche:#060e16;
  --rosa:#f06aa5; --rojo:#ff5a5f; --turquesa:#3aa592;
  --sombra:0 10px 30px -18px rgba(0,0,0,.8); --sombra-alta:0 24px 50px -24px rgba(0,0,0,.9); color-scheme:dark}}
:root[data-theme="dark"]{
  --papel:#0c141b; --papel-2:#131f28; --papel-3:#1b2a35; --velo:rgba(106,184,226,.08);
  --tinta:#e8eef2; --tinta-2:#b4c1cb; --tinta-3:#8795a1;
  --linea:rgba(232,238,242,.09); --regla:#d5dee4;
  --azul:#6ab8e2; --azul-logo:#6ab8e2; --cielo:#3a9bd0; --azul-claro:#132f3e;
  --marino:#08192a; --marino-2:#11304a; --noche:#060e16;
  --rosa:#f06aa5; --rojo:#ff5a5f; --turquesa:#3aa592;
  --sombra:0 10px 30px -18px rgba(0,0,0,.8); --sombra-alta:0 24px 50px -24px rgba(0,0,0,.9); color-scheme:dark}

/* ---------- base ---------- */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:80px;scroll-behavior:smooth}
body{margin:0;background:var(--papel);color:var(--tinta);font:16px/1.55 var(--f-ui);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:95;background:var(--marino)}
a{color:inherit;text-decoration:none}
img{max-width:100%}
h1,h2,h3,h4,p,ol,ul,dl,dd,figure{margin:0}
ol,ul{padding:0;list-style:none}
button{font-family:inherit}
:focus-visible{outline:2px solid var(--cielo);outline-offset:3px;border-radius:8px}
::selection{background:var(--cielo);color:#fff}
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gut);padding-right:max(16px,env(safe-area-inset-right,0px))}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.iconos{position:absolute}
svg{fill:currentColor}
.saltar{position:absolute;left:-999px;top:8px;z-index:100;background:var(--tinta);color:var(--papel);padding:8px 14px;border-radius:99px;font-weight:700}
.saltar:focus{left:16px}
main{animation:aparecer .7s var(--curva) both}
@keyframes aparecer{from{opacity:0;transform:translateY(10px)}}

/* aparición suave al hacer scroll (la activa site.js solo si el elemento aún no se ve) */
.por-ver{opacity:0;transform:translateY(22px)}
.visto-ya{opacity:1;transform:none;transition:opacity .9s var(--curva),transform .9s var(--curva)}

/* textos */
.titular{font-family:var(--f-tit);font-weight:600;font-optical-sizing:auto;line-height:1.16;letter-spacing:-.008em;text-wrap:balance;color:var(--tinta);transition:color .35s var(--curva)}
a:hover .titular{color:var(--azul)}
.bajada{font-family:var(--f-tit);font-size:16.5px;line-height:1.55;color:var(--tinta-2);text-wrap:pretty}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;font:500 12.5px var(--f-ui);color:var(--tinta-3)}
.meta time{display:inline-flex;align-items:center;gap:5px}
.meta svg{width:13px;height:13px;opacity:.7}
.num{font-variant-numeric:tabular-nums;font-weight:700;letter-spacing:.02em}

/* etiquetas de sección: píldoras suaves */
.chip{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;color:var(--cielo);font:800 11px/1 var(--f-ui);text-transform:uppercase;letter-spacing:.08em}
.chip::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
/* el color lo elige el panel en cada sección */
.chip-rojo{color:var(--rojo)}
.chip-rosa{color:var(--rosa-vivo)}
.chip-azul{color:var(--azul)}
.chip-turquesa{color:var(--turquesa)}
.chip-verde{color:#1f9a55}
.chip-ambar{color:#c77d00}
/* sobre fotos, la píldora lleva fondo de cristal */
.diapo .chip,.imp .chip,.sec-lider .chip{color:#fff;background:rgba(255,255,255,.16);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:7px 12px 7px 10px;border-radius:99px}
.diapo .chip::before,.imp .chip::before,.sec-lider .chip::before{background:var(--cielo);box-shadow:0 0 0 3px rgba(37,137,191,.3)}
.diapo .chip-rojo::before,.imp .chip-rojo::before{background:var(--rojo)}
.diapo .chip-rosa::before,.imp .chip-rosa::before{background:var(--rosa-vivo)}
.diapo .chip-turquesa::before,.imp .chip-turquesa::before{background:#3fc2ab}
.diapo .chip-verde::before,.imp .chip-verde::before{background:#3fcf7f}
.diapo .chip-ambar::before,.imp .chip-ambar::before{background:#ffb02e}

/* fotos de esquinas suaves */
.marco{position:relative;overflow:hidden;background:var(--papel-2);border-radius:var(--r-s);isolation:isolate}
.foto{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform 1.1s var(--curva)}
a:hover .foto{transform:scale(1.045)}
.foto.alta{aspect-ratio:4/5}
.enc-arriba{object-position:50% 12%}
.enc-centro{object-position:50% 50%}
.enc-abajo{object-position:50% 88%}
.alta.enc-arriba{object-position:50% 0}
.sin-foto{display:block;aspect-ratio:3/2;background:radial-gradient(120% 120% at 20% 10%,var(--azul-claro),var(--papel-3))}
.sello-video{position:absolute;left:10px;bottom:10px;display:inline-flex;align-items:center;gap:5px;background:rgba(8,20,28,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;font:700 11.5px var(--f-ui);padding:6px 11px 6px 9px;border-radius:99px}
.sello-video svg{width:12px;height:12px}

/* botones: píldoras */
.boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 14px var(--f-ui);padding:13px 24px;border-radius:99px;border:0;cursor:pointer;line-height:1;transition:transform .45s var(--curva),box-shadow .45s var(--curva),background-color .35s var(--curva)}
.boton:hover{transform:translateY(-2px);box-shadow:0 14px 28px -14px rgba(0,0,0,.45)}
.boton:active{transform:translateY(0) scale(.98)}
.boton svg{width:17px;height:17px;transition:transform .45s var(--curva)}
.boton:hover svg{transform:translateX(3px)}
.boton-azul{background:linear-gradient(135deg,var(--cielo),var(--azul-logo));color:#fff}
.boton-wa{background:linear-gradient(135deg,#25c366,#1a9b4b);color:#fff}
.boton-tinta{background:linear-gradient(135deg,var(--marino-2),var(--marino));color:#fff}
.boton-claro{background:var(--sobre-oscuro);color:var(--marino)}
.boton-borde-azul{background:var(--azul-claro);color:var(--azul)}
.boton-borde-azul:hover{background:var(--cielo);color:#fff}

/* títulos de bloque: palabra con punto de color y una línea que se desvanece */
.cinta-titulo,.cabeza-sec,.w-titulo{display:flex;align-items:center;gap:14px;margin-bottom:24px;line-height:1}
.cinta-titulo span,.cabeza-sec h2,.w-titulo{display:inline-flex;align-items:center;gap:10px;font:800 15px var(--f-ui);text-transform:uppercase;letter-spacing:.09em;color:var(--tinta);white-space:nowrap}
.cinta-titulo span::before,.cabeza-sec h2::before,.w-titulo::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--cielo);box-shadow:0 0 0 5px var(--velo)}
.cinta-titulo::after,.cabeza-sec::after,.w-titulo::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--linea),transparent)}
.w-titulo{font-size:13px;margin-bottom:16px}
.w-titulo::before{width:8px;height:8px}

/* ---------- barra superior ---------- */
.util{background:linear-gradient(90deg,var(--noche),var(--marino));color:var(--sobre-oscuro-2);font-size:12.5px}
.util .wrap{display:flex;align-items:center;gap:6px 18px;min-height:42px;flex-wrap:wrap}
.sello-digital{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 11px;border-radius:99px;background:rgba(255,255,255,.08);color:#fff;font:700 11.5px var(--f-ui);text-transform:uppercase;letter-spacing:.06em;transition:background-color .4s var(--curva)}
.sello-digital:hover{background:rgba(31,170,83,.9)}
.sello-digital i{width:8px;height:8px;border-radius:50%;background:#3ddc84;animation:latir 2s ease-in-out infinite}
.sello-digital:hover i{background:#fff}
@keyframes latir{0%{box-shadow:0 0 0 0 rgba(61,220,132,.55)}70%{box-shadow:0 0 0 8px rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}
.util-fecha{font-weight:600;color:#fff}
.util-ano{opacity:.75}
.util .redes{margin-left:auto}
.redes{display:flex;gap:4px}
.redes a{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;color:inherit;transition:background-color .4s var(--curva),color .4s var(--curva),transform .4s var(--curva)}
.redes a:hover{background:rgba(255,255,255,.12);color:#fff;transform:translateY(-2px)}
.redes svg{width:15px;height:15px}

/* ---------- cabecera ---------- */
.mast{text-align:center;padding-block:30px 24px}
.mast-video{padding-block:0 20px}
.banner{display:block;max-width:1920px;margin-inline:auto;aspect-ratio:3/1;background:#26335f;overflow:hidden}
.banner video{display:block;width:100%;height:100%;object-fit:cover}
@media (max-width:640px){.banner{aspect-ratio:6/5}}
.mast-sm{padding-block:16px 12px}
/* Logo impreso del diario (páginas interiores) con su lema */
.logo-img{display:inline-flex;flex-direction:column;align-items:center;gap:4px}
.logo-img picture{display:block}
.logo-img img{display:block;width:clamp(230px,34vw,420px);height:auto;transition:transform .5s var(--curva)}
.logo-img:hover img{transform:scale(1.02)}
.logo-lema{font:italic 500 clamp(16px,1.6vw,20px)/1.2 var(--f-tit);letter-spacing:.01em;color:var(--tinta-2)}
.lema{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 22px;margin-top:16px;font:500 13.5px var(--f-ui);color:var(--tinta-2)}
.lema span+span::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--tinta-3);margin-right:22px;vertical-align:middle;opacity:.6}
.anniv{color:var(--azul);font-weight:700}

/* ---------- menú: barra marina con píldoras ---------- */
.nav-lugar{min-height:56px}
.nav{background:linear-gradient(90deg,var(--marino),var(--marino-2));color:#fff;z-index:90;position:relative}
.nav.fija{position:fixed;left:0;right:0;top:env(safe-area-inset-top,0px);background:rgba(13,42,66,.88);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);animation:bajar .55s var(--curva);box-shadow:0 12px 30px -18px rgba(0,0,0,.6)}
@keyframes bajar{from{transform:translateY(-100%);opacity:.4}}
.nav .wrap{display:flex;align-items:center;gap:6px;min-height:56px}
.nav-casa{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.1);transition:background-color .4s var(--curva)}
.nav-casa:hover{background:var(--cielo)}
.nav-casa svg{width:18px;height:18px}
.nav-mini{display:none;flex:none;font:900 21px var(--f-logo);letter-spacing:-.05em;color:#fff;padding:0 10px 0 6px}
.nav.fija .nav-mini{display:block}
.nav ul{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;min-width:0;flex:1;padding:6px 4px;mask-image:linear-gradient(90deg,#000 92%,transparent)}
.nav ul::-webkit-scrollbar{display:none}
.nav li a{display:block;white-space:nowrap;padding:9px 14px;border-radius:99px;font:700 12.5px var(--f-ui);text-transform:uppercase;letter-spacing:.05em;color:rgba(255,255,255,.88);transition:background-color .4s var(--curva),color .4s var(--curva)}
.nav li a:hover{background:rgba(255,255,255,.1);color:#fff}
.nav li a[aria-current="page"]{background:#fff;color:var(--marino)}
.nav li a.boys{color:#ff9cc8}
.nav li a.boys[aria-current="page"]{background:var(--rosa-vivo);color:#fff}
.nav-der{flex:none;display:flex;align-items:center;gap:8px}
.nav-btn{width:38px;height:38px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;transition:background-color .4s var(--curva),transform .4s var(--curva)}
.nav-btn:hover{background:var(--cielo);transform:translateY(-2px)}
.nav-btn svg{width:17px;height:17px}
.nav-wa{background:rgba(31,170,83,.9)}
.nav-wa:hover{background:#25c366}
.interruptor{position:relative;width:50px;height:28px;border-radius:99px;border:0;background:rgba(255,255,255,.16);cursor:pointer;transition:background-color .45s var(--curva)}
.perilla{position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.25);transition:transform .5s var(--curva)}
.perilla::after{content:"";position:absolute;inset:6px;border-radius:50%;box-shadow:inset -3px -2px 0 0 #0d2a42}
.interruptor[aria-checked="true"]{background:var(--cielo)}
.interruptor[aria-checked="true"] .perilla{transform:translateX(22px)}
.panel-buscar{animation:desplegar .45s var(--curva)}
@keyframes desplegar{from{opacity:0;transform:translateY(-8px)}}
.panel-buscar .wrap{display:flex;gap:10px;padding-block:4px 16px}
.panel-buscar input{flex:1;min-width:0;font:500 16px var(--f-ui);padding:13px 20px;border:0;border-radius:99px;background:rgba(255,255,255,.95);color:#13202b}
.panel-buscar input:focus{outline:3px solid rgba(37,137,191,.5)}

/* ---------- última hora ---------- */
.urgente{background:linear-gradient(90deg,#b3141a,#d62a2f);color:#fff}
.urgente .wrap{display:flex;align-items:center;gap:14px;min-height:46px;padding-block:8px}
.urgente-sello{flex:none;display:flex;align-items:center;gap:8px;font:800 11.5px var(--f-ui);text-transform:uppercase;letter-spacing:.07em;padding:6px 12px;border-radius:99px;background:rgba(255,255,255,.16)}
.urgente-sello i{width:8px;height:8px;border-radius:50%;background:#fff;animation:parpadeo 1.6s ease-in-out infinite}
.urgente a,.urgente p{font:600 16px/1.3 var(--f-tit)}
.urgente a:hover{text-decoration:underline;text-underline-offset:3px}
@keyframes parpadeo{50%{opacity:.25}}

/* ---------- cinta de tendencias: sin marco, se funde en los bordes ---------- */
.tendencias .wrap{display:flex;align-items:center;gap:16px;padding-block:18px 2px}
.tend-sello{flex:none;display:inline-flex;align-items:center;gap:7px;color:var(--cielo);font:800 12px var(--f-ui);text-transform:uppercase;letter-spacing:.08em;padding:8px 14px;border-radius:99px;background:var(--velo)}
.tend-sello svg{width:14px;height:14px}
.tend-pista{flex:1;min-width:0;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.tend-cinta{display:flex;width:max-content;animation:correr 60s linear infinite;will-change:transform}
.tendencias:hover .tend-cinta,.tendencias:focus-within .tend-cinta{animation-play-state:paused}
.tend-cinta a{display:flex;align-items:center;white-space:nowrap;font:500 14px var(--f-ui);color:var(--tinta-2);padding:6px 0;transition:color .35s var(--curva)}
.tend-cinta a::after{content:"";width:4px;height:4px;border-radius:50%;background:var(--tinta-3);opacity:.5;margin:0 26px}
.tend-cinta a:hover{color:var(--azul)}
@keyframes correr{to{transform:translateX(-50%)}}

/* ---------- portada: carrusel + pestañas ---------- */
.hero{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:36px;padding-block:22px 18px}
.carrusel{position:relative;border-radius:calc(var(--r) + 6px);overflow:hidden;background:#0a1826;box-shadow:var(--sombra-alta);isolation:isolate}
.carrusel-pista{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.carrusel-pista::-webkit-scrollbar{display:none}
.diapo{flex:0 0 100%;scroll-snap-align:start;scroll-snap-stop:always}
.diapo>a{position:relative;display:block;aspect-ratio:16/10;max-height:530px;width:100%;overflow:hidden}
.diapo .foto{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
.diapo>a:hover .foto{transform:none}
.diapo.activa .foto{animation:acercar 8s ease-out both}
@keyframes acercar{from{transform:scale(1.07)}to{transform:scale(1)}}
.diapo-velo{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,14,22,0) 30%,rgba(6,14,22,.55) 62%,rgba(6,14,22,.92) 100%)}
.diapo-txt{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:14px;padding:30px 130px 34px 32px}
.diapo .titular{color:#fff;font-size:clamp(24px,2.9vw,38px);font-weight:700;line-height:1.12;text-shadow:0 2px 18px rgba(0,0,0,.3)}
.diapo a:hover .titular{color:#fff}
.diapo .meta{color:rgba(255,255,255,.8)}
.diapo.activa .diapo-txt{animation:subir .9s .15s var(--curva) both}
@keyframes subir{from{opacity:0;transform:translateY(18px)}}
.carrusel-ctrl{position:absolute;right:24px;bottom:30px;display:flex;gap:8px}
.c-btn{width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background-color .4s var(--curva),transform .4s var(--curva)}
.c-btn:hover{background:rgba(255,255,255,.3);transform:scale(1.06)}
.c-btn svg{width:20px;height:20px}
.c-btn[data-dir="-1"] svg{transform:rotate(180deg)}
.carrusel-puntos{position:absolute;left:32px;right:32px;top:20px;display:flex;gap:6px}
.carrusel-puntos button{flex:1;height:3px;border:0;padding:0;border-radius:3px;background:rgba(255,255,255,.28);cursor:pointer;overflow:hidden;position:relative}
.carrusel-puntos button::after{content:"";position:absolute;inset:0;background:#fff;border-radius:3px;transform:scaleX(0);transform-origin:0 50%}
.carrusel-puntos button.visto::after{transform:scaleX(1)}
.carrusel-puntos button[aria-selected="true"]::after{animation:llenar var(--pausa,6.5s) linear forwards}
.carrusel.quieto .carrusel-puntos button[aria-selected="true"]::after{animation-play-state:paused}
@keyframes llenar{to{transform:scaleX(1)}}

.pestanas-w{display:flex;flex-direction:column;min-width:0}
.pest-botones{display:flex;gap:4px;padding:4px;border-radius:99px;background:var(--papel-2);margin-bottom:8px}
.pest-botones button{flex:1;border:0;background:none;padding:10px 12px;border-radius:99px;font:700 12px var(--f-ui);text-transform:uppercase;letter-spacing:.07em;color:var(--tinta-3);cursor:pointer;transition:background-color .45s var(--curva),color .45s var(--curva),box-shadow .45s var(--curva)}
.pest-botones button[aria-selected="true"]{background:var(--papel);color:var(--azul);box-shadow:0 4px 14px -6px rgba(13,42,66,.35)}
.pestanas-w [role="tabpanel"]{animation:aparecer .5s var(--curva)}
.mini a{display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;align-items:center;padding:10px 6px;margin-inline:-6px;border-radius:var(--r-s);transition:background-color .4s var(--curva)}
.mini a:hover{background:var(--velo)}
.mini-foto{display:block;border-radius:10px;overflow:hidden;background:var(--papel-2)}
.mini-foto .foto,.mini-foto .sin-foto{aspect-ratio:4/3}
.mini-txt{display:flex;flex-direction:column;gap:5px;min-width:0}
.mini-txt b{font:600 15px/1.28 var(--f-tit);transition:color .35s var(--curva);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mini a:hover b{color:var(--azul)}
.mini-txt time{font:600 11.5px var(--f-ui);color:var(--tinta-3);letter-spacing:.02em}

/* imperdibles */
.imperdibles{padding-block:44px 30px}
.imp-rejilla{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.imp>a{position:relative;display:block;height:300px;border-radius:var(--r);overflow:hidden;isolation:isolate;transition:transform .6s var(--curva),box-shadow .6s var(--curva)}
.imp>a:hover{transform:translateY(-6px);box-shadow:var(--sombra-alta)}
.imp .foto{position:absolute;inset:0;height:100%;aspect-ratio:auto}
.imp-txt{position:absolute;left:0;right:0;bottom:0;padding:20px;display:flex;flex-direction:column;gap:12px}
.imp .titular{color:#fff;font-size:18.5px;font-weight:700;line-height:1.2}
.imp a:hover .titular{color:#fff}

/* ---------- listado + barra lateral: sin marcos, con aire ---------- */
.con-lateral{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:56px;padding-block:44px 64px;align-items:start}
.feed-lista,.filas{display:flex;flex-direction:column;gap:34px}
.feed>a{display:grid;grid-template-columns:minmax(0,40%) minmax(0,1fr);gap:26px;align-items:center}
.feed .marco{border-radius:var(--r)}
.feed .foto,.feed .sin-foto{aspect-ratio:4/3}
.feed-txt{display:flex;flex-direction:column;gap:10px;min-width:0}
.feed .titular{font-size:clamp(19px,1.9vw,24px);font-weight:700}
.feed .bajada{font-size:15.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.leer{display:inline-flex;align-items:center;gap:4px;font:700 12px var(--f-ui);text-transform:uppercase;letter-spacing:.08em;color:var(--cielo)}
.leer svg{width:16px;height:16px;transition:transform .45s var(--curva)}
.feed a:hover .leer svg{transform:translateX(5px)}
.mas-noticias{margin:40px auto 0;display:flex;width:max-content}

.lateral{display:flex;flex-direction:column;gap:44px;min-width:0}
.widget{display:flex;flex-direction:column;gap:14px}
.w-digital{position:relative;align-items:center;text-align:center;padding:26px 22px 24px;border-radius:calc(var(--r) + 6px);background:radial-gradient(130% 90% at 50% 0%,var(--azul-claro),transparent 70%)}
.w-digital .w-titulo{align-self:stretch}
.w-hoja{display:block;width:60%;margin:4px 0 6px}
.w-hoja img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 0;border-radius:4px;box-shadow:0 30px 40px -24px rgba(13,42,66,.6),0 2px 6px rgba(0,0,0,.08);transform:rotate(-3deg);transition:transform .8s var(--curva)}
.w-hoja:hover img{transform:rotate(0) translateY(-4px)}
.w-ed{font:600 18px/1.25 var(--f-tit)}
.w-precio{font:900 24px var(--f-logo);letter-spacing:-.03em;color:var(--azul)}
.w-digital .boton{align-self:stretch}
.w-edictos ul{display:flex;flex-direction:column;gap:4px}
.w-edictos ul li a{display:flex;flex-direction:column;gap:4px;padding:10px 12px;margin-inline:-12px;border-radius:var(--r-s);transition:background-color .4s var(--curva)}
.w-edictos ul li a:hover{background:var(--velo)}
.w-edictos strong{font:600 16px/1.3 var(--f-tit)}
.w-edictos p{font-size:14.5px;color:var(--tinta-2)}
.w-edictos .boton{align-self:flex-start}
.ver-todo{display:inline-flex;align-items:center;gap:4px;font:700 13px var(--f-ui);color:var(--azul);transition:gap .35s var(--curva)}
.ver-todo:hover{gap:8px}
.ed-tipo{font:800 11px var(--f-ui);text-transform:uppercase;letter-spacing:.07em;color:var(--cielo)}
.siguenos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.siguenos a{display:flex;align-items:center;gap:9px;padding:11px 14px;border-radius:99px;color:#fff;font:700 13.5px var(--f-ui);transition:transform .45s var(--curva),filter .45s var(--curva)}
.siguenos a:hover{transform:translateY(-2px);filter:brightness(1.08)}
.siguenos svg{width:17px;height:17px}
.s-fb{background:#1877f2}.s-ig{background:linear-gradient(45deg,#f09433,#dc2743 50%,#bc1888)}.s-tt{background:#111}.s-yt{background:#e62117}

/* ---------- Sport Boys: banda que se funde con la página ---------- */
.banda-boys{position:relative;overflow:hidden;color:var(--sobre-oscuro);isolation:isolate;margin-block:20px;
  background:radial-gradient(60% 80% at 85% 20%,rgba(229,67,138,.32),transparent 70%),radial-gradient(50% 70% at 10% 90%,rgba(229,67,138,.16),transparent 70%),#10151b;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 70px,#000 calc(100% - 70px),transparent);mask-image:linear-gradient(180deg,transparent,#000 70px,#000 calc(100% - 70px),transparent)}
.banda-boys .wrap{padding-block:100px}
.cabeza-banda{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:30px}
.cabeza-banda h2{font:900 clamp(32px,4.2vw,48px)/1 var(--f-logo);letter-spacing:-.045em;background:linear-gradient(90deg,#ff7fb6,var(--rosa-vivo));-webkit-background-clip:text;background-clip:text;color:transparent}
.cabeza-banda p{font:italic 500 18px var(--f-tit);color:var(--sobre-oscuro-2)}
.boys-rejilla{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:48px;align-items:start}
.boys-rejilla.solo{grid-template-columns:minmax(0,1fr)}
.boys-principal>a{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr);gap:36px;align-items:center}
.boys-rejilla.solo .boys-principal>a{grid-template-columns:minmax(0,330px) minmax(0,1fr);gap:56px}
.boys-principal .marco{border-radius:var(--r);box-shadow:0 40px 60px -30px rgba(229,67,138,.45),0 20px 40px -20px rgba(0,0,0,.7)}
.boys-txt{display:flex;flex-direction:column;gap:14px}
.banda-boys .chip{color:#ff8cc0}
.banda-boys .titular{color:#fff;font-size:clamp(28px,3.4vw,48px);font-weight:700;line-height:1.08}
.banda-boys a:hover .titular{color:#ffb3d4}
.banda-boys .bajada,.banda-boys .meta{color:var(--sobre-oscuro-2)}
.titulares li{padding:12px 0;font:600 16.5px/1.3 var(--f-tit)}
.banda-boys .titulares li{display:flex;flex-direction:column;gap:4px}
.banda-boys .titulares a:hover{color:#ffb3d4}

/* ---------- pie: entra con un degradado, sin corte ---------- */
.pie{background:linear-gradient(180deg,var(--papel) 0,var(--noche) 110px,var(--noche));color:var(--sobre-oscuro);margin-top:20px}
.pie .wrap{padding-block:140px 28px}
.pie-top{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.4fr) minmax(0,1fr);gap:48px}
.pie .logo-img{align-items:flex-start}
.pie .logo-img img{width:min(300px,100%)}
.pie .logo-lema{color:var(--sobre-oscuro-2)}
.pie-marca p{font:16px/1.55 var(--f-tit);color:var(--sobre-oscuro-2);margin:18px 0 10px;max-width:36ch}
.pie-mas{display:inline-flex;align-items:center;gap:4px;font:700 14px var(--f-ui);color:#7fc3e8;margin-bottom:16px;transition:gap .35s var(--curva)}
.pie-mas:hover{gap:9px}
.pie-mas svg{width:16px;height:16px}
.pie .redes a{color:var(--sobre-oscuro-2)}
.pie h2{display:flex;align-items:center;gap:10px;font:800 13px var(--f-ui);text-transform:uppercase;letter-spacing:.09em;color:#fff;margin-bottom:18px}
.pie h2::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cielo)}
.pie-lista{display:grid;gap:12px;font-size:14px;color:var(--sobre-oscuro-2)}
.pie-lista a{transition:color .35s var(--curva)}
.pie-lista a:hover{color:#fff}
.pie-lista address{font-style:normal}
.copiar-fila{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.copiar{background:rgba(255,255,255,.1);border:0;color:var(--sobre-oscuro);font:700 11.5px var(--f-ui);padding:5px 12px;border-radius:99px;cursor:pointer;transition:background-color .35s var(--curva)}
.copiar:hover{background:rgba(255,255,255,.2)}
/* Contacto: WhatsApp grande con pulso, el local y atajos (pie y ¿Quiénes somos?) */
.contacto{--ct-sub:var(--tinta-3);--ct-suave:var(--papel-2);display:flex;flex-direction:column;gap:20px}
.pie .contacto{--ct-sub:var(--sobre-oscuro-2);--ct-suave:rgba(255,255,255,.08)}
.ct-wa-fila{display:grid;gap:6px;justify-items:start}
.ct-wa-fila .copiar{margin-left:64px}
.ct-wa,.ct-fila{display:flex;align-items:center;gap:14px;min-width:0}
.ct-ic{position:relative;flex:none;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:var(--verde);color:#fff}
.ct-ic svg{width:23px;height:23px}
.ct-wa .ct-ic::after{content:"";position:absolute;inset:0;border-radius:50%;animation:ct-pulso 2.6s var(--curva) infinite}
@keyframes ct-pulso{0%{box-shadow:0 0 0 0 rgba(31,170,83,.5)}70%,100%{box-shadow:0 0 0 16px rgba(31,170,83,0)}}
.ct-ic-pin{background:var(--ct-suave);color:var(--cielo)}
.ct-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.ct-txt small{font:600 12.5px var(--f-ui);color:var(--ct-sub)}
.ct-txt b{font:600 27px/1.05 var(--f-tit);letter-spacing:-.01em;transition:color .4s var(--curva)}
.ct-wa:hover b{color:var(--verde)}
.ct-txt address{font:normal 16px/1.4 var(--f-tit)}
.ct-ir{width:16px;height:16px;flex:none;color:var(--ct-sub);transition:transform .4s var(--curva)}
.ct-fila:hover .ct-ir{transform:translateX(5px)}
.contacto .copiar{background:var(--ct-suave);color:inherit}
.ct-atajos{display:flex;flex-wrap:wrap;gap:8px}
.ct-atajos a{display:inline-flex;align-items:center;gap:6px;font:700 13px var(--f-ui);padding:9px 15px;border-radius:99px;background:var(--ct-suave);transition:background-color .4s var(--curva),color .4s var(--curva)}
.ct-atajos a:hover{background:var(--cielo);color:#fff}
.ct-atajos svg{width:14px;height:14px;color:var(--rosa-vivo)}
.ct-atajos a:hover svg{color:#fff}
.pie-base{margin-top:48px;padding-top:20px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--sobre-oscuro-2);background:linear-gradient(90deg,rgba(255,255,255,.12),transparent) top/100% 1px no-repeat}
.pie-base a:hover{color:#fff}

/* aviso de compra flotante y botón de WhatsApp */
.dock{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:80;width:min(560px,calc(100% - 32px));transform:translateX(-50%);background:rgba(13,42,66,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#fff;border-radius:99px;box-shadow:0 20px 40px -18px rgba(0,0,0,.6);animation:asomar .7s var(--curva)}
@keyframes asomar{from{opacity:0;transform:translate(-50%,30px)}}
.dock .wrap{display:flex;align-items:center;gap:12px;min-height:64px;padding:8px 8px 8px 12px}
.dock img{width:38px;height:48px;object-fit:cover;object-position:50% 0;border-radius:4px;transform:rotate(-4deg);box-shadow:0 6px 14px rgba(0,0,0,.4)}
.dock p{display:flex;flex-direction:column;font-size:13px;color:var(--sobre-oscuro-2);line-height:1.3;flex:1;min-width:0}
.dock b{font:700 14.5px var(--f-ui);color:#fff}
.dock .boton{padding:11px 18px}
.dock-cerrar{border:0;background:rgba(255,255,255,.1);color:#fff;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;cursor:pointer;flex:none;transition:background-color .35s var(--curva)}
.dock-cerrar:hover{background:rgba(255,255,255,.22)}
.dock-cerrar svg{width:15px;height:15px}
.fab{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:70;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#2bd46f,#1ea851);color:#fff;display:grid;place-items:center;box-shadow:0 16px 30px -12px rgba(31,170,83,.7);transition:transform .45s var(--curva),bottom .6s var(--curva)}
.fab:hover{transform:scale(1.08)}
.fab svg{width:28px;height:28px}
body.con-dock .fab{bottom:calc(96px + env(safe-area-inset-bottom,0px))}

/* ---------- noticia ---------- */
.progreso{position:fixed;left:0;right:0;top:env(safe-area-inset-top,0px);height:3px;z-index:96;pointer-events:none}
.progreso i{display:block;height:100%;background:linear-gradient(90deg,var(--cielo),#6fd0ff);border-radius:0 3px 3px 0;transform-origin:0 50%;transform:scaleX(0)}
.art{padding-block:34px 10px}
.art-cab{max-width:808px}
.miga{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font:700 12.5px var(--f-ui);text-transform:uppercase;letter-spacing:.07em;margin-bottom:18px}
.miga a{color:var(--cielo)}
.miga span{color:var(--tinta-3)}
.miga span::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:currentColor;margin-right:10px;vertical-align:middle;opacity:.6}
.art-cab .titular{font-size:clamp(30px,4.4vw,52px);line-height:1.07;font-weight:700;letter-spacing:-.018em}
.art-cab .bajada{font-size:clamp(18.5px,2vw,21px);line-height:1.5;margin-top:18px}
.firma{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:28px}
.avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--marino-2),var(--marino));color:#fff;display:grid;place-items:center;font:800 14px var(--f-ui);flex:none}
.firma>div:not(.compartir){flex:1;min-width:0;display:flex;flex-direction:column;font-size:13.5px;color:var(--tinta-3)}
.firma strong{color:var(--tinta);font-size:14.5px}
.compartir{display:flex;flex-wrap:wrap;gap:8px}
.compartir a,.compartir button{display:inline-flex;align-items:center;gap:7px;border:0;background:var(--papel-2);color:var(--tinta);border-radius:99px;padding:10px 16px;font:700 13px var(--f-ui);cursor:pointer;transition:background-color .4s var(--curva),color .4s var(--curva),transform .4s var(--curva)}
.compartir a:hover,.compartir button:hover{background:var(--cielo);color:#fff;transform:translateY(-2px)}
.compartir svg{width:16px;height:16px}
.compartir-mini a,.compartir-mini button{width:40px;height:40px;padding:0;justify-content:center}
.compartir-mini span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.art-medio{max-width:1080px;margin:32px auto 0;padding-inline:var(--gut)}
.art-foto{position:relative;display:block;background:var(--papel-2);border-radius:var(--r);overflow:hidden}
.art-foto img{display:block;width:100%;height:auto;max-height:78vh;object-fit:contain;margin-inline:auto}
.art-foto .play{position:absolute;left:50%;top:50%;width:80px;height:80px;margin:-40px 0 0 -40px;border-radius:50%;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);display:grid;place-items:center;color:#0d2a42;box-shadow:0 18px 40px -12px rgba(0,0,0,.5);transition:transform .5s var(--curva)}
.art-foto .play svg{width:30px;height:30px;margin-left:4px}
.con-play:hover .play{transform:scale(1.08)}
.art-medio figcaption{max-width:760px;margin:12px auto 0;font-size:13.5px;color:var(--tinta-3);text-align:center}
.embed{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:var(--r);overflow:hidden}
.embed.vertical{max-width:420px;aspect-ratio:9/16;margin-inline:auto;background:var(--papel-2)}
.embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.art-cuerpo{max-width:712px;margin:0 auto;padding:34px var(--gut) 0}
.art-cuerpo>.boton{margin-bottom:26px}
.cuerpo{font:20px/1.72 var(--f-tit);color:var(--tinta)}
.cuerpo p{margin:0 0 1.2em;text-wrap:pretty}
.cuerpo>p:first-child::first-letter{float:left;font:700 3.9em/.82 var(--f-tit);margin:.06em .1em 0 0;color:var(--azul-logo)}
.cuerpo h2{font:700 27px/1.2 var(--f-tit);margin:1.6em 0 .5em;letter-spacing:-.01em}
.cuerpo a{color:var(--azul);text-decoration:underline;text-decoration-color:rgba(37,137,191,.4);text-underline-offset:3px;word-break:break-word;transition:text-decoration-color .3s}
.cuerpo a:hover{text-decoration-color:currentColor}
.fuente{font-size:14.5px;color:var(--tinta-3)}
.fuente a{color:var(--azul);font-weight:700}
.art-fin{margin-top:34px;display:flex;flex-direction:column;gap:12px}
.art-fin>p{font:700 13px var(--f-ui);text-transform:uppercase;letter-spacing:.08em;color:var(--tinta-3)}
.art-wa{display:flex;align-items:center;gap:16px;margin-top:34px;padding:22px 26px;border-radius:var(--r);background:radial-gradient(120% 140% at 0% 0%,var(--azul-claro),transparent 75%);transition:transform .5s var(--curva)}
.art-wa:hover{transform:translateX(4px)}
.art-wa svg{width:34px;height:34px;color:var(--verde);flex:none}
.art-wa span{display:flex;flex-direction:column;font-size:14.5px;color:var(--tinta-2)}
.art-wa b{font:700 19px var(--f-tit);color:var(--tinta)}
.despues{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:56px;padding-block:64px 64px}
.rejilla-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.nota>a{display:flex;flex-direction:column;gap:12px}
.nota .titular{font-size:19.5px;font-weight:700}

/* ---------- secciones, búsqueda y páginas internas ---------- */
.pag-sec{padding-block:30px 56px}
.sec-cab{padding-bottom:22px;margin-bottom:30px;background:linear-gradient(90deg,var(--cielo),transparent 60%) bottom/100% 2px no-repeat}
.sec-cab h1{font:900 clamp(36px,5.5vw,64px)/.95 var(--f-logo);letter-spacing:-.045em;color:var(--tinta)}
.es-boys .sec-cab h1{color:var(--rosa)}
.es-boys .sec-cab{background-image:linear-gradient(90deg,var(--rosa-vivo),transparent 60%)}
.sec-cab p{font:italic 19px/1.5 var(--f-tit);color:var(--tinta-2);margin-top:12px;max-width:62ch}
.sec-lider>a{position:relative;display:block;border-radius:calc(var(--r) + 6px);overflow:hidden;margin-bottom:40px;background:var(--marino);isolation:isolate}
.sec-lider .marco{aspect-ratio:21/9;border-radius:0}
.sec-lider .foto{height:100%;aspect-ratio:auto}
.sec-lider .marco::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,rgba(6,14,22,.9))}
.sec-lider-txt{position:absolute;left:0;right:0;bottom:0;padding:30px 32px;display:flex;flex-direction:column;gap:12px;z-index:1}
.sec-lider>a:not(:has(.marco)) .sec-lider-txt{position:static}
.sec-lider .titular{color:#fff;font-size:clamp(24px,3vw,40px);font-weight:700;line-height:1.1}
.sec-lider .bajada{color:rgba(255,255,255,.85);max-width:70ch}
.sec-lider .meta{color:rgba(255,255,255,.8)}
.sec-lider a:hover .titular{color:#fff}
.pag-sec>.rejilla-3{margin-bottom:48px}
.sec-cuerpo{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:56px}
.pager{display:flex;justify-content:space-between;gap:12px;padding-top:40px}
.pager a{font:700 13px var(--f-ui);text-transform:uppercase;letter-spacing:.06em;color:#fff;background:linear-gradient(135deg,var(--cielo),var(--azul-logo));padding:13px 24px;border-radius:99px;transition:transform .45s var(--curva)}
.pager a:hover{transform:translateY(-2px)}
.buscar-grande{display:flex;gap:10px;margin-top:18px;max-width:680px}
.buscar-grande input{flex:1;min-width:0;font:500 17px var(--f-ui);color:var(--tinta);background:var(--papel-2);border:0;border-radius:99px;padding:14px 22px}
.buscar-grande input:focus{outline:3px solid var(--velo);background:var(--papel)}
.resultado{font:600 15px var(--f-ui);color:var(--tinta-2);margin-bottom:24px}
.resultado a{color:var(--azul);margin-left:8px}
.vacio{padding-block:40px;font:19px/1.55 var(--f-tit);color:var(--tinta-2);display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.vacio h1{font:900 clamp(32px,5vw,52px) var(--f-logo);letter-spacing:-.04em;color:var(--tinta)}
.vacio a:not(.boton){color:var(--azul);font-weight:700}

/* historia (¿Quiénes somos?) */
.historia{background:radial-gradient(80% 120% at 10% 0%,var(--azul-claro),transparent 70%);-webkit-mask-image:linear-gradient(180deg,transparent,#000 50px,#000 calc(100% - 50px),transparent);mask-image:linear-gradient(180deg,transparent,#000 50px,#000 calc(100% - 50px),transparent)}
.historia .wrap{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px 56px;padding-block:80px;align-items:end}
.historia-cifra{font:italic 700 clamp(96px,13vw,176px)/.78 var(--f-cifra);background:linear-gradient(160deg,var(--azul-logo),var(--marino-2));-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-.04em}
.historia-cifra small{font-size:.3em;margin-left:.12em;letter-spacing:0}
.historia-txt h2{font:700 clamp(26px,3vw,36px)/1.12 var(--f-tit);letter-spacing:-.01em;margin-bottom:12px}
.historia-txt p{font:18.5px/1.6 var(--f-tit);color:var(--tinta-2);max-width:60ch}
.historia-txt strong{color:var(--tinta)}
.linea{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:30px;background:linear-gradient(90deg,var(--azul-logo),rgba(42,122,165,.15)) top/100% 2px no-repeat}
.linea li{position:relative;padding:24px 28px 0 0}
.linea li::before{content:"";position:absolute;top:-6px;left:0;width:14px;height:14px;border-radius:50%;background:var(--papel);box-shadow:0 0 0 3px var(--azul-logo)}
.linea li:last-child::before{background:var(--azul-logo);box-shadow:0 0 0 3px var(--azul-logo),0 0 0 9px var(--velo)}
.linea b{display:block;font:900 22px var(--f-logo);letter-spacing:-.03em}
.linea p{font:16px/1.5 var(--f-tit);color:var(--tinta-2);margin-top:6px}
.nos-contacto{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px;padding-block:48px 64px}
.nos-lista{display:flex;flex-direction:column;gap:22px}
.nos-lista li{display:flex;flex-direction:column;gap:4px;font:17px/1.55 var(--f-tit);color:var(--tinta-2)}
.nos-lista b{font:800 15px var(--f-ui);color:var(--tinta)}
.nos-lista a{color:var(--azul);font-weight:700}

/* ---------- edictos ---------- */
.ed-datos{display:flex;flex-wrap:wrap;gap:14px 40px;margin-top:24px}
.ed-datos dt{font:700 11.5px var(--f-ui);text-transform:uppercase;letter-spacing:.07em;color:var(--tinta-3)}
.ed-datos dd{margin:4px 0 0;font:600 15px var(--f-ui)}
.edicto .art-cuerpo{padding-top:28px}
.ed-texto{font:18px/1.72 var(--f-tit)}
.ed-texto p{margin:0 0 1em}
.ed-scan{margin:28px 0 0}
.ed-scan img{display:block;width:100%;height:auto;border-radius:var(--r-s);box-shadow:var(--sombra)}
.ed-scan figcaption{font-size:13px;color:var(--tinta-3);margin-top:10px;text-align:center}

/* ---------- diario digital ---------- */
.dd-ultima{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px;align-items:center;padding-bottom:56px}
.dd-hoja{padding:34px;border-radius:50%;background:radial-gradient(closest-side,var(--azul-claro),transparent)}
.dd-hoja img{display:block;width:100%;max-width:420px;margin-inline:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 0;border-radius:4px;box-shadow:0 50px 60px -36px rgba(13,42,66,.7),0 2px 8px rgba(0,0,0,.08);transform:rotate(-2.5deg);transition:transform 1s var(--curva)}
.dd-hoja:hover img{transform:rotate(0) translateY(-6px)}
.dd-txt{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.sobre-azul{display:inline-flex;align-items:center;gap:8px;font:800 12px var(--f-ui);text-transform:uppercase;letter-spacing:.08em;color:var(--cielo)}
.sobre-azul::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px var(--velo)}
.dd-txt h2{font:700 clamp(30px,3.6vw,46px)/1.06 var(--f-tit);letter-spacing:-.015em}
.dd-titulares{display:flex;flex-direction:column;gap:10px;width:100%}
.dd-titulares li{padding-left:18px;font:600 17px/1.35 var(--f-tit);position:relative}
.dd-titulares li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:50%;background:var(--cielo)}
.dd-precio{font:900 32px var(--f-logo);letter-spacing:-.03em}
.dd-txt .boton-wa{font-size:16px;padding:17px 30px}
.dd-num{font-size:14px;color:var(--tinta-2)}
.dd-pasos{padding-block:48px}
.dd-pasos h2,.dd-planes h2,.dd-archivo h2{font:900 26px var(--f-logo);letter-spacing:-.035em;margin-bottom:26px}
.dd-pasos ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;counter-reset:p}
.dd-pasos li{counter-increment:p}
.dd-pasos li::before{content:counter(p);display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--velo);font:italic 700 26px/1 var(--f-cifra);color:var(--azul-logo);margin-bottom:14px}
.dd-pasos b{font:800 17px var(--f-ui)}
.dd-pasos p{font:16px/1.55 var(--f-tit);color:var(--tinta-2);margin-top:6px}
.dd-nota{margin-top:24px;font:16px/1.55 var(--f-tit);color:var(--tinta-2)}
.dd-planes{padding-block:48px}
.dd-planes-rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px}
.plan{border-radius:calc(var(--r) + 4px);padding:26px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;background:radial-gradient(120% 120% at 0% 0%,var(--azul-claro),transparent 70%);transition:transform .5s var(--curva)}
.plan:hover{transform:translateY(-4px)}
.plan h3{font:800 18px var(--f-ui)}
.plan-precio{font:900 28px var(--f-logo);letter-spacing:-.03em;color:var(--azul)}
.plan p{color:var(--tinta-2);font-size:15px}
.plan .boton{margin-top:auto}
.dd-archivo{padding-top:48px}
.dd-archivo ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:28px}
.dd-archivo a{display:flex;flex-direction:column;gap:8px}
.dd-mini{aspect-ratio:4/5;background:var(--papel-2);overflow:hidden;border-radius:6px;box-shadow:var(--sombra);transition:transform .6s var(--curva),box-shadow .6s var(--curva)}
.dd-archivo a:hover .dd-mini{transform:translateY(-6px) rotate(-1deg);box-shadow:var(--sombra-alta)}
.dd-mini img{width:100%;height:100%;object-fit:cover;object-position:50% 0}
.dd-archivo span{font:700 14px var(--f-ui)}
.dd-archivo small{font:700 12.5px var(--f-ui);color:var(--verde)}

/* ---------- enlace de la bio ---------- */
.redes-pag{max-width:640px;padding-block:24px 56px}
.redes-intro{font:italic 18px var(--f-tit);color:var(--tinta-2);text-align:center}
.redes-botones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:18px 0 28px}
.redes-botones .boton{padding:13px 8px;font-size:13.5px}
.redes-lista{display:flex;flex-direction:column;gap:6px}
.redes-lista a{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-items:center;padding:10px;margin-inline:-10px;border-radius:var(--r);transition:background-color .4s var(--curva)}
.redes-lista a:hover{background:var(--velo)}
.redes-lista .foto,.redes-lista .sin-foto{aspect-ratio:1}
.redes-lista strong{display:block;font:600 17px/1.28 var(--f-tit);margin:6px 0 3px}
.redes-mas{display:flex;justify-content:center;margin-top:26px}

/* ---------- adaptable ---------- */
@media (max-width:1080px){
  .hero{grid-template-columns:minmax(0,1fr)}
  .imp-rejilla{grid-template-columns:repeat(2,minmax(0,1fr))}
  .con-lateral,.despues,.sec-cuerpo{grid-template-columns:minmax(0,1fr);gap:56px}
  .lateral{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .lateral:empty{display:none}
  .boys-rejilla{grid-template-columns:minmax(0,1fr)}
  .pie-top{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pie-marca{grid-column:1/-1}
}
@media (max-width:820px){
  .util-ano{display:none}
  .dd-ultima,.nos-contacto{grid-template-columns:minmax(0,1fr);gap:28px}
  .dd-pasos ol{grid-template-columns:minmax(0,1fr);gap:24px}
  .historia .wrap{grid-template-columns:minmax(0,1fr)}
  .linea{grid-template-columns:minmax(0,1fr);background:linear-gradient(180deg,var(--azul-logo),rgba(42,122,165,.15)) left/2px 100% no-repeat;margin-left:6px;padding-left:28px}
  .linea li{padding:0 0 26px}
  .linea li::before{top:6px;left:-34px}
  .rejilla-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rejilla-3>:nth-child(3){display:none}
  .boys-principal>a,.boys-rejilla.solo .boys-principal>a{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px}
  .sec-lider .marco{aspect-ratio:16/10}
}
@media (max-width:640px){
  :root{--r:16px;--r-s:10px}
  .util .wrap{min-height:40px;gap:6px 12px}
  .util-fecha{font-size:12px}
  .util .redes{display:none}
  .mast{padding-block:20px 16px}
  .lema{font-size:12.5px;flex-direction:column;gap:2px}
  .lema span+span::before{display:none}
  .nav .wrap{gap:4px}
  .nav li a{padding:8px 11px;font-size:12px}
  .nav-wa{display:none}
  .nav.fija .nav-mini{display:none}
  .tendencias .wrap{padding-top:14px;gap:10px}
  .hero{padding-top:14px;gap:22px}
  .carrusel{border-radius:var(--r)}
  .diapo>a{aspect-ratio:4/5;max-height:none}
  .diapo-txt{padding:22px 20px 78px}
  .diapo .titular{font-size:24px}
  .carrusel-ctrl{right:auto;left:20px;bottom:22px}
  .carrusel-puntos{left:20px;right:20px;top:14px}
  .imperdibles{padding-top:32px}
  .imp-rejilla{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin-inline:calc(-1 * var(--gut));padding-inline:var(--gut);scrollbar-width:none}
  .imp-rejilla::-webkit-scrollbar{display:none}
  .imp{flex:0 0 78%;scroll-snap-align:start}
  .imp>a{height:300px}
  .con-lateral{padding-top:30px}
  .feed-lista{gap:22px}
  .feed>a{grid-template-columns:112px minmax(0,1fr);gap:14px}
  .feed .marco{border-radius:var(--r-s)}
  .feed .foto,.feed .sin-foto{aspect-ratio:1}
  .feed-txt{gap:7px}
  .feed .titular{font-size:17px}
  .feed .bajada,.feed .leer,.feed .meta span{display:none}
  .lateral{grid-template-columns:minmax(0,1fr)}
  .banda-boys .wrap{padding-block:80px}
  .boys-principal>a,.boys-rejilla.solo .boys-principal>a{grid-template-columns:minmax(0,1fr)}
  .boys-principal .marco{max-width:320px}
  .pie-top{grid-template-columns:minmax(0,1fr);gap:36px}
  .pie .wrap{padding-top:110px}
  .rejilla-3{grid-template-columns:minmax(0,1fr)}
  .rejilla-3>:nth-child(3){display:block}
  .compartir-mini{width:100%}
  .cuerpo{font-size:19px}
  .urgente a,.urgente p{font-size:15px}
  .buscar-grande{flex-direction:column}
  .redes-botones .boton svg{display:none}
  .dd-hoja{padding:18px}
  .dock{width:calc(100% - 24px);bottom:calc(12px + env(safe-area-inset-bottom,0px))}
  .dock .wrap{gap:10px;min-height:58px}
  .dock p span{font-size:12px}
  .dock .boton{padding:10px 14px}
  .sec-lider-txt{padding:20px}
}
/* ---------- Avisos: franja de venta (portada y cabecera de la página de avisos) ---------- */
.banda-avisos{position:relative;isolation:isolate;margin-block:20px;
  background:radial-gradient(55% 90% at 92% 8%,rgba(37,137,191,.24),transparent 70%),radial-gradient(45% 80% at 4% 100%,rgba(31,170,83,.14),transparent 70%),var(--azul-claro);
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 60px,#000 calc(100% - 60px),transparent);mask-image:linear-gradient(180deg,transparent,#000 60px,#000 calc(100% - 60px),transparent)}
.banda-avisos>.wrap{padding-block:96px;display:flex;flex-direction:column;gap:44px}
.av-rejilla{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px;align-items:center}
.av-txt{display:flex;flex-direction:column;gap:18px;align-items:flex-start;min-width:0}
.av-sello{display:inline-flex;align-items:center;gap:10px;font:700 13.5px var(--f-ui);color:var(--azul)}
.av-sello span{width:8px;height:8px;border-radius:50%;background:var(--verde);box-shadow:0 0 0 4px rgba(31,170,83,.2)}
.av-txt h2{font:700 clamp(32px,4vw,50px)/1.05 var(--f-tit);letter-spacing:-.02em;color:var(--tinta);text-wrap:balance}
.av-txt h1{font:900 clamp(54px,7vw,88px)/.95 var(--f-logo);letter-spacing:-.045em;color:var(--tinta)}
.av-bajada{font:19px/1.5 var(--f-tit);color:var(--tinta-2);max-width:46ch}
.av-acciones{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.av-acciones .boton{padding:16px 26px;font-size:15px}
.av-pasos{display:flex;flex-direction:column;gap:12px;margin-top:10px;counter-reset:paso}
.av-pasos li{display:flex;align-items:center;gap:14px;font:600 16px var(--f-ui);color:var(--tinta)}
.av-pasos li::before{counter-increment:paso;content:counter(paso);flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--papel);color:var(--azul);font:800 15px var(--f-ui);box-shadow:var(--sombra)}
.av-tipos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px}
.av-tipos a{position:relative;display:flex;flex-direction:column;gap:4px;padding:18px 46px 18px 20px;border-radius:var(--r);transition:background-color .45s var(--curva),transform .45s var(--curva),box-shadow .45s var(--curva)}
.av-tipos a:hover{background:var(--papel);transform:translateY(-3px);box-shadow:var(--sombra)}
.av-tipos b{font:700 18px/1.2 var(--f-tit);color:var(--tinta)}
.av-tipos span{font-size:14px;line-height:1.45;color:var(--tinta-2)}
.av-tipos svg{position:absolute;right:16px;top:50%;width:18px;height:18px;margin-top:-9px;color:var(--verde);opacity:.55;transition:transform .45s var(--curva),opacity .45s var(--curva)}
.av-tipos a:hover svg{opacity:1;transform:translateX(4px)}
.av-anuncio{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:16px 16px 16px 20px;border-radius:99px;color:var(--sobre-oscuro);background:linear-gradient(100deg,var(--marino),var(--marino-2) 60%,#1d5a85);box-shadow:var(--sombra-alta)}
.av-anuncio-ic{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.1);color:#ffd166}
.av-anuncio-ic svg{width:23px;height:23px}
.av-anuncio p{flex:1;min-width:0;font:17px/1.4 var(--f-tit);color:var(--sobre-oscuro-2)}
.av-anuncio b{color:#fff;font-weight:700}
.w-promo{font:600 17px/1.35 var(--f-tit);color:var(--tinta)}
.w-anunciar{display:inline-flex;align-items:center;gap:8px;font:700 13.5px var(--f-ui);color:var(--azul);transition:gap .35s var(--curva)}
.w-anunciar:hover{gap:12px}
.w-anunciar svg{width:17px;height:17px;color:#e0a100}
@media (max-width:900px){.av-rejilla{grid-template-columns:minmax(0,1fr);gap:32px}}
@media (max-width:640px){
  .banda-avisos>.wrap{padding-block:70px;gap:30px}
  .av-tipos{grid-template-columns:minmax(0,1fr);gap:2px}
  .av-tipos a{padding:14px 40px 14px 12px}
  .av-anuncio{border-radius:var(--r);padding:20px}
  .av-anuncio .boton{width:100%}
  .av-acciones .boton{flex:1 1 auto}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .por-ver{opacity:1;transform:none}
  a:hover .foto{transform:none}
}

/* flechas para volver atrás y adelante (en el celular y dentro de apps no siempre se ve el botón del navegador) */
.nav-flechas{flex:none;display:flex;align-items:center;gap:2px;padding:3px;border-radius:99px;background:rgba(255,255,255,.08)}
.nav-flechas .nav-casa{background:rgba(255,255,255,.12)}
.nav-flecha{width:34px;height:34px;border:0;border-radius:50%;display:grid;place-items:center;background:none;color:#fff;cursor:pointer;transition:background-color .4s var(--curva),opacity .4s var(--curva),transform .4s var(--curva)}
.nav-flecha:hover{background:rgba(255,255,255,.14)}
.nav-flecha:active{transform:scale(.92)}
.nav-flecha svg{width:18px;height:18px}
#atras svg{transform:rotate(180deg)}
.nav-flecha[aria-disabled="true"]{opacity:.35;cursor:default}
.nav-flecha[aria-disabled="true"]:hover{background:none}
@media (max-width:640px){
  .nav-flecha{width:30px;height:30px}
  .nav-flechas .nav-casa{width:34px;height:34px}
  .interruptor{width:44px}
  .interruptor[aria-checked="true"] .perilla{transform:translateX(16px)}
}