/* ============ Guías y Novedades (build/guias.mjs) ============ */

/* ---- índice: buscador, filtros y tarjetas ---- */
.gx{padding:clamp(40px,5vw,72px) 0 0}
.gx__bar{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-bottom:22px}
.gx__bar[hidden]{display:none}
.gx__search{flex:1 1 320px;max-width:520px}
.gx__search input{
  width:100%;min-height:48px;padding:0 16px;border-radius:10px;
  border:1px solid var(--hair2);background:var(--surf);color:var(--ink);
  font:400 16px/1.2 var(--sans);transition:border-color .25s
}
.gx__search input::placeholder{color:var(--mut2)}
.gx__search input:focus{outline:none;border-color:var(--acc)}
.gx__cats{display:flex;flex-wrap:wrap;gap:8px}
.gx__cats button{
  min-height:40px;padding:0 14px;border-radius:999px;cursor:pointer;
  border:1px solid var(--hair2);background:transparent;color:var(--mut);
  font:500 11.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;transition:color .2s,border-color .2s,background .2s
}
.gx__cats button:hover{color:var(--ink);border-color:var(--mut2)}
.gx__cats button[aria-pressed="true"]{background:var(--acc);border-color:var(--acc);color:#0B0C0D}
.gx__cats button:focus-visible,.gx__i a:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.gx__count{font:400 11.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut2);margin-bottom:16px}
.gx__list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:1px;background:var(--hair);border:1px solid var(--hair);border-radius:16px;overflow:hidden}
.gx__i{background:var(--bg);display:flex}
.gx__i[hidden]{display:none}
.gx__i a{display:flex;flex-direction:column;gap:14px;width:100%;padding:28px 28px 32px;transition:background .3s}
.gx__i a:hover{background:#121316}
.gx__i h2,.gx__i h3{font-size:clamp(21px,1.8vw,25px);letter-spacing:-.025em;line-height:1.18;max-width:28ch}
.gx__i a:hover h2,.gx__i a:hover h3{color:var(--acc)}
.gx__i p{font-size:15.5px;line-height:1.6;color:var(--mut);max-width:56ch}
.gx__meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font:400 11px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut2)}
.gx__cat{color:var(--acc)}
.gx__draft{font-style:normal;color:#0B0C0D;background:var(--acc);padding:3px 7px;border-radius:4px}
.gx__none{padding:28px 0;color:var(--mut)}
.gx__rss{margin-top:22px;font:400 11.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.gx__rss a{color:var(--mut2);transition:color .25s}
.gx__rss a:hover{color:var(--acc)}
.gx-news__l{margin:22px 0 26px;border-top:1px solid var(--hair)}
.gx-news__l a{display:grid;grid-template-columns:200px minmax(0,1fr) auto;gap:18px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--hair);font-size:18px;letter-spacing:-.015em;transition:padding-left .4s var(--e)}
.gx-news__l a:hover{padding-left:12px}
.gx-news__l time{font:400 11.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut2)}
.gx-news__l i{font-style:normal;color:var(--acc)}

/* ---- artículo ---- */
.art__head{margin-bottom:clamp(40px,5vw,72px)}
.art__h1{max-width:22ch;font-size:clamp(34px,4.6vw,64px)}
.art__lede{max-width:58ch}
.doc__kicker a{color:inherit;transition:color .25s}
.doc__kicker a:hover{color:var(--ink)}
.art__meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:26px;font:400 11.5px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut2)}
.art__meta time{color:var(--mut)}
.art__grid{display:grid;grid-template-columns:minmax(0,250px) minmax(0,720px);gap:clamp(40px,6vw,96px);align-items:start;padding-bottom:clamp(56px,6vw,96px)}
.art__toc{position:sticky;top:110px;border-top:1px solid var(--hair);padding-top:20px}
.art__toc summary{cursor:pointer;list-style:none;color:var(--mut2)}
.art__toc summary::-webkit-details-marker{display:none}
.art__toc ol{margin-top:16px;display:flex;flex-direction:column;gap:2px;counter-reset:toc}
.art__toc li{counter-increment:toc}
.art__toc a{display:grid;grid-template-columns:26px 1fr;padding:6px 0;font-size:14px;line-height:1.4;color:var(--mut);transition:color .2s}
.art__toc a::before{content:counter(toc,decimal-leading-zero);font:400 10.5px/1.9 var(--mono);color:var(--mut2)}
.art__toc a:hover{color:var(--ink)}
/* aviso fijo al final de cada guía (plantilla, no Markdown) */
.art__disc{margin-top:48px;padding:18px 22px;border:1px solid var(--hair2);border-radius:12px;background:var(--surf)}
.art__disc .mono-lbl{color:var(--mut2);margin-bottom:10px}
.art__disc p{font-size:14.5px;line-height:1.6;color:var(--mut);max-width:none;margin:0}
.art__disc + .art__tags{margin-top:28px}
.art__tags{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:48px;padding-top:24px;border-top:1px solid var(--hair)}
.art__tags .mono-lbl{margin-right:8px;color:var(--mut2)}
.art__tag{font:400 12px/1 var(--mono);padding:7px 10px;border:1px solid var(--hair2);border-radius:999px;color:var(--mut)}
.art__pn{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hair);border:1px solid var(--hair);border-radius:16px;overflow:hidden;padding:0;margin-bottom:clamp(40px,5vw,72px)}
.art__pn > *{background:var(--bg)}
.art__pn a{display:flex;flex-direction:column;gap:12px;padding:26px 28px;font-size:18px;letter-spacing:-.015em;line-height:1.3;transition:background .3s}
.art__pn a:hover{background:#121316}
.art__nx{text-align:right;align-items:flex-end}
.art__rel{border-top:1px solid var(--hair)}
.gx__list--rel{margin:24px 0 30px}

/* ---- tipografía de lectura ---- */
.prose{font-size:clamp(17px,1.15vw,18.5px);line-height:1.72;color:rgba(243,241,236,.86)}
.prose > * + *{margin-top:1.1em}
.prose h2{font-size:clamp(25px,2.2vw,32px);letter-spacing:-.025em;line-height:1.15;color:var(--ink);margin-top:2.2em;scroll-margin-top:110px}
.prose h3{font-size:clamp(20px,1.6vw,23px);letter-spacing:-.02em;line-height:1.25;color:var(--ink);margin-top:1.8em;scroll-margin-top:110px}
.prose h2 + *,.prose h3 + *{margin-top:.7em}
.prose > h2:first-child{margin-top:0}
.prose strong{color:var(--ink);font-weight:600}
.prose em{font-style:italic}
.prose a{color:var(--ink);text-decoration:underline;text-decoration-color:rgba(255,74,0,.6);text-decoration-thickness:1px;text-underline-offset:.22em;transition:color .25s,text-decoration-color .25s}
.prose a:hover{color:var(--acc);text-decoration-color:var(--acc)}
.prose ul,.prose ol{padding-left:1.3em;display:flex;flex-direction:column;gap:.5em}
.prose ul{list-style:none}
.prose ul li{position:relative}
.prose ul li::before{content:"";position:absolute;left:-1.05em;top:.72em;width:6px;height:6px;background:var(--acc)}
.prose ol{list-style:decimal}
.prose ol li::marker{color:var(--acc);font-family:var(--mono);font-size:.85em}
.prose .note{border-left:2px solid var(--acc);background:var(--surf);padding:18px 22px;border-radius:0 12px 12px 0}
.prose .note p + p{margin-top:.7em}
.prose .tbl{overflow-x:auto;border:1px solid var(--hair);border-radius:12px}
.prose table{width:100%;border-collapse:collapse;font-size:.88em;line-height:1.5}
.prose th,.prose td{text-align:left;vertical-align:top;padding:12px 16px;border-bottom:1px solid var(--hair)}
.prose th{font:500 11px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut2);background:var(--surf)}
.prose tr:last-child td{border-bottom:0}

/* ---- novedades ---- */
.nv{margin-top:clamp(48px,6vw,88px);border-top:1px solid var(--hair)}
.nv__i{display:grid;grid-template-columns:minmax(0,220px) minmax(0,720px);gap:clamp(20px,5vw,80px);padding:34px 0 40px;border-bottom:1px solid var(--hair);scroll-margin-top:110px}
.nv__d{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font:400 11.5px/1.6 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut2)}
.nv__b h2{font-size:clamp(22px,2vw,28px);letter-spacing:-.025em;line-height:1.2;margin-bottom:14px}
.nv__b .prose{font-size:17px}
.nv__more{padding:34px var(--pad) clamp(56px,6vw,88px)}

/* ---- vista previa de borradores (nunca se publica) ---- */
.draftbar{position:fixed;left:0;right:0;bottom:0;z-index:95;margin:0;padding:10px 16px;text-align:center;background:var(--acc);color:#0B0C0D;font:500 12px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase}

@media (max-width:960px){
  .art__grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .art__toc{position:static;border:1px solid var(--hair);border-radius:12px;padding:16px 18px}
  .art__toc summary::after{content:" +";color:var(--acc)}
  .art__toc[open] summary::after{content:" –"}
  .nv__i{grid-template-columns:minmax(0,1fr);gap:12px}
  .gx-news__l a{grid-template-columns:minmax(0,1fr) auto;gap:6px 14px}
  .gx-news__l time{grid-column:1/-1}
}
@media (max-width:720px){
  .art__pn{grid-template-columns:1fr}
  .art__nx{text-align:left;align-items:flex-start}
  .gx__i a{padding:24px 20px 26px}
  .prose{font-size:17px;line-height:1.7}
}