/* Páginas de contenido */
.pagina-cab { display: grid; gap: 18px; max-width: 70ch; }
.pagina-cab h1 { font-size: clamp(40px, 5vw, 76px); line-height: 1; letter-spacing: -.02em; }
.seccion:first-of-type.grupo { margin-top: 70px; }
.grupo .seccion__titulo { margin-bottom: 30px; }
h3 { font-size: clamp(24px, 2.2vw, 30px); color: var(--oro); line-height: 1.1; }

.bloque { display: grid; gap: 22px; align-content: start; }
.bloque figure { margin: 0; }
.bloque > div { display: grid; gap: 14px; align-content: start; }
.bloque p { max-width: 62ch; }
.bloque--ancho, .bloque--inv, .bloque:not(.pareja .bloque):not(.bloque--prof) {
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: center; gap: clamp(24px, 3.5vw, 56px);
}
.bloque--inv > figure { order: 2; }
.bloque.bloque--inv { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); }
.grupo > .bloque + .bloque { margin-top: clamp(56px, 6vw, 90px); }
.pareja { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 3.5vw, 56px); margin-top: clamp(56px, 6vw, 90px); }
.grupo > .pareja:first-of-type:nth-child(2) { margin-top: 0; }
.puntos { margin: 0; padding-left: 1.1em; display: grid; gap: 8px; color: var(--texto); }
.puntos li::marker { color: var(--oro); }

.bloque--prof { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); grid-template-rows: auto auto; gap: 28px clamp(24px, 3.5vw, 56px); }
.prof__grande { grid-column: 1; grid-row: 1 / span 2; align-self: start; }
.prof__flotante { grid-column: 2; grid-row: 1; max-width: 380px; align-self: start; }
.bloque--prof > div { grid-column: 2; grid-row: 2; }

.cierre { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 22px; padding: 30px 40px; }
.cierre h2 { font-size: clamp(30px, 3vw, 44px); color: var(--oro); }

/* Novedades */
.versiones { display: grid; gap: clamp(48px, 5vw, 72px); margin-top: 60px; }
.version { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 12px 40px; }
.version h2 { font-size: 34px; color: var(--oro); }
.version .aviso-trad { grid-column: 2; color: var(--texto-2); font-size: 16px; }
.version ul { grid-column: 2; margin: 0; padding-left: 1.1em; display: grid; gap: 12px; max-width: 75ch; }
.version li::marker { color: var(--oro); }
.version ul ul { margin-top: 8px; gap: 8px; }
.version--ultima { padding: 26px 34px; grid-template-columns: 136px minmax(0, 1fr); }
.version--ultima h2 { color: #1d1206; }
.version--ultima ul, .version--ultima li { color: var(--tinta-pergamino); }
.version--ultima li::marker { color: #6b4a12; }
.etiqueta-ultima { font: 700 17px/1.2 var(--display); color: #6b4a12; }

.anteriores { padding: 14px 22px; }
.anteriores summary { cursor: pointer; font: 700 24px/1.2 var(--display); color: var(--oro); }
.anteriores .versiones { margin-top: 40px; }

/* Comandos */
.buscador { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 44px 0 30px; }
.buscador label { font: 700 20px/1 var(--display); color: var(--oro); }
.buscador input {
  flex: 1 1 280px; min-height: 52px; padding: 0 16px; font: 400 19px var(--texto-fam); color: var(--texto); background: #07080d;
  border-style: solid; border-width: 8px 12px; border-image: url("/assets/img/tex/k_tile2.png") 18 28 fill / 8px 12px stretch;
}
.cmds { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.cmds li { display: grid; grid-template-columns: minmax(220px, 34%) minmax(0, 1fr); gap: 6px 26px; align-items: baseline; }
.cmds code { font: 700 19px/1.3 var(--display); color: var(--oro); background: none; overflow-wrap: anywhere; }
.cmds p { color: var(--texto); }
.cmds__vacio { color: var(--texto-2); }

/* Instalación */
.pasos { margin: 0; padding-left: 1.4em; display: grid; gap: 12px; max-width: 70ch; }
.pasos li::marker { color: var(--oro); font-weight: 700; font-family: var(--display); }
.dos-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 4vw, 64px); }
.dos-col > div { display: grid; gap: 18px; align-content: start; }
.faq { display: grid; gap: 12px; max-width: 80ch; }
.faq details { padding: 6px 10px; }
.faq summary { cursor: pointer; font: 700 20px/1.3 var(--display); color: var(--texto); list-style-position: outside; }
.faq summary:hover { color: var(--oro); }
.faq details[open] summary { color: var(--oro); }
.faq details > div { margin-top: 10px; display: grid; gap: 10px; }
code { font: 600 .95em var(--texto-fam); color: var(--oro-palido); background: #07080d; padding: 0 3px; }
.creditos { display: grid; gap: 10px; max-width: 80ch; color: var(--texto); }
.creditos pre { white-space: pre-wrap; font: 400 15px/1.5 var(--texto-fam); color: var(--texto-2); margin: 10px 0 0; }

@media (max-width: 960px) {
  .bloque--ancho, .bloque--inv, .bloque:not(.pareja .bloque):not(.bloque--prof), .pareja, .bloque--prof, .dos-col { grid-template-columns: 1fr; }
  .bloque--inv > figure { order: 0; }
  .prof__grande, .prof__flotante, .bloque--prof > div { grid-column: 1; grid-row: auto; }
  .version, .version--ultima { grid-template-columns: 1fr; }
  .version .aviso-trad, .version ul { grid-column: 1; }
  .cmds li { grid-template-columns: 1fr; }
  .cierre { padding: 24px 22px; }
}
