/* ---------- sección Psicotécnicos ---------- */
.opr-ps-rejilla{display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,.94fr) !important;
  gap:clamp(28px,3.6vw,56px) !important; align-items:center !important}

.opr-ps-caja{display:flex !important; flex-direction:column !important; box-shadow:var(--sombra) !important; overflow:hidden !important;
  min-height:396px !important}

.opr-ps-tipos{margin-top:26px !important; display:flex !important; flex-direction:column !important; gap:2px !important; counter-reset:ps !important}
.opr-ps-tipos li{display:flex !important; flex-direction:column !important; gap:2px !important; padding:11px 0 11px 36px !important;
  position:relative !important; border-bottom:1px solid var(--borde) !important}
.opr-ps-tipos li:last-child{border-bottom:0 !important}
.opr-ps-tipos li::before{counter-increment:ps !important; content:counter(ps) !important; position:absolute !important; left:0 !important; top:10px !important;
  width:24px !important; height:24px !important; border-radius:999px !important; background:var(--p100) !important; color:var(--suave) !important;
  font-size:.75rem !important; font-weight:700 !important; display:grid !important; place-items:center !important}
.opr-ps-tipos b{font-size:.96875rem !important; font-weight:700 !important; letter-spacing:-.014em !important}
.opr-ps-tipos span{font-size:.84375rem !important; line-height:1.45 !important; color:var(--tenue) !important; text-wrap:pretty !important}
.opr-ps-cta{margin-top:24px !important; align-self:flex-start !important; padding:13px 22px !important; font-size:.9375rem !important}
.opr-ps-titulo{font-size:1.0625rem !important; font-weight:700 !important; letter-spacing:-.016em !important}

.opr-ps-cabecera{display:flex !important; align-items:center !important; justify-content:space-between !important; gap:14px !important;
  padding:16px 22px !important; border-bottom:1px solid var(--borde) !important; background:#FBFCFD !important}
.opr-ps-reloj{font-size:1.0625rem !important; font-weight:800 !important; letter-spacing:-.02em !important; color:var(--suave) !important}

.opr-ps-cuerpo{padding:24px 22px !important; display:flex !important; flex-direction:column !important; gap:17px !important; flex:1 !important}
.opr-ps-inicio{padding:30px 24px !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important;
  gap:18px !important; text-align:center !important; flex:1 !important}
.opr-ps-inicio-txt{max-width:40ch !important; font-size:.9375rem !important; color:var(--suave) !important; text-wrap:pretty !important}
.opr-ps-inicio .opr-btn{padding:13px 26px !important; font-size:.9375rem !important}
.opr-ps-tipo{font-size:.8125rem !important; font-weight:600 !important; color:var(--tenue) !important}

.opr-ps-serie{display:flex !important; gap:8px !important; flex-wrap:wrap !important}
.opr-ps-serie b{flex:1 !important; min-width:48px !important; padding:15px 6px !important; border-radius:10px !important; text-align:center !important;
  background:var(--p50) !important; box-shadow:inset 0 0 0 1.5px var(--borde) !important;
  font-size:1.3rem !important; font-weight:800 !important; letter-spacing:-.03em !important; font-variant-numeric:tabular-nums !important}
.opr-ps-serie .es-hueco,.opr-ps-analogia .es-hueco{background:var(--p950) !important; color:#fff !important; box-shadow:none !important}

.opr-ps-analogia{display:flex !important; flex-wrap:wrap !important; align-items:center !important; gap:8px !important}
.opr-ps-analogia b{padding:11px 14px !important; border-radius:9px !important; background:var(--p50) !important;
  box-shadow:inset 0 0 0 1.5px var(--borde) !important; font-size:.875rem !important; font-weight:800 !important; letter-spacing:.01em !important}
.opr-ps-analogia i{font-size:.8125rem !important; font-weight:500 !important; color:var(--tenue) !important}

.opr-ps-ref{display:flex !important; align-items:center !important; gap:14px !important; padding:16px 18px !important; border-radius:10px !important;
  background:var(--p950) !important; color:#fff !important}
.opr-ps-ref span{font-size:.75rem !important; font-weight:600 !important; color:var(--p400) !important}
.opr-ps-ref b{font-size:1.35rem !important; font-weight:800 !important; letter-spacing:.06em !important; font-variant-numeric:tabular-nums !important}

.opr-ps-ops{display:grid !important; grid-template-columns:1fr 1fr !important; gap:8px !important}
.opr-ps-op{padding:13px 14px !important; border-radius:10px !important; text-align:left !important; font-size:.9375rem !important; font-weight:600 !important;
  letter-spacing:.01em !important; box-shadow:inset 0 0 0 1.5px var(--borde) !important; background:var(--superficie) !important;
  transition:box-shadow .14s, background .14s, opacity .18s, transform .1s !important}
.opr-ps-op:hover:not(:disabled){box-shadow:inset 0 0 0 1.5px var(--borde2) !important; background:#FAFBFD !important}
.opr-ps-op:active:not(:disabled){transform:translateY(1px) !important}
.opr-ps-op:disabled{cursor:default !important}
.opr-ps-op.es-ok{background:var(--ok100) !important; box-shadow:inset 0 0 0 1.5px var(--ok600) !important; color:var(--ok900) !important}
.opr-ps-op.es-no{background:var(--no100) !important; box-shadow:inset 0 0 0 1.5px var(--no600) !important; color:var(--no900) !important}
.opr-ps-op.es-apagada{opacity:.42 !important}

.opr-ps-feed{max-height:0 !important; overflow:hidden !important; opacity:0 !important; transition:max-height .3s ease, opacity .24s ease !important}
.opr-ps-feed.visible{max-height:180px !important; opacity:1 !important}
.opr-ps-feed{font-size:.875rem !important; line-height:1.5 !important}
.opr-ps-feed.es-ok{color:var(--ok900) !important} .opr-ps-feed.es-no{color:var(--no900) !important}
.opr-ps-feed b{font-weight:700 !important}
.opr-ps-feed em{font-weight:700 !important; font-variant-numeric:tabular-nums !important; opacity:.75 !important}

.opr-ps-fin{padding:30px 24px !important; display:flex !important; flex-direction:column !important; align-items:center !important; gap:9px !important; text-align:center !important; flex:1 !important; justify-content:center !important}
.opr-ps-fin b{font-size:2.7rem !important; font-weight:800 !important; line-height:1 !important; letter-spacing:-.04em !important}
.opr-ps-fin > span{font-size:.875rem !important; font-weight:600 !important; color:var(--tenue) !important}
.opr-ps-fin-txt{max-width:42ch !important; font-size:.9375rem !important; color:var(--suave) !important; margin-top:4px !important; text-wrap:pretty !important}
.opr-ps-fin .opr-btn{margin-top:8px !important; padding:11px 19px !important; font-size:.875rem !important}

.opr-ps-pie{display:flex !important; align-items:center !important; justify-content:space-between !important; gap:14px !important;
  padding:14px 22px !important; border-top:1px solid var(--borde) !important; background:#FBFCFD !important; font-size:.75rem !important; font-weight:600 !important; color:var(--tenue) !important}


@media (max-width:560px){
  .opr-ps-caja{min-height:0 !important}
  .opr-ps-cta{align-self:stretch !important; text-align:center !important}
}

/* ---- móvil: primero el texto y las cuatro aptitudes, después el test ---- */
@media (max-width:920px){
  .opr-ps-rejilla{display:flex !important; flex-direction:column !important; align-items:stretch !important; gap:0 !important}
  .opr-psicos .opr-ps-texto{display:contents !important}
  .opr-psicos .opr-rotulo{order:1 !important}
  .opr-psicos .opr-h2{order:2 !important}
  .opr-psicos .opr-entradilla{order:3 !important}
  .opr-ps-tipos{order:4 !important}
  .opr-ps-caja{order:5 !important; margin-top:30px !important}
  .opr-ps-cta{order:6 !important}
}