:root{
  --paper:#FAF9F5;
  --surface:#FFFFFF;
  --ink:#15161B;
  --ink-soft:#3C4047;
  --muted:#74787F;
  --hair:#E9E6DD;
  --hair-2:#DDD9CD;
  --accent:#2348FF;
  --accent-soft:#ECEFFF;
  --live:#E0234E;
  --d-bio:#0E9C66;
  --d-hw:#2348FF;
  --d-sci:#7A3FF2;
  --d-mod:#C77F00;
  --d-lim:#5A636F;
  --d-chat:#E0457B;
  --maxw:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%}
a{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px}
.mono{font-family:"JetBrains Mono",monospace}

/* ── barra utilitaria (top) ───────────────────────────────────────────── */
.util{border-bottom:1px solid var(--hair);background:var(--paper)}
.util .wrap{display:flex;justify-content:space-between;align-items:center;height:40px;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.04em;color:var(--muted);text-transform:uppercase}
.util .brand{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-weight:600;text-decoration:none}
.brand-ico{width:20px;height:20px;border-radius:6px;display:block}
.util nav{display:flex;gap:18px;align-items:center}
.util nav a{text-decoration:none;color:var(--muted);transition:color .15s}
.util nav a:hover{color:var(--ink)}
.util .upd b{color:var(--ink);font-weight:500}
@media (max-width:560px){.util .upd{display:none}}

/* ── ticker de última hora (sticky) ───────────────────────────────────── */
.ticker{position:sticky;top:0;z-index:40;background:var(--ink);color:#E8E8EC;display:flex;align-items:stretch;height:46px;box-shadow:0 6px 20px -14px rgba(0,0,0,.6)}
.ticker .tk-label{flex-shrink:0;display:inline-flex;align-items:center;gap:9px;background:var(--live);color:#fff;font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:0 18px}
.ticker .tk-label .blip{width:8px;height:8px;border-radius:50%;background:#fff;animation:blink 1.3s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
.tk-view{overflow:hidden;flex:1;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent)}
.tk-track{display:flex;width:max-content;animation:tkscroll 70s linear infinite}
.ticker:hover .tk-track{animation-play-state:paused}
.tk-set{display:flex;align-items:center;flex-shrink:0}
.tk-dot{width:8px;height:8px;border-radius:50%;margin:0 11px 0 26px;flex-shrink:0}
.tk-link{font-family:"JetBrains Mono",monospace;font-size:12.5px;color:#c8ccd6;text-decoration:none;white-space:nowrap;line-height:46px;transition:color .15s}
.tk-link:hover{color:#fff}
@keyframes tkscroll{to{transform:translateX(-50%)}}
@media (max-width:560px){.ticker .tk-label span.txt{display:none}.ticker .tk-label{padding:0 14px}}

/* ── masthead ─────────────────────────────────────────────────────────── */
header.mast{padding:54px 0 26px}
.eyebrow{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin:0 0 18px;font-weight:600}
.wordmark{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.mast-ico{width:clamp(46px,7.5vw,82px);height:auto;border-radius:18px;flex-shrink:0;box-shadow:0 10px 26px -14px rgba(35,72,255,.6)}
h1.logo{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:clamp(54px,11vw,112px);line-height:.88;letter-spacing:-.04em;margin:0}
h1.logo a{text-decoration:none}
h1.logo .mark{color:var(--accent)}
.deck{font-size:clamp(16px,2vw,21px);color:var(--ink-soft);max-width:56ch;margin:22px 0 0;line-height:1.45}
.deck b{font-weight:600;color:var(--ink)}
.deck .hl{box-shadow:inset 0 -.5em 0 var(--accent-soft)}

/* ── barra de categorías (sticky bajo el ticker) ──────────────────────── */
.catbar{position:sticky;top:46px;z-index:30;background:rgba(250,249,245,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--hair)}
.catbar .wrap{display:flex;flex-wrap:wrap;gap:9px;align-items:center;padding:15px 26px}
.catbar .lbl{display:inline-flex;align-items:center;gap:7px;font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-right:6px}
.catbar .lbl::before{content:"";width:14px;height:2px;border-radius:2px;background:var(--accent)}
.chip{appearance:none;cursor:pointer;border:1.5px solid var(--hair-2);background:var(--surface);color:var(--ink-soft);font-family:"Inter",system-ui,sans-serif;font-size:13px;font-weight:500;padding:8px 16px;border-radius:999px;display:inline-flex;align-items:center;gap:8px;transition:color .16s,border-color .16s,background .16s,box-shadow .16s,transform .1s;text-decoration:none}
.chip .sw{width:9px;height:9px;border-radius:50%;background:var(--c,var(--muted));transition:transform .16s,background .16s}
.chip:hover{border-color:var(--c,var(--muted));color:var(--ink)}
.chip:hover .sw{transform:scale(1.25)}
.chip:active{transform:translateY(1px)}
.chip[aria-pressed="true"]{background:var(--c,var(--ink));border-color:var(--c,var(--ink));color:#fff;box-shadow:0 8px 20px -9px var(--c,rgba(21,22,27,.5))}
.chip[aria-pressed="true"] .sw{background:#fff;transform:none}
.chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ── sección ──────────────────────────────────────────────────────────── */
main{padding:30px 0 30px}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:6px 0 22px}
.sec-head h2{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:19px;letter-spacing:-.01em;margin:0;display:inline-flex;align-items:center;gap:10px}
.sec-head h2::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--accent)}
.sec-head .count{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}

.feed{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;grid-auto-flow:row dense}
@media (max-width:980px){.feed{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.feed{grid-template-columns:1fr}}
.feed .ad-slot[hidden]{display:none}

/* ── tarjeta (clicable, con imagen) ───────────────────────────────────── */
.card{position:relative;background:var(--surface);border:1px solid var(--hair);border-radius:16px;display:flex;flex-direction:column;overflow:hidden;text-decoration:none;color:inherit;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.card::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--c,var(--accent));opacity:0;transition:opacity .18s ease;z-index:2}
.card:hover::before{opacity:1}
.js .card{opacity:0;transform:translateY(12px)}
.js .card.in{opacity:1;transform:none}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -24px rgba(21,22,27,.45);border-color:var(--hair-2)}
.card[hidden]{display:none}
.card .thumb{aspect-ratio:16/9;overflow:hidden;background:var(--hair-2)}
.card .thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease}
.card:hover .thumb img{transform:scale(1.05)}
.card .pad{padding:18px 20px 18px;display:flex;flex-direction:column;flex:1}

.label{display:inline-flex;align-items:center;gap:8px;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--c,var(--accent));font-weight:600}
.label .d{width:9px;height:9px;border-radius:3px;background:var(--c,var(--accent))}
.head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}
.when{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--muted);white-space:nowrap;padding-top:2px}
.fresh{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--live);border-radius:6px;padding:3px 7px}
.card h3{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:20px;line-height:1.18;letter-spacing:-.015em;margin:0 0 9px}
.card p{margin:0 0 16px;color:var(--ink-soft);font-size:14.5px;line-height:1.55;flex:1}
.foot{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--hair);padding-top:12px;margin-top:auto}
.foot .by{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--muted)}
.foot .read{font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--accent);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.card:hover .foot .read .arw{transform:translateX(3px)}
.foot .read .arw{transition:transform .16s}

/* destacada */
.card.lead{grid-column:1 / -1;flex-direction:row;align-items:stretch}
.card.lead .thumb{width:48%;aspect-ratio:auto;flex-shrink:0}
.card.lead .pad{padding:34px 38px;justify-content:center}
.card.lead h3{font-size:clamp(26px,3.4vw,40px);line-height:1.08;margin-bottom:13px}
.card.lead p{font-size:16.5px;max-width:60ch}
@media (max-width:640px){
  .card.lead{flex-direction:column}
  .card.lead .thumb{width:auto;aspect-ratio:16/9}
  .card.lead .pad{padding:22px 20px}
  .card.lead h3{font-size:26px}
}

/* tarjeta "featured" ancha: ocupa 2 columnas, horizontal (imagen + texto) */
.card.wide{grid-column:span 2;flex-direction:row;align-items:stretch}
.card.wide .thumb{width:45%;aspect-ratio:auto;flex-shrink:0}
.card.wide .pad{padding:24px 26px;justify-content:center}
.card.wide h3{font-size:23px;line-height:1.14}
.card.wide p{font-size:15px;max-width:48ch}
@media (max-width:980px){
  /* a 2 columnas, la ancha ocupa toda la fila pero sigue horizontal */
  .card.wide{grid-column:1 / -1}
}
@media (max-width:640px){
  .card.wide{grid-column:auto;flex-direction:column}
  .card.wide .thumb{width:auto;aspect-ratio:16/9}
  .card.wide .pad{padding:18px 20px}
  .card.wide h3{font-size:20px}
}

/* anuncios */
.ad-slot{grid-column:1 / -1;display:none;min-height:90px;margin:2px 0}
.ad-slot.live{display:block}
.ad-slot::before{content:"Publicidad";display:block;font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:center;margin-bottom:6px;opacity:.7}
.ad-slot ins{display:block}

/* texto SEO de apoyo */
.intro{border-top:1px solid var(--hair);margin-top:40px;padding:38px 0 4px}
.intro h2{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:26px;letter-spacing:-.01em;margin:0 0 12px}
.intro p{color:var(--ink-soft);font-size:15.5px;max-width:72ch;margin:0 0 14px}

/* ── ARTÍCULO ─────────────────────────────────────────────────────────── */
.article{max-width:var(--maxw);margin:0 auto;padding:0 26px}
.crumbs{font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--muted);padding:30px 0 0}
.crumbs a{color:var(--accent);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.art-head{padding:22px 0 10px}
.art-head .label{margin-bottom:16px}
.article h1{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:clamp(30px,5vw,50px);line-height:1.05;letter-spacing:-.025em;margin:0 0 16px}
.art-meta{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--muted);padding-bottom:22px;border-bottom:1px solid var(--hair)}
.art-meta .author{color:var(--ink);font-weight:500}
.art-hero{margin:26px 0 8px;border-radius:18px;overflow:hidden;background:var(--hair-2);aspect-ratio:21/9;max-height:460px}
.art-hero img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:640px){.art-hero{aspect-ratio:16/9}}
.art-lede{font-size:20px;line-height:1.5;color:var(--ink);font-weight:500;margin:26px 0 6px}
.art-body{font-size:17.5px;line-height:1.75;color:var(--ink-soft)}
.art-body p{margin:0 0 22px}
.art-source{margin:30px 0 8px;padding:18px 20px;border:1px solid var(--hair);border-left:3px solid var(--c,var(--accent));border-radius:10px;background:var(--surface);font-size:14.5px;color:var(--ink-soft)}
.art-source b{color:var(--ink)}
.art-source a{color:var(--accent);text-decoration:none;font-family:"JetBrains Mono",monospace;font-size:13px;display:inline-flex;align-items:center;gap:6px}
.art-source a:hover{text-decoration:underline}
.art-back{display:inline-flex;align-items:center;gap:8px;margin:24px 0 10px;font-family:"JetBrains Mono",monospace;font-size:13px;color:var(--accent);text-decoration:none}
.art-back:hover{text-decoration:underline}

/* layout 2 columnas (usa todo el ancho) */
.art-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:50px;align-items:start;margin-top:28px}
.art-layout.no-aside{display:block;max-width:760px}
.art-main{min-width:0}
.art-main .art-lede{margin-top:0}
.art-aside{position:sticky;top:64px;display:flex;flex-direction:column;gap:20px}
@media (max-width:900px){
  .art-layout{grid-template-columns:1fr;gap:6px}
  .art-aside{position:static;order:2;margin:16px 0 0}
}

/* datos clave */
.facts{border:1px solid var(--hair);border-radius:14px;padding:18px 20px;background:var(--surface)}
.facts h3{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--c,var(--accent));margin:0 0 12px;font-weight:600}
.facts ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.facts li{font-size:14px;color:var(--ink-soft);line-height:1.45;padding-left:17px;position:relative}
.facts li::before{content:"";position:absolute;left:0;top:7px;width:7px;height:7px;border-radius:50%;background:var(--c,var(--accent))}

/* gráfico de barras */
.chart{margin:0;border:1px solid var(--hair);border-radius:14px;padding:18px 20px;background:var(--surface)}
.chart figcaption{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:16px;line-height:1.4}
.ch-row{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin-bottom:13px}
.ch-lab{flex:0 0 100%;font-size:12.5px;color:var(--ink);font-weight:500}
.ch-track{flex:1;min-width:0;background:var(--paper);border:1px solid var(--hair);border-radius:7px;overflow:hidden;height:13px}
.ch-bar{display:block;height:100%;border-radius:7px;min-width:4px}
.ch-val{font-family:"JetBrains Mono",monospace;font-size:11.5px;color:var(--ink-soft);flex:0 0 auto;min-width:42px;text-align:right}
.related{border-top:1px solid var(--hair);margin-top:34px;padding-top:30px}
.related h2{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:18px;margin:0 0 18px;display:inline-flex;align-items:center;gap:10px}
.related h2::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--accent)}
.related .feed{grid-template-columns:repeat(3,1fr)}
@media (max-width:760px){.related .feed{grid-template-columns:1fr}}

/* ── footer (rediseñado) ──────────────────────────────────────────────── */
footer{background:var(--ink);color:#B9BDC7;margin-top:54px;padding:56px 0 30px}
footer .fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px}
@media (max-width:760px){footer .fgrid{grid-template-columns:1fr 1fr}}
@media (max-width:460px){footer .fgrid{grid-template-columns:1fr}}
footer .fbrand .logo{display:flex;align-items:center;gap:11px;font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:30px;letter-spacing:-.03em;color:#fff;margin:0 0 14px}
.flogo-ico{width:32px;height:32px;border-radius:9px;flex-shrink:0}
footer .fbrand .logo .mark{color:#6b8afd}
footer .fbrand p{margin:0;max-width:34ch;font-size:14px;line-height:1.6;color:#9499a4}
footer h4{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#fff;margin:0 0 16px;font-weight:600}
footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
footer ul a{color:#B9BDC7;text-decoration:none;font-size:14px;display:inline-flex;align-items:center;gap:8px;transition:color .15s}
footer ul a:hover{color:#fff}
footer ul a .dot{width:7px;height:7px;border-radius:50%;background:var(--c,#6b8afd)}
footer .fbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;border-top:1px solid #2a2c34;margin-top:44px;padding-top:22px;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.03em;color:#787d88}
footer .fbar a{color:#9aa3b5;text-decoration:none}
footer .fbar a:hover{color:#fff}

/* banner de consentimiento */
.consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:560px;margin:0 auto;background:var(--ink);color:#fff;border-radius:14px;padding:18px 20px;box-shadow:0 18px 50px -20px rgba(0,0,0,.5);font-size:14px;line-height:1.5;display:none;border:1px solid #2a2c34}
.consent.show{display:block}
.consent a{color:#9db0ff}
.consent .row{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.consent button{cursor:pointer;border:0;border-radius:9px;padding:9px 16px;font-family:"JetBrains Mono",monospace;font-size:12px;font-weight:500}
.consent .ok{background:var(--accent);color:#fff}
.consent .no{background:#2c2e36;color:#cfd2da}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .card{opacity:1;transform:none}
  .tk-track{transform:none}
}
