
:root{--or:#F26A0F;--or2:#E8350C;--ink:#0B1530;--ink2:#1B2748;--ink3:#070E22;--bg:#F4F4F2;--w:#fff;--mut:#5E6780;--line:#E3E5EA;--lw:176px}
*{box-sizing:border-box;margin:0}
body{font-family:Archivo,Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.45;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
:focus-visible{outline:3px solid var(--or);outline-offset:2px}
header{background:var(--w);position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top)}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;max-width:1180px;margin:auto}
.logo{width:calc(var(--lw)*.955);height:calc(var(--lw)*.209);overflow:hidden;display:block}
.logo img{width:var(--lw);display:block;margin:calc(var(--lw)*-.1077) 0 0 calc(var(--lw)*-.03)}
.clima-chip{display:flex;align-items:center;gap:8px;font-weight:800;font-size:15px}
.clima-chip small{font-weight:400;color:var(--mut);display:none}
.nav{background:var(--ink)}
.nav nav{display:grid;grid-template-columns:repeat(4,1fr);max-width:1180px;margin:auto}
.nav nav a{padding:13px 2px 11px;color:#C9D0E4;font-weight:800;font-size:clamp(12.5px,3.7vw,16px);text-align:center;white-space:nowrap;border-bottom:4px solid transparent}
.nav nav a[aria-current=page]{color:#fff;border-color:var(--or)}
.nav.amb{background:var(--ink3)}
.nav.amb nav a{padding:8px 2px 6px;font-size:clamp(11px,3.2vw,13px);letter-spacing:.04em;text-transform:uppercase;border-bottom-width:3px}
.temas-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s ease;background:var(--ink2)}
.temas-wrap.abierto{grid-template-rows:1fr}
.temas-wrap>div{overflow:hidden}
.temas{max-width:1180px;margin:auto;display:grid;grid-template-columns:repeat(5,1fr);gap:4px;padding:8px 6px}
.temas a{padding:9px 1px;border-radius:6px;color:#DDE3F3;font-weight:600;font-size:clamp(10.5px,3vw,14px);text-align:center;white-space:nowrap}
.temas a[aria-current=page]{background:var(--or);color:#fff;font-weight:800}
.ultima{background:var(--or);color:#fff;font-weight:800;font-size:14px}
.ultima div{max-width:1180px;margin:auto;padding:8px 16px;display:flex;gap:10px}
.ultima b{background:var(--ink);padding:0 8px;font-size:12px;letter-spacing:.05em;flex:0 0 auto;align-self:center}
main{max-width:1180px;margin:20px auto 0;padding:0 16px;display:grid;gap:20px}
.img{background:linear-gradient(135deg,var(--ink),var(--ink2) 55%,var(--or2));position:relative;aspect-ratio:16/10;display:flex;align-items:flex-end}
.img.c2{background:linear-gradient(135deg,var(--or),var(--or2))}
.img.c3{background:linear-gradient(135deg,#27345F,var(--or))}
.tag{display:inline-block;background:var(--or);color:#fff;font-weight:800;font-size:12px;padding:3px 9px}
.tag.d{background:var(--ink)}
.hero{background:var(--w);display:block}
.hero .img{aspect-ratio:16/11}
.hero .img .tag{position:absolute;left:0;top:14px}
.hero .t{padding:16px}
.hero h1{font-size:26px;line-height:1.12;font-weight:900;letter-spacing:-.01em;margin-top:6px}
.hero p{color:var(--mut);margin-top:8px}
.meta{font-size:13px;color:var(--mut);margin-top:8px}
.filtro{display:flex;justify-content:space-between;align-items:center;background:var(--w);padding:10px 14px;font-weight:800;border-left:5px solid var(--or)}
.filtro button{color:var(--or2);font-size:14px}
.lista{display:grid;gap:1px;background:var(--line)}
.card{background:var(--w);display:grid;grid-template-columns:112px 1fr;gap:12px;padding:12px;cursor:pointer}
.card .img{aspect-ratio:1;align-self:start}
.card h2{font-size:17px;line-height:1.2;font-weight:800;margin:4px 0 2px}
.card:hover h2{color:var(--or2)}
.lock{font-size:12px;font-weight:800;color:var(--or2)}
.vacio{background:var(--w);padding:28px;text-align:center;color:var(--mut)}
.secs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.secs a{background:var(--w);padding:12px 2px;font-weight:800;font-size:clamp(11px,3.3vw,14px);border-bottom:4px solid var(--or)}
.secs span{display:block;font-size:22px}
.pub{font-size:11px;color:var(--mut);letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px}
.ad{background:repeating-linear-gradient(45deg,#fff3e8,#fff3e8 12px,#ffe6d0 12px,#ffe6d0 24px);border:1px dashed var(--or);display:grid;place-items:center;text-align:center;font-weight:800;color:var(--or2);aspect-ratio:32/10;width:100%;max-width:728px;margin:auto}
.ad small{display:block;font-weight:400;color:var(--mut)}
.carr{position:relative;background:var(--w);padding:10px 10px 6px}
.carr .ad{aspect-ratio:3/1;max-width:none}
.dots{display:flex;justify-content:center;gap:8px;padding-top:8px}
.dots button{width:10px;height:10px;border-radius:50%;background:var(--line)}
.dots button[aria-current=true]{background:var(--or)}
aside{display:grid;gap:16px;align-content:start}
.box{background:var(--w);padding:16px}
.box h3{font-size:16px;font-weight:900;border-left:5px solid var(--or);padding-left:10px;margin-bottom:12px}
.clima-big{display:flex;align-items:center;gap:14px}
.clima-big b{font-size:44px;font-weight:900;line-height:1}
.dias{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px;text-align:center;font-size:13px}
.dias div{background:var(--bg);padding:8px 4px}
.radio-box{background:var(--ink);color:#fff}.radio-box h3{color:#fff}.radio-box p{color:#C9D0E4;font-size:14px}
.top5 li{list-style:none;display:grid;grid-template-columns:28px 1fr;gap:8px;padding:9px 0;border-top:1px solid var(--line);font-weight:600;font-size:15px}
.top5 li:first-child{border:0}.top5 span{color:var(--or);font-weight:900;font-size:20px;line-height:1}
.socios{background:linear-gradient(160deg,var(--ink),var(--ink2));color:#fff}
.socios h3{color:#fff}.socios p{color:#C9D0E4;font-size:14px;margin-bottom:12px}
.nivel{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;margin-top:6px;background:rgba(255,255,255,.08);font-size:13px}
.nivel b{color:#FFB47A;white-space:nowrap}
.btn{display:block;width:100%;margin-top:12px;background:var(--or);color:#fff;font-weight:800;padding:12px;text-align:center}
.nota{background:var(--w);padding:18px 16px;max-width:760px;margin:auto}
.nota h1{font-size:28px;line-height:1.12;font-weight:900;margin:8px 0}
.nota .baj{font-size:18px;color:var(--mut)}
.nota .img{margin:14px -16px;aspect-ratio:16/9}
.nota p.tx{font-size:18px;line-height:1.65;margin:14px 0}
.volver{color:var(--or2);font-weight:800;margin-bottom:6px}
.pay{position:relative;margin-top:-80px;padding-top:90px;background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 70%)}
.pay .box{border:2px solid var(--or)}
.etq{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.etq span{background:var(--bg);padding:4px 10px;font-size:13px;font-weight:600}
.player{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--ink);color:#fff;border-top:3px solid var(--or);padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
.player .in{max-width:1180px;margin:auto;display:flex;align-items:center;gap:12px}
.play{width:44px;height:44px;border-radius:50%;background:var(--or);display:grid;place-items:center;flex:0 0 auto}
.play svg{width:20px;height:20px;fill:#fff}
.player b{display:block;font-size:15px}.player small{color:#C9D0E4}
.vivo{margin-left:auto;font-size:12px;font-weight:800;display:flex;align-items:center;gap:6px}
.vivo i{width:9px;height:9px;border-radius:50%;background:#888}
.on .vivo i{background:#ff3b30;animation:p 1.2s infinite}
@keyframes p{50%{opacity:.25}}
footer{max-width:1180px;margin:28px auto 0;padding:20px 16px;color:var(--mut);font-size:13px}
footer a{margin-right:14px;font-weight:600;text-decoration:underline}
[hidden]{display:none!important}
@media(min-width:900px){
 :root{--lw:250px}
 .clima-chip small{display:inline}
 .top{padding:14px 24px}
 main{grid-template-columns:1fr 320px;padding:0 24px;gap:24px}
 .temas{padding:10px 24px;gap:10px}
 .centro{display:grid;gap:20px}
 .hero{display:grid;grid-template-columns:1.35fr 1fr}
 .hero .img{aspect-ratio:auto;min-height:340px}
 .hero .t{padding:26px;align-self:center}
 .hero h1{font-size:34px}
 .lista{grid-template-columns:1fr 1fr}
 .card{grid-template-columns:130px 1fr}
 .ad{aspect-ratio:728/90}
 .carr .ad{aspect-ratio:4/1}
 .nota{padding:28px 36px}.nota .img{margin:14px 0}.nota h1{font-size:38px}
 .ultima div,.nav nav{padding-left:24px;padding-right:24px}
 body{padding-bottom:80px}
}
@media(prefers-reduced-motion:reduce){.temas-wrap{transition:none}.on .vivo i{animation:none}}

.nav nav a,.temas a,.secs a{display:block}
.secs a{text-align:center}
.img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pager{display:flex;justify-content:space-between;gap:10px}
.pager a{background:var(--w);padding:10px 16px;font-weight:800;border-bottom:3px solid var(--or)}
.slide{display:none}.slide.on{display:block}
.ad img{width:100%;height:auto;display:block}
.ad a{display:block;width:100%}
.cuerpo p{font-size:18px;line-height:1.65;margin:14px 0}
.cuerpo h2{font-size:22px;margin:22px 0 8px}
.cuerpo img{max-width:100%;height:auto}
.cuerpo a{color:var(--or2);text-decoration:underline}
.ruta{font-size:13px;color:var(--mut)}
.buscador{display:flex;gap:6px}.buscador input{flex:1;padding:10px;border:1px solid var(--line);font:inherit}
.buscador button{background:var(--or);color:#fff;font-weight:800;padding:0 16px}

/* Portada completa dentro de la nota, sin recorte */
.nota .img{aspect-ratio:auto;background:none;display:block}
.nota .img img{position:static;inset:auto;width:100%;height:auto;object-fit:contain;display:block}

/* Portada completa dentro de la nota, sin recorte */
.nota .img{aspect-ratio:auto;background:none;display:block}
.nota .img img{position:static;inset:auto;width:100%;height:auto;object-fit:contain;display:block}

/* Banner lateral */
.lat-ad{margin-bottom:16px}
.lat-ad .ad{aspect-ratio:auto;max-width:300px;border:0;background:none}
