/* AIGOS · página «Conecta AIGOS a tu IA». Mismo lenguaje que aigos.css (Brand Book AIGOS-BB-2026-0002). */

.display-medio { font-size: 32px; }
@media (min-width: 640px) { .display-medio { font-size: 40px; } }
@media (min-width: 1024px) { .display-medio { font-size: 56px; } }

/* héroe: título a la izquierda, la dirección del servidor como documento a la derecha */
.heroe-conector { padding-bottom: var(--e8); }
.heroe-conector-in { display: grid; gap: var(--e6); align-items: start; padding-top: var(--e5); }
.heroe-conector .heroe-texto { gap: var(--e4); grid-area: auto; }
.heroe-conector .url-mcp { grid-area: auto; }
@media (min-width: 1024px) {
  .heroe-conector-in { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--e8); padding-top: var(--e7); }
}
.url-mcp { display: grid; gap: var(--e4); animation: pagina 600ms var(--curva-llegar) 120ms both; }
.url-mcp pre { margin: 0; padding: var(--e4); border-radius: var(--radio-control); background: var(--mesa); font: 400 13px/1.6 var(--f-mono); white-space: pre-wrap; overflow-wrap: anywhere; user-select: all; }
.url-acciones { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e3); }

/* tramos: título a la izquierda, texto a la derecha, separados por el rayado */
.tramo { padding-bottom: var(--e8); }
.tramo-grid { display: grid; gap: var(--e5); }
.tramo-tit { max-width: 18ch; }
@media (min-width: 1024px) {
  .tramo-grid { grid-template-columns: 4fr 8fr; gap: var(--e8); }
  .tramo { padding-bottom: var(--e9); }
}
.roles { display: grid; gap: var(--e5); max-width: 760px; }
.roles > div { display: grid; gap: var(--e1); padding-top: var(--e4); border-top: 1px solid var(--arena); }
.roles dt { font: 500 19px/1.3 var(--f-texto); }
.roles dd { color: var(--tinta-2); max-width: 56ch; }
@media (min-width: 640px) { .roles > div { grid-template-columns: 200px 1fr; gap: var(--e5); } }
.seguro { list-style: none; display: grid; gap: 0; max-width: 760px; border-bottom: 1px solid var(--arena); }
.seguro li { padding: var(--e4) 0; border-top: 1px solid var(--arena); max-width: 68ch; text-wrap: pretty; }
.seguro strong { font-weight: 500; }
.dichos { list-style: none; display: grid; gap: 0; max-width: 760px; border-bottom: 1px solid var(--arena); }
.dichos li { padding: var(--e3) 0; border-top: 1px solid var(--arena); font: 500 19px/1.4 var(--f-texto); }

/* pasos por IA: sobre papel, con pestañas cuyo subrayado toca la regla inferior */
.pasos { padding: var(--e8) 0; background: var(--papel); }
@media (min-width: 1024px) { .pasos { padding: var(--e9) 0; } }
.pasos-cab { display: grid; gap: var(--e3); align-content: start; }
.pasos-entrada { max-width: 46ch; color: var(--tinta-2); }
.pasos-entrada strong { color: var(--tinta); font-weight: 500; }
.pasos-cuerpo { min-width: 0; }
.pestanas { display: flex; gap: var(--e5); margin-bottom: var(--e5); overflow-x: auto; border-bottom: 1px solid var(--arena); scrollbar-width: thin; }
.pestanas a { flex: none; display: inline-flex; align-items: center; min-height: 44px; margin-bottom: -1px; color: var(--tinta-2); text-decoration: none; font: 500 15px/1 var(--f-texto); border-bottom: 2px solid transparent; transition: color var(--t-respuesta), border-color var(--t-respuesta); }
.pestanas a:hover { color: var(--tinta); }
.pestanas a[aria-current="true"] { color: var(--tinta); border-bottom-color: var(--bosque); }

.ia-bloque { border-bottom: 1px solid var(--arena); }
.ia-bloque > summary { display: flex; align-items: baseline; gap: var(--e3); min-height: 56px; padding: var(--e4) 0; list-style: none; cursor: pointer; font: 500 24px/1.2 var(--f-display); }
.ia-bloque > summary::-webkit-details-marker { display: none; }
.ia-bloque > summary::after { content: ""; width: 8px; height: 8px; margin: 0 0 3px auto; border-right: 1.5px solid var(--tinta-2); border-bottom: 1.5px solid var(--tinta-2); transform: rotate(-45deg); transition: transform var(--t-local) var(--curva-llegar); align-self: center; }
.ia-bloque[open] > summary::after { transform: rotate(45deg); }
.ia-bloque > :not(summary) { max-width: 68ch; }
.ia-bloque[open] { padding-bottom: var(--e5); }
.ia-bloque p { margin-top: var(--e3); text-wrap: pretty; }
.cond { font: 500 12px/1.4 var(--f-texto); letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-2); }
.pasos-lista { list-style: none; counter-reset: p; display: grid; gap: var(--e3); margin-top: var(--e4); }
.pasos-lista li { position: relative; padding-left: var(--e7); counter-increment: p; text-wrap: pretty; }
.pasos-lista li::before { content: counter(p, decimal-leading-zero); position: absolute; left: 0; top: 2px; font: 400 13px/1.6 var(--f-mono); color: var(--tinta-2); }
.nota { color: var(--tinta-2); font-size: 14px; }
.drive { padding-left: var(--e4); border-left: 2px solid var(--arena); color: var(--tinta-2); font-size: 14px; }
.drive strong { color: var(--tinta); font-weight: 500; }
.h-editor { margin-top: var(--e6); font: 500 19px/1.3 var(--f-texto); }
.sub-ia { margin-top: var(--e5); padding-top: var(--e2); border-top: 1px solid var(--arena-suave); }
.ia-bloque strong { font-weight: 500; }
code { font: 400 13px/1.4 var(--f-mono); padding: 1px 6px; border-radius: 4px; background: var(--arena-suave); overflow-wrap: anywhere; }
.drive-cierre { margin-top: var(--e7); max-width: 68ch; display: grid; gap: var(--e3); }
.pendiente { color: var(--advertencia); font-weight: 500; }

/* mensajes para copiar: documento con folio */
.ficha { margin-top: var(--e4); padding: var(--e4); background: var(--papel); border-radius: var(--radio-papel); box-shadow: var(--sombra-1); max-width: 68ch; }
.ficha .tit { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--e3); padding-bottom: var(--e3); }
.ficha pre { margin: 0; padding: var(--e4); border-radius: var(--radio-control); background: var(--mesa); font: 400 13px/1.6 var(--f-mono); white-space: pre-wrap; overflow-wrap: anywhere; }
.h-sub { margin: var(--e5) 0 var(--e3); }
.tramo .cuerpo > p + .ficha, .tramo .cuerpo > .ficha + p { margin-top: var(--e4); }
.tramo:last-child { padding-bottom: var(--e8); }