/* Fuentes: se usan si subes los .woff2 a /wp-content/uploads/oj-fonts/ (ver LEEME). Sin ellas, cae a Helvetica/Arial. */
@font-face{font-family:'Archivo';src:url('/wp-content/uploads/oj-fonts/Archivo-VF.woff2') format('woff2');font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/wp-content/uploads/oj-fonts/IBMPlexMono-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/wp-content/uploads/oj-fonts/IBMPlexMono-Medium.woff2') format('woff2');font-weight:500;font-display:swap}

/* Ojkita_ · Guion bajo 3D. Todo bajo .oj-guion-wrap. Sin 3D se ve el póster: una barra que parpadea unos 6 s y se queda fija. */
.oj-guion-wrap{--oj-guion:#D2371C;--oj-guion-bg:#F1ECE1;background:#F1ECE1;width:100%;overflow:hidden;overflow-x:clip;overflow-y:visible}
.oj-guion-wrap *{box-sizing:border-box}
.oj-guion-wrap .oj-guion-row{
  display:flex;align-items:flex-end;margin:0;padding:0 0 .16em;
  font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-weight:900;font-stretch:78%;
  font-size:clamp(72px,17vw,230px);letter-spacing:-.045em;line-height:.8;color:#13110F;text-transform:none;
}
.oj-guion-wrap .oj-guion-u{position:relative;flex:none;width:.82em;height:1em;margin-left:-.02em;transform:translateY(.1em);background:var(--oj-guion-bg)}
.oj-guion-wrap .oj-guion-u canvas{position:absolute;left:0;top:0;width:100%;height:calc(100% + .5em);display:block;opacity:0;transition:opacity .25s;pointer-events:none}
.oj-guion-wrap .oj-guion-u.oj-3d canvas{opacity:1}
.oj-guion-wrap .oj-guion-bar{position:absolute;left:8%;right:8%;bottom:14%;height:.16em;background:var(--oj-guion);animation:ojg-blink 1.06s steps(1,end) 6 both}
.oj-guion-wrap .oj-guion-u.oj-3d .oj-guion-bar{visibility:hidden}
/* El tamaño sigue al ancho del contenedor (control "Tamaño"); sin soporte, queda el clamp con vw de arriba */
@supports (container-type:inline-size){
  .oj-guion-wrap{container-type:inline-size}
  .oj-guion-wrap .oj-guion-row{font-size:clamp(32px,calc(var(--oj-fit,17) * 1cqw),400px)}
}
@keyframes ojg-blink{0%{opacity:1}50%{opacity:0}}
@media (prefers-reduced-motion:reduce){
  .oj-guion-wrap .oj-guion-u canvas{transition:none}
  .oj-guion-wrap .oj-guion-bar{animation:none}
}
