/* =====================================================================
   OpoReal · Próximamente · núcleo del plugin
   Copia del núcleo de la home (sistema Pizarra), con su propio handle
   para que este plugin no pueda romper ni la home ni Físicas ni Temas.
   Si cambia la paleta de la home, hay que cambiarla aquí también.
   ===================================================================== */

.opr{
  /* --- escala pizarra --- */
  --p50:#F7F8FB !important;  --p100:#EBEFF4; --p200:#D9E0E8; --p300:#BEC9D5;
  --p400:#A0ACBB; --p500:#7F8E9F; --p600:#606F80; --p700:#475362;
  --p800:#313A45; --p900:#1F262D; --p950:#12171C;

  /* --- papeles --- */
  --fondo:var(--p50) !important; --superficie:#FFFFFF; --borde:var(--p200); --borde2:var(--p300);
  --tinta:var(--p950); --suave:var(--p700); --tenue:var(--p500);

  /* --- estados (solo tras responder, nunca decoran) --- */
  --ok100:#E1F4ED !important; --ok500:#319B74; --ok600:#1D8660; --ok900:#143428;
  --no100:#FBE5E5; --no500:#DD3C3C; --no600:#BA2C2C; --no900:#3D1414;
  --av100:#FDEFD9; --av500:#F09D0F; --av600:#B87C14; --av900:#39290E;

  /* --- cuerpos --- */
  --ertz:#D9503C !important; --local:#C9D420;

  --radio:16px; --radio-s:11px;
  --sombra:0 1px 2px rgba(18,23,28,.05), 0 22px 50px -30px rgba(18,23,28,.34);
  --sombra-s:0 1px 2px rgba(18,23,28,.06), 0 8px 20px -14px rgba(18,23,28,.3);

  display:block !important;
  background:var(--fondo) !important; color:var(--tinta) !important;
  font-family:"Public Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif !important;
  font-size:16px !important; line-height:1.6 !important; font-weight:400 !important;
  letter-spacing:normal !important; text-align:left !important;
  -webkit-font-smoothing:antialiased !important; -moz-osx-font-smoothing:grayscale !important;
}

/* --- blindaje: el tema de WordPress no entra aquí --- */
.opr,.opr *,.opr *::before,.opr *::after{
  box-sizing:border-box !important;
  text-transform:none !important; text-decoration:none !important;
  text-shadow:none !important; float:none !important;
  list-style:none !important; font-style:normal !important;
}
/* OJO: font-family:inherit solo para los descendientes. Si .opr entra en esta
   regla, hereda la tipografía del tema de WordPress y se pierde Public Sans. */
.opr *,.opr *::before,.opr *::after{ font-family:inherit !important; }
.opr{border:0 !important; float:none !important}
.opr *,.opr *::before,.opr *::after{
  margin:0 !important; padding:0 !important; border:0 !important; background:none !important; box-shadow:none !important; outline:none !important;
  letter-spacing:inherit !important; line-height:inherit !important; color:inherit !important;
  max-width:none !important; min-width:0 !important;
}
.opr img,.opr svg{display:block !important; max-width:100% !important}
/* OJO: para ocultar una imagen hace falta al menos la misma especificidad que la
   regla de arriba (0,1,1). Usa `img.mi-clase{display:none !important}`, nunca `.mi-clase`. */
.opr button,.opr input,.opr select,.opr textarea{
  font:inherit !important; cursor:pointer !important; -webkit-appearance:none !important; appearance:none !important;
}
.opr input,.opr textarea{cursor:text !important}
.opr a{cursor:pointer !important}
.opr [hidden]{display:none !important}
.opr :focus-visible{outline:2px solid var(--tinta) !important; outline-offset:2px !important; border-radius:4px !important}
.opr-seccion.es-noche :focus-visible{outline-color:#fff !important}

/* --- lienzo --- */
.opr-caja{width:100% !important; max-width:1180px !important; margin:0 auto !important}
.opr-seccion{padding:clamp(60px,7.5vw,108px) clamp(18px,4vw,48px) !important; overflow-x:clip !important}
.opr-seccion.es-blanca{background:var(--superficie) !important}
.opr-seccion.es-noche{background:var(--p950) !important; color:var(--p100) !important}
.opr-seccion.es-pantalla{
  min-height:100svh !important; display:flex !important; align-items:center !important;
  padding-top:clamp(48px,5vh,72px) !important; padding-bottom:clamp(48px,5vh,72px) !important;
}
.opr-seccion.es-pantalla > .opr-caja{width:100% !important}
@media (max-width:920px){
  .opr-seccion.es-pantalla{min-height:0 !important; padding-top:clamp(60px,7.5vw,108px) !important; padding-bottom:clamp(60px,7.5vw,108px) !important}
}

/* --- tipografía --- */
.opr-rotulo{
  display:block !important; margin-bottom:12px !important;
  font-size:.95rem !important; font-weight:600 !important; letter-spacing:-.005em !important; color:var(--suave) !important;
}
.opr-seccion.es-noche .opr-rotulo{color:var(--p400) !important}
.opr-h1{
  font-size:clamp(2.15rem,5.2vw,3.7rem) !important; font-weight:800 !important;
  line-height:1.02 !important; letter-spacing:-.035em !important; text-wrap:balance !important;
}
.opr-h2{
  font-size:clamp(1.85rem,4vw,2.9rem) !important; font-weight:800 !important;
  line-height:1.04 !important; letter-spacing:-.03em !important; text-wrap:balance !important;
}
.opr-h3{font-size:1.3rem !important; font-weight:700 !important; line-height:1.28 !important; letter-spacing:-.02em !important}
.opr-h4{font-size:1.0625rem !important; font-weight:700 !important; line-height:1.35 !important; letter-spacing:-.012em !important}
.opr-entradilla{
  margin-top:16px !important; max-width:62ch !important;
  font-size:1.0625rem !important; color:var(--suave) !important; text-wrap:pretty !important;
}
.opr-seccion.es-noche .opr-entradilla{color:var(--p300) !important}
.opr-nota{font-size:.8125rem !important; color:var(--tenue) !important}
.opr-seccion.es-noche .opr-nota{color:var(--p500) !important}
.opr-cifra{font-variant-numeric:tabular-nums !important; letter-spacing:-.02em !important}

/* --- cabecera de sección --- */
.opr-cabeza{margin-bottom:clamp(34px,4vw,52px) !important}
.opr-cabeza.es-partida{display:grid !important; grid-template-columns:minmax(0,1fr) auto !important; gap:28px !important; align-items:end !important}
@media (max-width:820px){ .opr-cabeza.es-partida{grid-template-columns:1fr !important; align-items:start !important} }

/* --- botones --- */
.opr-btn{
  display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:9px !important;
  padding:14px 24px !important; border-radius:999px !important;
  font-size:1rem !important; font-weight:700 !important; letter-spacing:-.012em !important; line-height:1 !important;
  transition:transform .12s ease, background .16s ease, border-color .16s ease, opacity .16s ease !important;
  white-space:nowrap !important;
}
.opr-btn:active{transform:translateY(1px) !important}
.opr-btn svg{width:17px !important; height:17px !important; flex:none !important}
.opr-btn-1{background:var(--p950) !important; color:#fff !important}
.opr-btn-1:hover{background:var(--p800) !important}
.opr-seccion.es-noche .opr-btn-1{background:var(--p50) !important; color:var(--p950) !important}
.opr-seccion.es-noche .opr-btn-1:hover{background:#fff !important}
.opr-btn-2{background:transparent !important; color:var(--tinta) !important; box-shadow:inset 0 0 0 1.5px var(--borde2) !important}
.opr-btn-2:hover{box-shadow:inset 0 0 0 1.5px var(--p500) !important; background:var(--p100) !important}
.opr-seccion.es-noche .opr-btn-2{color:var(--p100) !important; box-shadow:inset 0 0 0 1.5px var(--p700) !important}
.opr-seccion.es-noche .opr-btn-2:hover{background:var(--p900) !important; box-shadow:inset 0 0 0 1.5px var(--p600) !important}
.opr-btn:disabled{opacity:.42 !important; cursor:default !important}
.opr-btn:disabled:active{transform:none !important}

/* --- tarjeta --- */
.opr-tarjeta{
  background:var(--superficie) !important; border:1px solid var(--borde) !important;
  border-radius:var(--radio) !important; box-shadow:var(--sombra-s) !important;
}

/* --- segmentado --- */
.opr-seg{display:inline-flex !important; gap:4px !important; padding:4px !important; border-radius:999px !important; background:var(--p100) !important}
.opr-seg button{
  padding:9px 18px !important; border-radius:999px !important; font-size:.9375rem !important; font-weight:600 !important;
  letter-spacing:-.01em !important; color:var(--suave) !important; transition:background .16s, color .16s !important;
  white-space:nowrap !important;
}
.opr-seg button:hover{color:var(--tinta) !important}
.opr-seg button[aria-pressed="true"]{background:var(--superficie) !important; color:var(--tinta) !important; box-shadow:var(--sombra-s) !important}
.opr-seccion.es-noche .opr-seg{background:var(--p900) !important}
.opr-seccion.es-noche .opr-seg button{color:var(--p400) !important}
.opr-seccion.es-noche .opr-seg button[aria-pressed="true"]{background:var(--p800) !important; color:#fff !important}

@media (prefers-reduced-motion:reduce){
  .opr *,.opr *::before,.opr *::after{
    transition-duration:.01ms !important; animation-duration:.01ms !important;
  }
}

/* ---------- el formulario de aviso (portada y cierre) ----------
   Vive en el núcleo del plugin porque lo usan dos secciones y tiene que
   verse igual en las dos. Sobre fondo oscuro y sobre fondo claro.        */

.opr-px-form{display:flex !important; flex-direction:column !important; gap:12px !important; width:100% !important}

.opr-px-form-fila{display:flex !important; gap:9px !important; width:100% !important}
.opr-px-form-etq{position:absolute !important; width:1px !important; height:1px !important; overflow:hidden !important; clip-path:inset(50%) !important}
.opr-px-form-correo{
  flex:1 1 auto !important; min-width:0 !important; padding:14px 18px !important; border-radius:999px !important;
  background:var(--superficie) !important; color:var(--tinta) !important;
  box-shadow:inset 0 0 0 1.5px var(--borde2) !important;
  font-size:1rem !important; line-height:1.2 !important;
  transition:box-shadow .16s ease !important;
}
.opr-px-form-correo::placeholder{color:var(--tenue) !important}
.opr-px-form-correo:focus{box-shadow:inset 0 0 0 2px var(--p950) !important; outline:none !important}
.opr-px-form-correo.es-mal{box-shadow:inset 0 0 0 2px var(--no600) !important}
.opr-px-form-btn{flex:none !important}

.opr-px-form-ok{display:flex !important; align-items:flex-start !important; gap:9px !important; text-align:left !important;
  font-size:.8125rem !important; line-height:1.5 !important; color:var(--suave) !important}
.opr-px-form-ok input{
  flex:none !important; width:17px !important; height:17px !important; margin-top:2px !important; border-radius:5px !important;
  background:var(--superficie) !important; box-shadow:inset 0 0 0 1.5px var(--borde2) !important;
  display:block !important; position:relative !important; transition:background .14s, box-shadow .14s !important;
}
.opr-px-form-ok input:checked{background:var(--p950) !important; box-shadow:inset 0 0 0 1.5px var(--p950) !important}
.opr-px-form-ok input:checked::after{
  content:"" !important; position:absolute !important; left:5px !important; top:2px !important; width:5px !important; height:9px !important;
  border-right:2px solid #fff !important; border-bottom:2px solid #fff !important; transform:rotate(42deg) !important;
}
.opr-px-form-ok.es-mal input{box-shadow:inset 0 0 0 2px var(--no600) !important}
.opr-px-form-ok a{text-decoration:underline !important; font-weight:600 !important; color:var(--tinta) !important}

.opr-px-form-aviso{font-size:.84375rem !important; line-height:1.5 !important; text-align:left !important; min-height:1px !important}
.opr-px-form-aviso.es-mal{color:var(--no600) !important; font-weight:600 !important}
.opr-px-form-aviso.es-ok{color:var(--ok600) !important; font-weight:600 !important}

/* --- sobre fondo oscuro --- */
.opr-seccion.es-noche .opr-px-form-ok{color:var(--p400) !important}
.opr-seccion.es-noche .opr-px-form-ok a{color:#fff !important}
.opr-seccion.es-noche .opr-px-form-aviso.es-mal{color:#F09D0F !important}
.opr-seccion.es-noche .opr-px-form-aviso.es-ok{color:#7FD3B4 !important}
.opr-seccion.es-noche .opr-px-form-correo:focus{box-shadow:inset 0 0 0 2px #fff !important}

/* --- el campo trampa: invisible para las personas, visible para los robots --- */
.opr-px-trampa{position:absolute !important; left:-9999px !important; top:auto !important; width:1px !important; height:1px !important; overflow:hidden !important}

/* --- lo que se ve cuando el alta ha ido bien --- */
.opr-px-hecho{
  display:flex !important; align-items:flex-start !important; gap:13px !important; padding:18px 20px !important;
  border-radius:var(--radio) !important; box-shadow:inset 0 0 0 1px var(--ok600) !important;
  background:var(--ok100) !important; color:var(--ok900) !important; text-align:left !important;
}
.opr-seccion.es-noche .opr-px-hecho{background:rgba(49,155,116,.14) !important; color:#DFF3EA !important; box-shadow:inset 0 0 0 1px #2A6A53 !important}
.opr-px-hecho svg{flex:none !important; width:21px !important; height:21px !important; margin-top:2px !important; color:var(--ok600) !important}
.opr-seccion.es-noche .opr-px-hecho svg{color:#7FD3B4 !important}
.opr-px-hecho b{display:block !important; font-weight:700 !important; font-size:.96875rem !important; letter-spacing:-.012em !important}
.opr-px-hecho span{display:block !important; margin-top:3px !important; font-size:.875rem !important; line-height:1.5 !important}

@media (max-width:620px){
  .opr-px-form-fila{flex-direction:column !important}
  .opr-px-form-btn{width:100% !important}
}