/* H2D · Páginas públicas de Inglés (Local y CGPC).
   Reutiliza los componentes de seo-temario.css (hero, tarjeta de pregunta,
   opciones, corrección, revelado progresivo); esto es solo lo específico
   de la lectura oficial y de las etiquetas en inglés/español.

   Identidad de color: --purple ya es, en el resto del sitio, el color de
   Inglés (shared/landing-visual-v1188-42.css, .tutor-card--english). Se
   reutiliza aquí el mismo token en vez de inventar uno nuevo, para que
   Temario (azul) e Inglés (morado) se distingan de un vistazo sin romper
   la paleta del sitio. */
.seo-ingles .temario-hero{background:radial-gradient(circle at 88% 8%,rgba(109,74,226,.4),transparent 40%),linear-gradient(135deg,#06172f 0%,#181043 55%,#2a0f3d 100%)}
.seo-ingles .temario-lista a,.seo-ingles .temario-pregunta,.seo-ingles .temario-pager a{border-left-color:var(--purple)}
.seo-ingles .temario-pager--next{border-right-color:var(--purple)}
.seo-ingles .temario-pregunta__badge{background:var(--purple)}
.seo-ingles .temario-reveal{color:var(--purple)}
.seo-ingles .temario-reveal:hover,.seo-ingles .temario-reveal:focus-visible{border-color:var(--purple)}
.seo-ingles .temario-lista a:hover,.seo-ingles .temario-lista a:focus-visible,.seo-ingles .temario-pager a:hover,.seo-ingles .temario-pager a:focus-visible{border-color:#b7a3f0;border-left-color:var(--purple)}
.seo-ingles .temario-lista a:hover .temario-lista__arrow,.seo-ingles .temario-lista a:focus-visible .temario-lista__arrow{color:var(--purple)}
.seo-ingles .temario-pregunta.is-unrevealed .temario-opciones li:hover,.seo-ingles .temario-pregunta.is-unrevealed .temario-opciones li:focus-within{border-color:#b7a3f0}
.seo-ingles .temario-opciones__btn:focus-visible{outline-color:var(--purple)}

/* Inglés · CGPC: la página combina seo-temario.css + seo-ingles.css, así
   que aquí el morado de Inglés y el granate de CGPC (definido en
   .modulo-cgpc, shared/seo-temario.css) compiten por el mismo elemento.
   Se repite el granate con selectores compuestos (.seo-ingles.modulo-cgpc)
   para tener más especificidad que las reglas .seo-ingles de arriba y así
   ganar siempre, sin depender del orden de carga de las hojas. */
.seo-ingles.modulo-cgpc .temario-hero{background:radial-gradient(circle at 88% 8%,rgba(173,38,71,.4),transparent 40%),linear-gradient(135deg,#06172f 0%,#3a0f28 55%,#5b1027 100%)}
.seo-ingles.modulo-cgpc .temario-lista a,.seo-ingles.modulo-cgpc .temario-pregunta,.seo-ingles.modulo-cgpc .temario-pager a{border-left-color:#ad2647}
.seo-ingles.modulo-cgpc .temario-pager--next{border-right-color:#ad2647}
.seo-ingles.modulo-cgpc .temario-pregunta__badge{background:#ad2647}
.seo-ingles.modulo-cgpc .temario-reveal{color:#ad2647}
.seo-ingles.modulo-cgpc .temario-reveal:hover,.seo-ingles.modulo-cgpc .temario-reveal:focus-visible{border-color:#ad2647}
.seo-ingles.modulo-cgpc .temario-lista a:hover,.seo-ingles.modulo-cgpc .temario-lista a:focus-visible,.seo-ingles.modulo-cgpc .temario-pager a:hover,.seo-ingles.modulo-cgpc .temario-pager a:focus-visible{border-color:#d98ba0;border-left-color:#ad2647}
.seo-ingles.modulo-cgpc .temario-lista a:hover .temario-lista__arrow,.seo-ingles.modulo-cgpc .temario-lista a:focus-visible .temario-lista__arrow{color:#ad2647}
.seo-ingles.modulo-cgpc .temario-pregunta.is-unrevealed .temario-opciones li:hover,.seo-ingles.modulo-cgpc .temario-pregunta.is-unrevealed .temario-opciones li:focus-within{border-color:#d98ba0}
.seo-ingles.modulo-cgpc .temario-opciones__btn:focus-visible{outline-color:#ad2647}

.ingles-pregunta-es{margin:-.55rem 0 1rem;color:var(--muted);font-size:.86rem;font-style:italic}

.ingles-lectura-section{padding-top:0}
.ingles-lectura{position:relative;max-width:820px;margin:0 auto;padding:clamp(1.4rem,3vw,2rem);border:1px solid var(--line);border-radius:var(--radius);background:var(--white);box-shadow:0 18px 46px rgba(8,45,97,.08)}
.ingles-lectura__badge{display:inline-flex;margin-bottom:.9rem;padding:.32rem .8rem;border-radius:999px;background:rgba(18,166,109,.1);color:var(--green);font-size:.74rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.ingles-lectura__texto{color:var(--ink);line-height:1.75;font-size:1.02rem}
.ingles-lectura__texto p{margin:0 0 .9rem}
.ingles-lectura__texto p:last-child{margin-bottom:0}
.ingles-lectura__traduccion{margin-top:1.2rem;padding-top:1.1rem;border-top:1px dashed var(--line)}
.ingles-lectura__traduccion summary{cursor:pointer;color:var(--blue);font-weight:700;font-size:.9rem}
.ingles-lectura__traduccion summary:hover,.ingles-lectura__traduccion summary:focus-visible{text-decoration:underline}
.ingles-lectura__traduccion div{margin-top:.9rem;color:var(--muted);line-height:1.7}
.ingles-lectura__traduccion div p{margin:0 0 .8rem}
.ingles-lectura__traduccion div p:last-child{margin-bottom:0}

.ingles-modelo{padding:.9rem 1.05rem;border-radius:14px;background:rgba(109,74,226,.045);border:1px solid rgba(109,74,226,.16);font-size:.94rem;line-height:1.6;color:var(--ink)}
.ingles-modelo__en{margin:0 0 .4rem}
.ingles-modelo__es{margin:0 0 .7rem;color:var(--muted)}
.ingles-modelo blockquote{margin:.2rem 0 .8rem;padding:.65rem .8rem;border-left:4px solid var(--blue);border-radius:8px;background:#eff6ff;color:#1e3a5f;font-size:.9rem;font-style:italic}
/* "Tu respuesta debe incluir" reutiliza las ideasClave ya extraídas (antes
   no se pintaban en ningún sitio) como chips, en vez de dejar que se
   pierdan dentro del párrafo largo de justificación. */
.ingles-modelo>strong{display:inline-block;margin:.7rem 0 .4rem;padding:.2rem .55rem;border-radius:6px;background:rgba(109,74,226,.1);color:var(--purple);font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.ingles-modelo__ideas{list-style:none;margin:0 0 .7rem;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.ingles-modelo__ideas li{padding:.3rem .65rem;border:1px solid rgba(109,74,226,.22);border-radius:999px;background:var(--white);color:#4b3a86;font-size:.78rem;font-weight:600}
.ingles-modelo__detalle{margin-top:.4rem}
.ingles-modelo__detalle summary{cursor:pointer;color:var(--purple);font-weight:700;font-size:.85rem}
.ingles-modelo__detalle summary:hover,.ingles-modelo__detalle summary:focus-visible{text-decoration:underline}
.ingles-modelo__detalle p{margin:.6rem 0 0;color:var(--muted)}

@media(min-width:820px){.temario-preguntas{max-width:820px}}