/* Oráculo Negro — banners de sinastría (blog → landing). Prefijo onb- para no chocar con el tema. */
@font-face{font-family:"ONB Cinzel";src:url("cinzel-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

.onb{
  --onb-negro:#0a0a0d;--onb-oro:#d4af37;--onb-oro-suave:#e8cf7e;--onb-oro-prof:#b8912b;
  --onb-crema:#ece7dd;--onb-dim:#bdb7ab;
  box-sizing:border-box;display:block;position:relative;isolation:isolate;overflow:hidden;
  margin:30px 0;border-radius:14px;background:var(--onb-negro);color:var(--onb-crema);
  font-family:Lato,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;line-height:1.5;text-align:left;
  box-shadow:0 14px 34px rgba(10,10,13,.24),0 2px 6px rgba(10,10,13,.2);
  transition:box-shadow .3s cubic-bezier(.2,.7,.2,1),transform .3s cubic-bezier(.2,.7,.2,1);
}
.onb *,.onb *::before,.onb *::after{box-sizing:border-box}
.onb:hover{transform:translateY(-2px);box-shadow:0 20px 44px rgba(10,10,13,.3),0 3px 8px rgba(10,10,13,.22)}
.onb-titulo{display:block;margin:0;font-family:"ONB Cinzel",Cinzel,Georgia,serif;font-weight:600;letter-spacing:.015em;line-height:1.22;color:var(--onb-crema);text-wrap:balance}
.onb-texto{display:block;margin:0;color:var(--onb-dim)}
.onb a{text-decoration:none!important;box-shadow:none!important}
.onb .onb-img,.onb .onb-medallon{display:block}

/* botón principal: su ::after cubre todo el banner, así toda la pieza es clicable */
.onb .onb-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.45em;padding:12px 22px;border-radius:999px;
  background:linear-gradient(135deg,var(--onb-oro-suave),var(--onb-oro) 55%,var(--onb-oro-prof));
  color:#1a1509!important;font-weight:700;font-size:15px;line-height:1.2;white-space:nowrap;
  box-shadow:0 6px 18px rgba(212,175,55,.3);
}
.onb .onb-btn::after{content:"";position:absolute;inset:0;z-index:1}
.onb .onb-btn:focus-visible{outline:2px solid var(--onb-oro-suave);outline-offset:3px}
.onb .onb-btn span{transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.onb:hover .onb-btn span{transform:translateX(3px)}
.onb .onb-sec{position:relative;z-index:2;display:inline-block;color:var(--onb-oro-suave)!important;font-size:14px;border-bottom:1px solid rgba(232,207,126,.4)}
.onb .onb-sec:hover{border-bottom-color:var(--onb-oro-suave)}

/* ---------- arriba: tira horizontal ---------- */
.onb-arriba{display:flex;align-items:center;gap:16px;padding:14px 18px 14px 14px;margin:0 0 28px}
.onb-arriba .onb-medallon{flex:none;width:66px;height:66px;border-radius:50%;background-size:cover;background-position:center 30%;
  box-shadow:0 0 0 2px var(--onb-oro),0 0 0 6px rgba(212,175,55,.16)}
.onb-arriba .onb-cuerpo{flex:1;min-width:0}
.onb-arriba .onb-titulo{font-size:19px}
.onb-arriba .onb-texto{font-size:14px;margin-top:3px}

/* ---------- medio: pieza grande con imagen ---------- */
.onb-medio{min-height:290px;display:flex;align-items:center;margin:38px 0}
.onb-medio .onb-img{position:absolute;inset:0 0 0 auto;width:58%;z-index:-1;background-size:cover;background-position:center 35%}
.onb-medio .onb-img::after{content:"";position:absolute;inset:0 0 0 -2px;
  background:linear-gradient(90deg,var(--onb-negro) 0%,var(--onb-negro) 3%,rgba(10,10,13,.88) 18%,rgba(10,10,13,.45) 52%,rgba(10,10,13,.15) 100%)}
.onb-medio .onb-cuerpo{width:60%;padding:30px 0 30px 30px}
.onb-medio .onb-titulo{font-size:27px}
.onb-medio .onb-texto{font-size:15.5px;margin:12px 0 0}
.onb-medio .onb-lista{display:flex;flex-wrap:wrap;gap:6px 16px;margin:14px 0 0;padding:0;list-style:none;font-size:13.5px;color:var(--onb-crema)}
.onb-medio .onb-lista li{margin:0;padding:0 0 0 13px;position:relative;list-style:none}
.onb-medio .onb-lista li::before{content:"";position:absolute;left:0;top:.62em;width:5px;height:5px;border-radius:50%;background:var(--onb-oro)}
.onb-medio .onb-acciones{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:20px}

/* ---------- lateral: tarjeta vertical ---------- */
.onb-lateral{margin:0 0 26px}
.onb-lateral .onb-img{height:196px;background-size:cover;background-position:center 30%;position:relative}
.onb-lateral .onb-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,13,0) 45%,var(--onb-negro) 100%)}
.onb-lateral .onb-anillo{position:absolute;left:22px;top:150px;z-index:1;width:84px;height:84px;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--onb-negro);
  box-shadow:0 0 0 2px var(--onb-oro),0 0 26px rgba(212,175,55,.35)}
.onb-lateral .onb-anillo b{font-family:"ONB Cinzel",Cinzel,Georgia,serif;font-weight:600;font-size:34px;line-height:1;color:var(--onb-oro-suave)}
.onb-lateral .onb-anillo small{font-size:8.5px;letter-spacing:.16em;color:var(--onb-oro);margin-top:3px}
.onb-lateral .onb-cuerpo{padding:50px 22px 24px}
.onb-lateral .onb-titulo{font-size:20px}
.onb-lateral .onb-texto{font-size:14.5px;margin:10px 0 18px}
.onb-lateral .onb-btn{display:flex;width:100%;white-space:normal;text-align:center}
.onb-lateral .onb-nota{display:block;margin-top:12px;font-size:12.5px;color:var(--onb-dim);text-align:center}

/* ---------- móvil ---------- */
@media (max-width:640px){
  .onb{margin:24px 0}
  .onb-arriba{flex-wrap:wrap;gap:12px 14px;padding:14px}
  .onb-arriba .onb-medallon{width:54px;height:54px}
  .onb-arriba .onb-cuerpo{flex:1 1 60%}
  .onb-arriba .onb-titulo{font-size:17px}
  .onb-arriba .onb-btn{width:100%}
  .onb-medio{display:block;min-height:0}
  .onb-medio .onb-img{position:relative;inset:auto;width:100%;height:170px;z-index:0}
  .onb-medio .onb-img::after{background:linear-gradient(180deg,rgba(10,10,13,0) 40%,var(--onb-negro) 100%)}
  .onb-medio .onb-cuerpo{width:100%;padding:6px 20px 24px}
  .onb-medio .onb-titulo{font-size:22px}
  .onb-medio .onb-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){.onb,.onb .onb-btn span{transition:none}.onb:hover{transform:none}}
@media print{.onb{display:none!important}}