/* VerdadEs Puebla · tribuna ciudadana · morado de marca #673A8D + amarillo de tinta + rojo solo para urgente/nota roja · sin cursivas */
:root{--p:#673A8D;--p9:#1E0E33;--p8:#2D1750;--p7:#4B2A6E;--p3:#B58BDC;--p1:#F1E9F8;--y:#FFC51F;--r:#E1262D;--ink:#17121F;--mut:#6B6577;--ln:#E4DCEC;--bg:#FBF9FD;--w:#fff;--disp:"Barlow Condensed","Arial Narrow",Impact,sans-serif;--ui:"Source Sans 3","Segoe UI",system-ui,sans-serif;--serif:"Source Serif 4",Georgia,serif;--mono:"Source Sans 3",system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:400 17px/1.55 var(--ui);font-style:normal;overflow-x:hidden}
img{max-width:100%;display:block}a{color:inherit;text-decoration:none}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.disp{font-family:var(--disp);font-weight:700;letter-spacing:-.005em;line-height:1.02}
.mono{font-family:var(--ui);font-weight:700;font-size:12px;letter-spacing:.09em;text-transform:uppercase}
.skip{position:absolute;left:-999px;top:0;background:var(--y);color:var(--ink);padding:10px 14px;z-index:99}.skip:focus{left:8px;top:8px}
#prog{position:fixed;left:0;top:0;height:3px;width:100%;background:var(--y);transform-origin:0 50%;transform:scaleX(0);z-index:80}

/* cabecera */
.vh{position:sticky;top:0;z-index:60;background:var(--p9);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.08)}
.vh1 .wrap{display:flex;align-items:center;gap:22px;height:78px;transition:height .3s}
.sc .vh1 .wrap{height:54px}
.vh .lg img{height:46px;width:auto;transition:height .3s}.sc .vh .lg img{height:34px}
.vdate{margin-left:auto;font:600 13px var(--ui);color:#CDBBE3;letter-spacing:.02em}
.vdate b{color:var(--y);font-weight:700;margin-right:10px;text-transform:uppercase;letter-spacing:.1em;font-size:11px}
.btn-mail{background:var(--y);color:var(--ink);font:700 12px var(--ui);letter-spacing:.08em;text-transform:uppercase;padding:10px 16px;border-radius:2px;transition:transform .2s}
.btn-mail:hover{transform:translateY(-2px)}
.vn{background:var(--p);border-top:1px solid rgba(255,255,255,.1)}
.vn .wrap{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.vn .wrap::-webkit-scrollbar{display:none}
.vn a{flex:none;color:#F2E8FB;font:700 13px var(--ui);letter-spacing:.08em;text-transform:uppercase;padding:14px 15px;position:relative;white-space:nowrap}
.vn a::after{content:"";position:absolute;left:15px;right:15px;bottom:0;height:3px;background:var(--y);transform:scaleX(0);transform-origin:0 50%;transition:transform .3s}
.vn a:hover::after,.vn a.on::after{transform:scaleX(1)}
.vn a.hot{color:#fff;background:var(--r)}.vn a.hot::after{display:none}

/* cintillo ultima hora */
.uh{background:#fff;border-bottom:1px solid var(--ln);display:flex;align-items:stretch;overflow:hidden}
.uh .lb{flex:none;background:var(--r);color:#fff;font:700 13px var(--ui);letter-spacing:.14em;text-transform:uppercase;padding:11px 18px;display:flex;align-items:center;gap:9px;position:relative;z-index:2}
.uh .lb::before{content:"";width:8px;height:8px;border-radius:50%;background:#fff;animation:lat 1.2s infinite}
@keyframes lat{50%{opacity:.25}}
.uh .win{overflow:hidden;flex:1;position:relative}
.uh .row{display:inline-flex;white-space:nowrap;animation:tk linear infinite;padding:11px 0}
.uh .row:hover{animation-play-state:paused}
.uh .row a{font:600 15px var(--ui);padding:0 28px;border-right:1px solid var(--ln)}
.uh .row a b{color:var(--p);margin-right:8px;font-weight:800;font-size:12px;letter-spacing:.08em}
@keyframes tk{to{transform:translateX(-50%)}}

/* mosaico */
.mos{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:230px 230px;gap:6px;margin-top:26px}
.mos a{position:relative;overflow:hidden;background:var(--p8);display:block;color:#fff}
.mos a:first-child{grid-column:1/3;grid-row:1/3}
.mos img,.mos .plate{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.mos a:hover img{transform:scale(1.05)}
.mos a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,14,51,0) 30%,rgba(30,14,51,.92) 100%)}
.mos .tx{position:absolute;left:0;right:0;bottom:0;padding:18px 20px;z-index:2}
.chip{display:inline-block;background:var(--y);color:var(--ink);font:800 11px var(--ui);letter-spacing:.1em;text-transform:uppercase;padding:4px 9px;margin-bottom:9px}
.chip.r{background:var(--r);color:#fff}.chip.p{background:var(--p);color:#fff}
.mos h2,.mos h3{font-family:var(--disp);font-weight:700;line-height:1.02;text-wrap:balance}
.mos a:first-child h2{font-size:clamp(32px,3.6vw,52px)}
.mos h3{font-size:clamp(20px,1.7vw,25px)}
.mos .sm{font:400 16px/1.4 var(--ui);color:#E6DCF1;margin-top:10px;max-width:56ch}

/* cuerpo portada: lista + aside */
.tw>*,.lc>*{min-width:0}
.tw{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:44px;margin-top:46px;align-items:start}
.sh{display:flex;align-items:center;gap:14px;margin:0 0 20px}
.sh h2{font-family:var(--disp);font-weight:800;font-size:30px;text-transform:uppercase;letter-spacing:.01em;color:var(--p7);position:relative;padding-left:16px;line-height:1}
.sh h2::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:6px;background:var(--y)}
.sh .ln{flex:1;height:2px;background:var(--ln)}
.sh a{font:700 12px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--p)}.sh a:hover{text-decoration:underline}
.lc{display:grid;grid-template-columns:260px 1fr;gap:20px;padding:20px 0;border-bottom:1px solid var(--ln);align-items:start}
.lc:first-of-type{padding-top:0}
.lc .fg{aspect-ratio:16/10;overflow:hidden;background:var(--p8);position:relative}
.lc .fg img,.lc .fg .plate{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.lc:hover .fg img{transform:scale(1.06)}
.lc .k{font:800 11px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--p)}
.lc .k.r{color:var(--r)}
.lc h3{font-family:var(--disp);font-weight:700;font-size:clamp(24px,2.2vw,31px);line-height:1.05;margin:5px 0 8px;text-wrap:balance}
.lc:hover h3{color:var(--p)}
.lc p{font-size:16px;color:#4A4456;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lc .d{font:600 12px var(--ui);color:var(--mut);margin-top:8px;letter-spacing:.04em;text-transform:uppercase}

.ranked{background:#fff;border:1px solid var(--ln);border-top:5px solid var(--p);padding:6px 20px 12px;margin-bottom:28px}
.ranked h3{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:26px;color:var(--p7);padding:14px 0 6px}
.ranked a{display:grid;grid-template-columns:44px 1fr;gap:10px;padding:14px 0;border-top:1px solid var(--ln);align-items:start}
.ranked a:first-of-type{border-top:0}
.ranked i{font:800 42px/0.9 var(--disp);color:var(--p3);font-style:normal}
.ranked a:nth-of-type(-n+3) i{color:var(--y);-webkit-text-stroke:1px var(--p7)}
.ranked h4{font-family:var(--disp);font-weight:700;font-size:20px;line-height:1.1}
.ranked a:hover h4{color:var(--p)}
.ranked span{display:block;font:700 11px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin-top:4px}
.box{background:var(--p9);color:#fff;padding:22px;margin-bottom:28px;position:relative;overflow:hidden}
.box h3{font-family:var(--disp);font-weight:800;font-size:28px;line-height:1;text-transform:uppercase;color:var(--y);margin-bottom:8px}
.box p{font-size:15px;color:#D5C6E8;line-height:1.5;margin-bottom:14px}
.box a.b{display:inline-block;background:var(--y);color:var(--ink);font:800 12px var(--ui);letter-spacing:.09em;text-transform:uppercase;padding:11px 16px}
.box::after{content:"";position:absolute;right:-40px;top:-40px;width:140px;height:140px;border:22px solid rgba(181,139,220,.18);border-radius:50%}

/* banda nota roja */
.roja{background:var(--p9);color:#fff;margin-top:56px;padding:46px 0 52px;position:relative}
.roja::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:repeating-linear-gradient(90deg,var(--r) 0 26px,var(--y) 26px 52px)}
.roja .sh h2{color:#fff}.roja .sh h2::before{background:var(--r)}.roja .sh .ln{background:rgba(255,255,255,.14)}.roja .sh a{color:var(--y)}
.rg{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.rg a{display:block;border-top:3px solid var(--r);padding-top:14px}
.rg .fg{aspect-ratio:16/10;overflow:hidden;background:var(--p8);margin-bottom:14px}
.rg .fg img,.rg .fg .plate{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.rg a:hover img{transform:scale(1.06)}
.rg .k{font:800 11px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:#FF8A8F}
.rg h3{font-family:var(--disp);font-weight:700;font-size:24px;line-height:1.05;margin-top:6px;text-wrap:balance}
.rg a:hover h3{color:var(--y)}

/* carril de municipios */
.rail{margin-top:56px}
.rail .tr{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,1fr);gap:16px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x proximity}
.rail .tr a{background:#fff;border:1px solid var(--ln);scroll-snap-align:start;display:block;transition:transform .3s,box-shadow .3s}
.rail .tr a:hover{transform:translateY(-4px);box-shadow:0 14px 28px -14px rgba(75,42,110,.35)}
.rail .fg{aspect-ratio:16/10;overflow:hidden;background:var(--p8)}
.rail .fg img,.rail .fg .plate{width:100%;height:100%;object-fit:cover}
.rail .in{padding:14px 16px 18px}
.rail .k{font:800 11px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--p)}
.rail h3{font-family:var(--disp);font-weight:700;font-size:23px;line-height:1.05;margin-top:5px}

/* cuatro columnas mini */
.cols4{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:56px}
.mini{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--ln);align-items:start}
.mini img{width:72px;height:72px;object-fit:cover}
.mini h4{font-family:var(--disp);font-weight:700;font-size:19px;line-height:1.08}
.mini:hover h4{color:var(--p)}
.mini .mono{font-size:10px;color:var(--mut);display:block;margin-bottom:3px}
.cols4 .ch{display:flex;justify-content:space-between;align-items:baseline;border-bottom:3px solid var(--p);padding-bottom:7px;margin-bottom:6px}
.cols4 .ch h3{font-family:var(--disp);font-weight:800;font-size:23px;text-transform:uppercase;color:var(--p7)}
.cols4 .ch a{font:700 11px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--p)}

/* rejilla de tarjetas */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 24px}
.card{display:block;background:#fff;border:1px solid var(--ln);transition:transform .3s,box-shadow .3s}
.card:hover{transform:translateY(-4px);box-shadow:0 16px 30px -16px rgba(75,42,110,.4)}
.card .fig{aspect-ratio:16/10;overflow:hidden;background:var(--p8);position:relative}
.card .fig img,.card .fig .plate{width:100%;height:100%;object-fit:cover}
.card .sec{padding:14px 18px 0;color:var(--p)}
.card h3{font-family:var(--disp);font-weight:700;font-size:25px;line-height:1.05;padding:6px 18px 0;text-wrap:balance}
.card p{padding:8px 18px 0;font-size:15px;color:#4A4456;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .by{padding:12px 18px 18px;color:var(--mut);font-size:11px}
.card .cr{display:none}
.card h3:last-child{padding-bottom:18px}
.placas{margin-top:56px}

/* placa grafica cuando no hay imagen */
.plate{background:linear-gradient(135deg,var(--p8),var(--p7));color:#fff;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;min-height:150px}
.plate svg{position:absolute;right:0;top:0;width:70%;opacity:.5}
.plate .pn{font:800 54px/1 var(--disp);color:var(--y)}.plate .pn small{font-size:22px;margin-left:6px;color:#fff}

/* pagina de nota */
.crumbs{font:700 12px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);padding:26px 0 0}
.crumbs a{color:var(--p)}.crumbs a:hover{text-decoration:underline}.crumbs i{font-style:normal;margin:0 8px;color:var(--ln)}
.art-w{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:56px;align-items:start;padding-bottom:30px}
.art{max-width:780px;padding-top:14px}
.art .kick{display:inline-block;background:var(--p);color:#fff;padding:5px 11px;font-size:11px}
.art .kick.r{background:var(--r)}
.art h1{font-size:clamp(38px,5.4vw,70px);color:var(--p9);margin:16px 0 18px;text-wrap:balance;line-height:.98}
.art .sum{font:600 21px/1.45 var(--ui);color:#3B3446;padding-left:18px;border-left:5px solid var(--y);margin-bottom:22px}
.by2{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;border-top:1px solid var(--ln);border-bottom:1px solid var(--ln);padding:12px 0;margin-bottom:22px;font:600 14px var(--ui);color:var(--mut)}
.by2 b{color:var(--ink)}
.share{margin-left:auto;display:flex;gap:8px}
.share a,.share button{background:var(--p1);color:var(--p7);border:0;font:800 11px var(--ui);letter-spacing:.08em;text-transform:uppercase;padding:9px 13px;cursor:pointer;transition:background .2s,color .2s}
.share a:hover,.share button:hover{background:var(--p);color:#fff}
.share a.wa{background:#1FA855;color:#fff}.share a.wa:hover{background:#17863f}
.art .fig{aspect-ratio:16/9;overflow:hidden;background:var(--p8);margin:0}
.art .fig img,.art .fig .plate{width:100%;height:100%;object-fit:cover}
.figcap{font:600 11px var(--ui);color:var(--mut);letter-spacing:.06em;text-transform:uppercase;margin:8px 0 28px}
.body{font:400 20px/1.72 var(--serif);color:#201A29}
.body p{margin:0 0 1.15em}
.body>p:first-child::first-letter{font:800 4.1em/.8 var(--disp);float:left;color:var(--p);padding:6px 10px 0 0}
.body h2{font:800 34px/1 var(--disp);color:var(--p7);margin:1.4em 0 .5em;text-transform:uppercase}
.body a{color:var(--p);border-bottom:2px solid var(--y)}
.body .sum{font-size:21px}
.src{margin-top:34px;border:1px solid var(--ln);background:#fff;padding:18px 20px}
.src h4{color:var(--p);margin-bottom:8px}
.src a{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--ln);font:600 15px var(--ui)}
.src a .mono{color:var(--p);font-size:10px;white-space:nowrap}
.aside{position:sticky;top:96px;padding-top:34px}
.more{padding:20px 0 70px;border-top:1px solid var(--ln);margin-top:20px}

/* pagina de seccion */
.shero{background:var(--p9);color:#fff;padding:46px 0 40px;margin-bottom:38px;position:relative;overflow:hidden}
.shero::after{content:"";position:absolute;right:-60px;top:-80px;width:340px;height:340px;border:44px solid rgba(181,139,220,.14);border-radius:50%}
.shero .kick{color:var(--y)}
.shero h1{font-size:clamp(48px,7vw,104px);text-transform:uppercase;margin-top:8px}
.shero p{color:#D5C6E8;max-width:60ch;margin-top:10px;font-size:18px}
.shero.r{background:linear-gradient(180deg,var(--p9),#2A0F1E)}.shero.r .kick{color:#FF8A8F}

/* pie */
footer{background:var(--p9);color:#D5C6E8;margin-top:30px;position:relative}
footer::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:repeating-linear-gradient(90deg,var(--y) 0 26px,var(--p) 26px 52px)}
footer>.wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-top:56px;padding-bottom:30px}
footer img{height:54px;width:auto;margin-bottom:14px}
footer p{max-width:42ch;font-size:15px}
footer h4{color:var(--y);margin-bottom:12px}
footer a{display:block;padding:4px 0;font-size:15px}footer a:hover{color:#fff;text-decoration:underline}
footer .fin{grid-column:1/-1;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.12);padding-top:18px;margin-top:14px;font-size:11px;color:#9F8BB7}
.sl{display:none}

/* institucionales */
.inst{padding:50px 0 60px;max-width:820px}
.inst h1{font-size:clamp(40px,6vw,76px);color:var(--p9);margin:12px 0 22px}
.inst .kick{color:var(--p)}
.inst h2{font:800 32px/1 var(--disp);text-transform:uppercase;color:var(--p7);margin:1.4em 0 .4em}
.inst .sum{font:600 21px/1.5 var(--ui);padding-left:18px;border-left:5px solid var(--y);margin-bottom:20px}
.inst p{font:400 19px/1.7 var(--serif);margin-bottom:1em}.inst a{color:var(--p);border-bottom:2px solid var(--y)}

.w{display:inline-block;overflow:hidden;vertical-align:top;line-height:1.02}.w>span{display:inline-block}

/* responsivo */
@media(max-width:1040px){.tw,.art-w{grid-template-columns:1fr}.aside{position:static;padding-top:0}.cols4{grid-template-columns:repeat(2,1fr)}.rg{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:repeat(2,1fr)}.mos{grid-template-rows:200px 200px}}
@media(max-width:680px){body{font-size:16px}.wrap{padding:0 16px}.vdate,.btn-mail{display:none}.vh1 .wrap{height:62px}.vh .lg img{height:38px}
 .mos{grid-template-columns:1fr 1fr;grid-template-rows:260px 160px 160px}.mos a:first-child{grid-column:1/3;grid-row:1}.mos .sm{display:none}
 .lc{grid-template-columns:116px 1fr;gap:12px}.lc p{display:none}.lc h3{font-size:21px}.cols4,.grid,.rg{grid-template-columns:1fr}.rg a:first-child{grid-column:auto}
 footer>.wrap{grid-template-columns:1fr}.share{margin-left:0;width:100%}.art .sum{font-size:18px}.body{font-size:18px}.sh h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}