/* ---------- Temario · el Diccionario del Opositor ----------
   Sección de paso: está debajo del índice porque quien acaba de mirar los
   once bloques es justo quien se topa con las palabras que el temario da por
   sabidas.

   La banda es blanca y el panel oscuro. Es a propósito: el índice que va
   encima ya es blanco y «dentro de cada tema», que va debajo, es noche. Si
   esta sección fuera noche, las dos oscuras se pegarían y se leerían como
   una sola. Con el panel oscuro dentro de banda blanca la sección se ve como
   un objeto aparte y el ritmo claro-oscuro de la página aguanta.

   Todo va prefijado con la raíz de la sección: `.opr *` del núcleo pesa
   (0,1,0) y esta página también carga el núcleo de `oporeal-bloques`, que se
   encola DESPUÉS. Una clase suelta empataría y perdería por el orden. */

.opr-ix-dicc .opr-ix-dc-panel{
  --dc-pad:clamp(26px,3.6vw,46px) !important;
  position:relative !important; overflow:hidden !important;
  display:grid !important; grid-template-columns:minmax(0,1fr) minmax(150px,250px) !important;
  gap:clamp(18px,3vw,46px) !important; align-items:end !important;
  padding:var(--dc-pad) !important;
  border-radius:var(--radio) !important;
  background:var(--p950) !important;
  box-shadow:inset 0 0 0 1px var(--p800) !important;
}

/* La banda es blanca, así que el núcleo pinta el rótulo, la entradilla, la
   nota y el botón para fondo claro. Aquí van al revés. */
.opr-ix-dicc .opr-ix-dc-panel .opr-rotulo{color:var(--p400) !important}
.opr-ix-dicc .opr-ix-dc-panel .opr-h2{color:#fff !important}
.opr-ix-dicc .opr-ix-dc-panel .opr-entradilla{color:var(--p300) !important; max-width:50ch !important}
.opr-ix-dicc .opr-ix-dc-panel .opr-nota{color:var(--p500) !important}
.opr-ix-dicc .opr-ix-dc-cta{background:var(--p50) !important; color:var(--p950) !important}
.opr-ix-dicc .opr-ix-dc-cta:hover{background:#fff !important}

.opr-ix-dicc .opr-ix-dc-texto{min-width:0 !important}
.opr-ix-dicc .opr-ix-dc-cta{margin-top:clamp(22px,2.6vw,30px) !important}
.opr-ix-dicc .opr-ix-dc-nota{margin-top:16px !important}

/* La agente se apoya en el borde de abajo del panel: el margen negativo vale
   exactamente el relleno, por eso los dos salen de --dc-pad. */
.opr-ix-dicc .opr-ix-dc-figura{
  align-self:end !important; justify-self:center !important;
  margin-bottom:calc(-1 * var(--dc-pad)) !important;
}
.opr-ix-dicc .opr-ix-dc-figura img{
  display:block !important; width:100% !important; max-width:250px !important; height:auto !important;
}

/* Las dos columnas aguantan hasta bien abajo; lo que se encoge es la agente.
   Apilarla a 820px dejaba una fila entera de panel vacía a su derecha. */
@media (max-width:900px){
  .opr-ix-dicc .opr-ix-dc-figura img{max-width:186px !important}
}
@media (max-width:700px){
  .opr-ix-dicc .opr-ix-dc-figura img{max-width:150px !important}
}
@media (max-width:600px){
  .opr-ix-dicc .opr-ix-dc-panel{grid-template-columns:1fr !important; gap:14px !important; align-items:start !important}
  /* Centrada, no a la izquierda: apilada encima del texto y a un lado, la
     agente se leía como un despiste. Pedido por Sergio el 6 de septiembre de
     2026 mirándolo en el móvil. */
  .opr-ix-dicc .opr-ix-dc-figura{order:-1 !important; justify-self:center !important; margin-bottom:0 !important}
  .opr-ix-dicc .opr-ix-dc-figura img{max-width:158px !important}
}

@media (max-width:560px){
  .opr-ix-dicc .opr-ix-dc-cta{width:100% !important}
}