/* Guías v2 · plantilla fija de lectura (guias/*.html) */
.g-progreso{position:fixed;left:0;right:0;top:0;height:2px;z-index:41;pointer-events:none}
.g-progreso i{display:block;height:100%;background:var(--ac2);box-shadow:0 0 10px var(--ac);transform:scaleX(0);transform-origin:left}

/* cabecera */
.g-top h1{max-width:20ch;font-size:clamp(38px,1.4rem + 3vw,72px)}
.g-miga a{color:var(--dim);transition:color .2s}
.g-miga a:hover{color:var(--txt)}
.g-miga a:last-child{color:var(--ac2)}
.g-datos{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.g-datos li{border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:14px;color:var(--dim)}
.g-acc{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}

/* cuerpo: índice a la izquierda, lectura a la derecha */
.g-cuerpo{display:grid;grid-template-columns:220px minmax(0,760px);gap:clamp(40px,6vw,96px);padding:24px var(--m) clamp(80px,8vw,120px);border-top:1px solid var(--line)}
.g-indice{position:sticky;top:96px;align-self:start;padding-top:40px;font-size:15px}
.g-indice p{color:var(--dim);margin-bottom:14px;font-size:14px}
.g-indice ol{list-style:none;counter-reset:ix;display:grid;gap:4px;border-left:1px solid var(--line)}
.g-indice li{counter-increment:ix}
.g-indice a{display:block;padding:6px 0 6px 16px;margin-left:-1px;border-left:1px solid transparent;color:var(--dim);line-height:1.35;transition:color .2s,border-color .2s}
.g-indice a::before{content:counter(ix,decimal-leading-zero) "  ";color:#5d5b57;font-variant-numeric:tabular-nums}
.g-indice a:hover{color:var(--txt)}
.g-indice a.activo{color:var(--txt);border-left-color:var(--ac2)}

.g-art{min-width:0}
.g-art>section{padding-top:40px;scroll-margin-top:90px}
.g-art>section+section{margin-top:40px}
.g-art h2{font-size:clamp(28px,1rem + 1.8vw,42px);margin-bottom:20px}
.g-art h3{font-size:clamp(19px,1.2vw,22px);letter-spacing:-.015em;line-height:1.25;margin:32px 0 10px}
.g-art p{color:#cfcdc7;margin-bottom:16px}
.g-art p b,.g-art p strong,.g-art li strong{color:var(--txt);font-weight:600}
.g-art a:not(.pill){color:var(--ac2);border-bottom:1px solid rgba(143,160,255,.4)}
.g-art a:not(.pill):hover{color:#fff}
.g-art code{font:500 .92em ui-monospace,"Cascadia Mono",Consolas,monospace;background:var(--bg3);border:1px solid var(--line);border-radius:6px;padding:1px 6px;word-break:break-word}

/* pasos numerados */
.g-pasos{list-style:none;counter-reset:paso;margin:24px 0;border-top:1px solid var(--line)}
.g-pasos>li{counter-increment:paso;display:grid;grid-template-columns:56px 1fr;column-gap:8px;padding:22px 0;border-bottom:1px solid var(--line)}
.g-pasos>li::before{content:counter(paso,decimal-leading-zero);grid-row:1 / span 3;font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-size:30px;line-height:1;color:var(--ac2)}
.g-pasos h3{margin:2px 0 6px}
.g-pasos p{margin:0}

/* listas */
.g-lista{list-style:none;display:grid;gap:10px;margin:16px 0 24px}
.g-lista li{position:relative;padding-left:26px;color:#cfcdc7}
.g-lista li::before{content:"";position:absolute;left:4px;top:.72em;width:8px;height:1px;background:var(--ac2)}
.g-check li::before{content:"✓";width:auto;height:auto;background:none;top:0;color:var(--ac2)}

/* avisos */
.g-aviso{margin:24px 0;padding:18px 22px;border-left:2px solid var(--ac2);background:rgba(74,91,255,.07);border-radius:0 10px 10px 0}
.g-aviso>b{display:block;font-weight:600;margin-bottom:6px}
.g-aviso p{margin:0}
.g-ojo{border-left-color:var(--warn);background:rgba(255,176,32,.06)}
.g-ojo>b{color:var(--warn)}
.g-ok{border-left-color:var(--ok);background:rgba(91,214,154,.06)}
.g-ok>b{color:var(--ok)}

/* prompts para copiar */
.g-prompt{margin:22px 0;border:1px solid var(--line);border-radius:var(--r);background:var(--bg2);overflow:hidden}
.g-prompt-h{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 14px 12px 20px;border-bottom:1px solid var(--line);font-size:15px}
.g-prompt-h b{font-weight:500}
.g-copiar{flex:0 0 auto;background:none;color:var(--txt);border:1px solid var(--line);border-radius:999px;padding:7px 14px;font:500 14px "Inter Tight",system-ui;transition:background .2s,color .2s,border-color .2s}
.g-copiar:hover{background:var(--txt);color:var(--bg)}
.g-copiar.ok{background:var(--ok);border-color:var(--ok);color:#0A0A0B}
.g-prompt pre{margin:0;padding:18px 20px;white-space:pre-wrap;word-break:break-word;font:400 16px/1.6 "Inter Tight",system-ui,sans-serif;color:#dedcd6}
.g-uso{padding:12px 20px;border-top:1px solid var(--line);font-size:15px;margin:0!important}

/* comparación así no / así sí */
.g-vs{display:grid;grid-template-columns:1fr 1.4fr;gap:12px;margin:22px 0}
.g-vs>div{border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.g-vs b{display:block;margin-bottom:8px;font-weight:600}
.g-vs p{margin:0}
.g-vs .no b{color:#FF9C8A}
.g-vs .si{border-color:rgba(91,214,154,.4)}
.g-vs .si b{color:var(--ok)}

/* puntos en dos columnas */
.g-puntos{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin:24px 0}
.g-puntos li{background:var(--bg);padding:18px 20px;color:var(--dim);font-size:16px}
.g-puntos li b{display:block;color:var(--txt);font-weight:600;margin-bottom:4px}

/* preguntas y respuestas */
.g-qa{display:grid;gap:12px;margin:22px 0}
.g-qa>div{border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.g-qa .q{color:var(--txt);font-weight:600;margin-bottom:8px}
.g-qa .a{margin:0}

/* tablas */
.g-tabla{overflow-x:auto;margin:22px 0;border:1px solid var(--line);border-radius:var(--r)}
.g-tabla table{width:100%;border-collapse:collapse;font-size:15px;min-width:520px}
.g-tabla th,.g-tabla td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:top}
.g-tabla th{color:var(--dim);font-weight:500}
.g-tabla tr:last-child td{border-bottom:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* cierre fijo */
.g-art>.g-cierre{margin-top:72px;padding:clamp(28px,4vw,48px);border:1px solid rgba(143,160,255,.5);border-radius:var(--r);background:rgba(74,91,255,.08)}
.g-cierre .kicker{margin-bottom:10px}
.g-cierre h2{font-size:clamp(34px,1.2rem + 2.4vw,56px);margin-bottom:14px}
.g-cierre .dim{color:var(--dim)}
.g-cierre .g-acc{margin-top:18px}
.g-volver{margin:24px 0 0!important}

@media (max-width:1000px){
  .g-cuerpo{grid-template-columns:1fr;gap:0}
  .g-indice{position:static;padding-top:28px}
  .g-indice ol{border-left:0;gap:0}
  .g-indice a{padding-left:0;border-left:0}
}
@media (max-width:600px){
  .g-vs,.g-puntos{grid-template-columns:1fr}
  .g-pasos>li{grid-template-columns:44px 1fr}
  .g-pasos>li::before{font-size:26px}
  .g-prompt-h{padding-left:16px}
  .g-prompt pre{padding:16px;font-size:14px}
}
