/* /our-method/ · página de confianza. Solo lo que no existe en plantillas.css: las cinco reglas en
   filas (número, regla, ejemplo), la «hoja» del guion, el bloque de límites y la cita final.
   Solo tokens de tokens.css. */

/* Texto bajo la respuesta de la cabecera. */
.metodo .pag-cabecera__mas { font-size: var(--fs-18); line-height: 1.55; color: var(--arg-text-weak); }

/* ---------- Cinco reglas ---------- */
.metodo-reglas { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; border-top: 2px solid var(--arg-ink); }
.metodo-regla {
	display: grid; grid-template-columns: var(--sp-48) minmax(0, 1fr); column-gap: var(--sp-16); row-gap: var(--sp-16);
	padding-block: var(--sp-32); border-bottom: 1px solid var(--arg-border);
}
.metodo-regla__numero {
	display: grid; place-items: center; width: var(--sp-48); height: var(--sp-48); border-radius: 50%;
	background: var(--arg-lime); color: var(--arg-ink);
	font-family: var(--arg-font-display); font-size: var(--fs-28); font-weight: 700; line-height: 1;
}
.metodo-regla__titulo { font-size: var(--fs-28); line-height: var(--lh-sub); padding-top: var(--sp-8); }
.metodo-regla__texto { margin-top: var(--sp-12); color: var(--arg-text-weak); font-size: var(--fs-18); line-height: 1.55; max-width: var(--measure); }
.metodo-regla__ejemplo {
	grid-column: 2; align-self: start; display: grid; gap: var(--sp-8); margin: 0;
	padding: var(--sp-16) var(--sp-24); border-radius: var(--radius-md);
	background: var(--arg-lime-tint); border-left: var(--sp-4) solid var(--arg-leaf);
}
.metodo-regla__ejemplo .mono-etiqueta { color: var(--arg-link); }
.metodo-regla__frase { font-family: var(--arg-font-display); font-size: var(--fs-20); font-weight: 600; line-height: 1.35; }
@media (min-width: 1024px) {
	.metodo-regla { grid-template-columns: var(--sp-64) minmax(0, 1fr) minmax(0, 360px); column-gap: var(--sp-48); padding-block: var(--sp-48); }
	.metodo-regla__numero { width: var(--sp-64); height: var(--sp-64); font-size: var(--fs-35); }
	.metodo-regla__titulo { font-size: var(--fs-35); padding-top: var(--sp-12); }
	.metodo-regla__ejemplo { grid-column: 3; margin-top: var(--sp-8); }
	.metodo-regla__frase { font-size: var(--fs-28); line-height: var(--lh-sub); }
}

/* Enlace a la biblioteca de protocolos (solo si está publicada). */
.metodo-biblioteca { margin-top: var(--sp-48); max-width: var(--measure); font-size: var(--fs-18); line-height: 1.55; }

/* ---------- La hoja del guion ---------- */
.metodo-guion { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-32); }
.metodo-guion__cabeza { margin-bottom: 0; }
.metodo-guion .metodo-guion__hoja {
	list-style: none; margin: 0; padding: var(--sp-8) var(--sp-24);
	background: var(--arg-surface); border: 1px solid var(--arg-border); border-radius: var(--radius-md);
}
.metodo-guion__parte { display: grid; grid-template-columns: var(--sp-32) minmax(0, 1fr); gap: var(--sp-12); padding-block: var(--sp-16); font-size: var(--fs-18); line-height: 1.55; }
.metodo-guion__parte + .metodo-guion__parte { border-top: 1px dashed var(--arg-neutral-300); }
.metodo-guion__numero { color: var(--arg-text-weak); padding-top: var(--sp-4); }
.metodo-guion__parte strong { font-weight: 600; }
@media (min-width: 1024px) {
	.metodo-guion { grid-template-columns: minmax(0, 480fr) minmax(0, 704fr); column-gap: var(--sp-64); align-items: start; }
	.metodo-guion .metodo-guion__hoja { padding: var(--sp-16) var(--sp-32); }
}

/* ---------- Límites y control ---------- */
.metodo-limites { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-24); align-items: start; }
.metodo-limites__icono { color: var(--arg-ink); }
.metodo-limites__copia h2 { margin-bottom: var(--sp-16); }
.metodo-limites__copia p { font-size: var(--fs-20); line-height: 1.5; max-width: 60ch; color: var(--arg-on-dark); }
@media (min-width: 1024px) {
	.metodo-limites { grid-template-columns: auto minmax(0, 1fr); column-gap: var(--sp-48); }
}

/* ---------- Por qué IA: texto y cita ---------- */
.metodo-porque { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-32); }
.metodo-porque__copia h2 { margin-bottom: var(--sp-16); }
.metodo-porque__copia p { font-size: var(--fs-18); line-height: 1.55; color: var(--arg-text-weak); max-width: var(--measure); }
.metodo-porque__cita {
	margin: 0; padding-left: var(--sp-24); border-left: var(--sp-4) solid var(--arg-lime);
	font-family: var(--arg-font-display); font-size: var(--fs-28); font-weight: 600; line-height: var(--lh-sub); letter-spacing: var(--ls-heading);
}
@media (min-width: 1024px) {
	.metodo-porque { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--sp-64); align-items: center; }
	.metodo-porque__cita { font-size: var(--fs-35); padding-left: var(--sp-32); }
}