/* La Academia - página (hub+radios). Método (el árbol de análisis ES el esqueleto) + estrategia + iniciación (acaba en Pack).
   Reutiliza tokens/base/variant-comunidad. Solo añade lo propio de esta página. */

/* --- Hero = El Método: la tesis del método es la portada de la página --- */
.metodo__hero { display: grid; gap: var(--space-4); align-items: center; }
.metodo__hero .display { font-size: clamp(2.6rem, 1.4rem + 4.2vw, 4rem); line-height: 0.98; }
.metodo__hero .display .mark { background: linear-gradient(transparent 68%, var(--green-light) 68% 90%, transparent 90%); padding-inline: 0.04em; }
.metodo__hero .display .dot { color: var(--accent); }
.escena { display: grid; gap: var(--space-2); margin: var(--space-3) 0 var(--space-4); max-width: 46ch; }
.escena p { font-size: var(--fs-lg); color: var(--ink-soft); }
.escena .g { color: var(--accent-ink); font-weight: 600; }
.metodo__cta { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.metodo__foto { margin: 0; border: var(--rule) solid var(--ink); box-shadow: var(--shadow-hard); overflow: hidden; aspect-ratio: 4 / 3; background: var(--gray-200); }
.metodo__foto img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* --- Voz maestra (cita unificada: retrato + frase; puntúa el paso entre secciones) --- */
.voz-band { background: var(--bg); border-bottom: var(--rule) solid var(--ink); padding-block: var(--space-5); }
.voz { display: grid; grid-template-columns: auto 1fr; gap: var(--space-4); align-items: center; }
.voz__foto { margin: 0; width: 96px; height: 120px; border: var(--rule) solid var(--ink); box-shadow: 4px 4px 0 rgba(0,0,0,.18); background: var(--gray-200); transform: rotate(-2.5deg); flex: none; overflow: hidden; }
.voz__foto img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; filter: grayscale(1) contrast(1.04); }
/* blockquote nativo (core/quote): sin borde/padding/margen por defecto de wp-block-quote */
.voz__cita { margin: 0; padding: 0; border: 0; }
.voz__cita p { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.2rem, 0.95rem + 1.3vw, 1.7rem); line-height: 1.22; letter-spacing: -0.01em; max-width: 34ch; }
.voz__cita cite { display: block; margin-top: var(--space-2); font-family: var(--font-mono); font-size: 0.74rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--gray-700); font-style: normal; }
.voz__cita cite b { color: var(--accent-ink); }
/* variante sobre fondo oscuro (Estrategia) */
.voz--dark .voz__cita p { color: #fff; }
.voz--dark .voz__cita cite { color: var(--on-dark-soft); }
.voz--dark .voz__cita cite b { color: var(--green-light); }
.voz--dark .voz__foto { border-color: #fff; box-shadow: 4px 4px 0 rgba(255,255,255,.16); }

/* --- EL MÉTODO: hero (la tesis del método) + las 3 partes de la partida como desplegables --- */
.metodo { background: var(--bg-alt); border-bottom: var(--rule) solid var(--ink); padding-block: var(--space-5) var(--space-6); }
/* Tira de tablero (motivo cuadrados): divisor entre el hero y el desarrollo */
/* checker: decoración (banda ajedrezada) como pseudo-elemento, fuera del contenido pero visible en editor */
.has-checker::before { content: ""; display: block; margin-top: var(--space-6); height: 16px; width: 192px; max-width: 100%; border: 2px solid var(--ink); background: repeating-linear-gradient(90deg, var(--ink) 0 16px, var(--accent) 16px 32px); }
.metodo__intro-line { margin-top: var(--space-3); font-size: var(--fs-lg); color: var(--ink-soft); max-width: 60ch; }
.metodo__intro-line .g { color: var(--accent-ink); font-weight: 600; }

/* Las 3 partes de la partida, como desplegables */
.partes { margin-top: var(--space-5); }
.parte { border: var(--rule) solid var(--ink); background: var(--paper); box-shadow: var(--shadow-hard); }
.parte + .parte { margin-top: var(--space-4); }
.parte > summary { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3); cursor: pointer; list-style: none; }
.parte > summary::-webkit-details-marker { display: none; }
.parte > summary:focus-visible { outline: 3px solid var(--spark); outline-offset: -3px; }
.parte__n { flex: none; width: 3.4rem; height: 3.4rem; display: grid; place-items: center; background: var(--accent); color: #fff; font-family: var(--font-display); font-weight: 800; font-size: 1.5rem; line-height: 1; border: var(--rule) solid var(--ink); box-shadow: var(--shadow-hard-sm); }
.parte__id { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; }
.parte__k { font-family: var(--font-mono); font-size: 0.8rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent-ink); }
.parte__q { font-family: var(--font-display); font-weight: 800; font-size: var(--fs-h3); line-height: 1.04; letter-spacing: var(--tracking-tight); }
.parte__toggle { flex: none; width: 1.7rem; height: 1.7rem; position: relative; border: var(--rule) solid var(--ink); background: var(--bg-alt); }
.parte__toggle::before, .parte__toggle::after { content: ""; position: absolute; background: var(--ink); }
.parte__toggle::before { left: 22%; right: 22%; top: calc(50% - 1.5px); height: 3px; }
.parte__toggle::after { top: 22%; bottom: 22%; left: calc(50% - 1.5px); width: 3px; }
.parte[open] .parte__toggle::after { display: none; }
.parte[open] .parte__n { background: var(--accent-ink); }
.parte__body { padding: var(--space-4) var(--space-3); border-top: var(--rule) solid var(--ink); }

/* Dentro de cada parte: intro + lista de herramientas con viñeta cuadrada (motivo tablero); el cuadrado se centra con la etiqueta */
.parte__intro { font-size: var(--fs-base); color: var(--ink-soft); max-width: 58ch; margin-bottom: var(--space-4); }
.tools { display: grid; gap: var(--space-3); list-style: none; max-width: 62ch; }
.tool__head { display: flex; align-items: center; gap: 0.7rem; }
.tool__sq { flex: none; width: 0.95rem; height: 0.95rem; border: 2.5px solid var(--accent); background: var(--paper); }
.tool__name { font-family: var(--font-mono); font-size: 0.82rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--accent-ink); }
.tool__d { margin-top: 0.3rem; padding-left: calc(0.95rem + 0.7rem); font-size: var(--fs-base); color: var(--ink-soft); }

/* Coda: cómo va una clase (el reparto en el tiempo, subordinado al método) */
.metodo__coda { margin-top: var(--space-5); font-size: var(--fs-base); color: var(--ink-soft); max-width: 60ch; border-top: var(--rule) solid var(--ink); padding-top: var(--space-3); }
.metodo__coda b { color: var(--accent-ink); font-family: var(--font-mono); font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; }

/* --- Elige tu puerta: bifurcación de adulto (dos puertas a igual peso, enrutan a Iniciación / Estrategia) --- */
.eligepuerta { background: var(--bg); border-bottom: var(--rule) solid var(--ink); }
.ep__head { max-width: 54ch; }
.ep__lead { margin-top: var(--space-2); font-size: var(--fs-lg); color: var(--ink-soft); }
.ep__doors { display: grid; gap: var(--space-4); margin-top: var(--space-5); }
/* Puerta apaisada: pieza (silueta enmascarada, estilo puertas de la home) a la izquierda + texto a la derecha */
.door2 { display: grid; grid-template-columns: auto 1fr; align-items: stretch; border: var(--rule) solid var(--ink); background: var(--paper); box-shadow: var(--shadow-hard); transition: transform .12s ease, box-shadow .12s ease; }
.door2:hover { transform: translate(-4px,-4px); box-shadow: var(--shadow-hard-lg); }
.door2:focus-visible { outline: 3px solid var(--spark); outline-offset: 4px; }
/* columna-icono de la puerta (verde + pieza) como pseudo, fuera del contenido pero visible en editor */
.door2::before { content: ""; box-sizing: content-box; width: 54px; padding: var(--space-3); border-right: var(--rule) solid var(--ink); background-color: var(--green-tint); background-repeat: no-repeat; background-position: center; background-size: 54px auto; }
.door2--pawn::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23007a00' d='M215.5 224c29.2-18.4 48.5-50.9 48.5-88c0-57.4-46.6-104-104-104S56 78.6 56 136c0 37.1 19.4 69.6 48.5 88L96 224c-17.7 0-32 14.3-32 32c0 16.5 12.5 30 28.5 31.8L80 400l160 0L227.5 287.8c16-1.8 28.5-15.3 28.5-31.8c0-17.7-14.3-32-32-32l-8.5 0zM22.6 473.4c-4.2 4.2-6.6 10-6.6 16C16 501.9 26.1 512 38.6 512l242.7 0c12.5 0 22.6-10.1 22.6-22.6c0-6-2.4-11.8-6.6-16L256 432 64 432 22.6 473.4z'/%3E%3C/svg%3E"); }
.door2--bishop::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23007a00' d='M128 0C110.3 0 96 14.3 96 32c0 16.1 11.9 29.4 27.4 31.7C78.4 106.8 8 190 8 288c0 47.4 30.8 72.3 56 84.7L64 400l192 0 0-27.3c25.2-12.5 56-37.4 56-84.7c0-37.3-10.2-72.4-25.3-104.1l-99.4 99.4c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6L270.8 154.6c-23.2-38.1-51.8-69.5-74.2-90.9C212.1 61.4 224 48.1 224 32c0-17.7-14.3-32-32-32L128 0zM48 432L6.6 473.4c-4.2 4.2-6.6 10-6.6 16C0 501.9 10.1 512 22.6 512l274.7 0c12.5 0 22.6-10.1 22.6-22.6c0-6-2.4-11.8-6.6-16L272 432 48 432z'/%3E%3C/svg%3E"); }
.door2__body { padding: var(--space-4); }
.door2__k { display: block; font-family: var(--font-mono); font-size: 0.76rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent-ink); }
.door2__t { font-size: var(--fs-h3); margin-top: 0.15rem; }
.door2__d { margin-top: var(--space-2); font-size: var(--fs-base); color: var(--ink-soft); }
.door2__cta { display: inline-flex; align-items: center; gap: 0.4em; margin-top: var(--space-3); font-family: var(--font-mono); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink); border-bottom: 3px solid var(--accent); padding-bottom: 2px; }
.door2:hover .door2__cta { color: var(--accent-ink); }

/* Puntero al Club desde Estrategia (alto nivel = el radio de El Club) */
.estrategia__club { margin-top: var(--space-4); font-size: var(--fs-base); color: var(--on-dark-soft); }
.estrategia__club a { color: var(--green-light); border-bottom: 2px solid var(--green-light); padding-bottom: 1px; }
.estrategia__club a:hover { color: #fff; }

/* --- Caminos: Curso de Estrategia e Iniciación --- */
.camino__intro { max-width: 60ch; margin-top: var(--space-2); font-size: var(--fs-lg); color: var(--ink-soft); }

/* Curso de estrategia: los 4 bloques como temario mecanografiado */
.estrategia { background: var(--ink); color: #fff; border-block: var(--rule-thick) solid var(--ink); }
.estrategia .eyebrow { color: var(--green-light); }
.estrategia .eyebrow::before { background: var(--green-light); }
.estrategia h2 { color: #fff; }
.estrategia .camino__intro { color: var(--on-dark-soft); }
.estrategia .voz { margin: var(--space-4) 0; }
/* El temario: "52 temas" arriba como cifra + recorrido de paneles con filo y el rango en sello verde (presencia sobre el fondo oscuro) */
.temario__head { margin-top: var(--space-5); display: flex; align-items: baseline; gap: 0.25em; }
.temario__n { font-family: var(--font-display); font-weight: 800; font-size: clamp(3rem, 2rem + 4vw, 5rem); line-height: 0.8; letter-spacing: -0.03em; color: var(--green-light); }
.temario__lbl { font-family: var(--font-display); font-weight: 800; font-size: clamp(1.6rem, 1.1rem + 1.6vw, 2.4rem); letter-spacing: -0.02em; color: #fff; }
.temario { margin-top: var(--space-4); list-style: none; border-top: var(--rule) solid var(--line-dark); }
.etapa { display: grid; grid-template-columns: auto 1fr; gap: var(--space-3); align-items: start; padding: var(--space-4) 0; border-bottom: var(--rule) solid var(--line-dark); }
/* Fragmento de tablero (motivo tablón) a la izquierda: 2x2 verde/tinta con filo verde */
/* tablero de etapa: decoración como pseudo (primer item del grid .etapa), fuera del contenido pero visible en editor */
.etapa::before { content: ""; width: 52px; height: 52px; margin-top: 0.3rem; background-repeat: no-repeat; background-size: 30% 30%; background-image: linear-gradient(var(--green) 0 0), linear-gradient(#fff 0 0), linear-gradient(var(--green) 0 0), linear-gradient(#fff 0 0), linear-gradient(var(--green) 0 0), linear-gradient(#fff 0 0), linear-gradient(var(--green) 0 0), linear-gradient(#fff 0 0), linear-gradient(var(--green) 0 0); background-position: 0% 0%, 50% 0%, 100% 0%, 0% 50%, 50% 50%, 100% 50%, 0% 100%, 50% 100%, 100% 100%; }
.etapa__rng { display: block; font-family: var(--font-mono); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--green-light); margin-bottom: 0.5rem; }
.etapa__t { color: #fff; font-size: var(--fs-h3); margin-bottom: 0.4rem; }
.etapa__d { color: var(--on-dark-soft); font-size: var(--fs-base); max-width: 70ch; }
.estrategia__foot { margin-top: var(--space-4); display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; color: var(--on-dark-soft); font-size: var(--fs-sm); }

/* Iniciación: lo que trabajas + voz Capablanca + Pack al final */
.learn { display: grid; gap: var(--space-2); grid-template-columns: 1fr; margin-top: var(--space-4); }
.learn__item { display: flex; gap: var(--space-3); align-items: baseline; padding: var(--space-2) var(--space-3); background: #fff; border: var(--rule) solid var(--ink); border-left: var(--rule-thick) solid var(--accent); transition: transform .12s ease, box-shadow .12s ease; }
.learn__item:hover { transform: translate(-3px,-3px); box-shadow: var(--shadow-hard); }
.learn__item b { font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent); white-space: nowrap; min-width: 6.5em; }
.learn__item span { font-size: var(--fs-base); }
.miedo { margin-top: var(--space-4); display: grid; gap: var(--space-4); align-items: center; }
.miedo > p { font-size: var(--fs-lg); } /* era style inline en el proto */
.iniciacion__lead { max-width: 60ch; margin-top: var(--space-4); } /* era style inline en el proto */
.pack-wrap { margin-top: var(--space-6); }
.pack-wrap h3.pack-lead { font-size: var(--fs-h2); font-family: var(--font-display); font-weight: 800; letter-spacing: var(--tracking-tight); line-height: 1.05; max-width: 20ch; margin-bottom: var(--space-4); }

/* Maestro (Jorge, en voz de nosotros) */
.jorge__bio p strong { color: var(--accent-ink); }

/* El maestro (Jorge): la sección llevaba el fondo/borde como style inline en el proto */
#jorge { background: var(--bg-alt); border-bottom: var(--rule) solid var(--ink); }

/* Cierre (la regla base .cierre vive en variant-comunidad; aquí solo lo propio de la página) */
.cierre h2 { color: #fff; max-width: 20ch; margin-inline: auto; }
.cierre .eyebrow { color: #fff; justify-content: center; } /* era style inline en el proto */
.cierre p { color: #eafbe7; margin-top: var(--space-2); }  /* lead sobre fondo oscuro */
/* .cierre__cta es global (variant-comunidad) */
.cierre .hero__note { color: var(--green-tint); max-width: 44ch; margin-inline: auto; margin-top: var(--space-3); }

/* --- Breakpoints --- */
@media (min-width: 720px) {
  .learn { grid-template-columns: 1fr 1fr; }
  .voz { grid-template-columns: auto 1fr; gap: var(--space-5); }
  .voz__foto { width: 116px; height: 146px; }
  .parte > summary { padding: var(--space-4); gap: var(--space-4); }
  .parte__n { width: 4.4rem; height: 4.4rem; font-size: 2rem; }
  .parte__body { padding: var(--space-4) var(--space-5); }
  .ep__doors { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 940px) {
  .metodo__hero { grid-template-columns: 1.05fr 0.95fr; gap: var(--space-5); }
  .miedo { grid-template-columns: 1fr 1fr; }
}
