/* ===== Popups del sitio — estilos base (los colores los define el admin) ===== */
.pu-wrap{position:fixed;inset:0;z-index:9500;display:none;font-family:Inter,system-ui,sans-serif}
.pu-wrap.on{display:block}
.pu-overlay{position:absolute;inset:0;background:rgba(16,30,18,var(--pu-ov,.55));backdrop-filter:blur(2px);animation:puFade .35s ease}
@keyframes puFade{from{opacity:0}to{opacity:1}}

.pu-box{
  position:absolute;background:var(--pu-bg,#fff);color:var(--pu-tx,#1A1F1C);
  width:min(var(--pu-w,520px),calc(100vw - 2rem));max-height:90vh;overflow-y:auto;
  border-radius:var(--pu-r,10px);box-shadow:0 24px 70px rgba(10,25,12,.4);
}
/* posiciones */
.pu-centro{top:50%;left:50%;transform:translate(-50%,-50%)}
.pu-abajo-derecha{right:1.4rem;bottom:1.4rem}
.pu-abajo-izquierda{left:1.4rem;bottom:1.4rem}
.pu-arriba{top:1.6rem;left:50%;transform:translateX(-50%)}
.pu-barra-abajo{left:0;right:0;bottom:0;width:100%;max-width:none;border-radius:0;max-height:none}

/* animaciones */
@keyframes puZoom{from{opacity:0;transform:translate(-50%,-50%) scale(.92)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes puZoomS{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
@keyframes puSubir{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
@keyframes puSubirC{from{opacity:0;transform:translate(-50%,calc(-50% + 40px))}to{opacity:1;transform:translate(-50%,-50%)}}
@keyframes puFadeIn{from{opacity:0}to{opacity:1}}
@keyframes puLado{from{opacity:0;transform:translateX(60px)}to{opacity:1;transform:none}}
.pu-anim-zoom{animation:puZoomS .4s cubic-bezier(.22,1,.36,1)}
.pu-centro.pu-anim-zoom{animation:puZoom .4s cubic-bezier(.22,1,.36,1)}
.pu-anim-subir{animation:puSubir .45s cubic-bezier(.22,1,.36,1)}
.pu-centro.pu-anim-subir{animation:puSubirC .45s cubic-bezier(.22,1,.36,1)}
.pu-anim-fade{animation:puFadeIn .5s ease}
.pu-anim-deslizar{animation:puLado .45s cubic-bezier(.22,1,.36,1)}

/* cerrar */
.pu-x{
  position:absolute;top:.6rem;right:.6rem;z-index:3;width:32px;height:32px;border:0;cursor:pointer;
  border-radius:50%;background:rgba(255,255,255,.9);color:#1A1F1C;font-size:1.3rem;line-height:1;
  display:grid;place-items:center;box-shadow:0 2px 10px rgba(0,0,0,.18);transition:.25s;
}
.pu-x:hover{background:#fff;transform:rotate(90deg)}

/* imagen: altura fija arriba/abajo para que no empuje el contenido fuera de pantalla */
.pu-img{overflow:hidden;border-radius:var(--pu-r,10px) var(--pu-r,10px) 0 0}
/* La foto se ve COMPLETA, con su proporción natural (nunca se recorta) */
.pu-img img{display:block;width:100%;height:auto}
.pu-img-abajo{border-radius:0 0 var(--pu-r,10px) var(--pu-r,10px)}
.pu-sola .pu-img{border-radius:var(--pu-r,10px)}
.pu-sola .pu-img img{max-height:80vh;height:auto}

/* imagen al lado */
.pu-lado{display:flex;align-items:stretch;width:min(calc(var(--pu-w,520px) * 1.6),calc(100vw - 2rem))}
.pu-lado .pu-img{flex:0 0 42%;border-radius:var(--pu-r,10px) 0 0 var(--pu-r,10px)}
.pu-lado .pu-img img{height:100%;min-height:100%}
.pu-lado .pu-body{flex:1;display:flex;flex-direction:column;justify-content:center}
.pu-img-derecha{flex-direction:row-reverse}
.pu-img-derecha .pu-img{border-radius:0 var(--pu-r,10px) var(--pu-r,10px) 0}

/* imagen de fondo */
.pu-fondo{background-size:cover;background-position:center;position:relative}
.pu-fondo::before{content:"";position:absolute;inset:0;background:var(--pu-bg,#fff);opacity:.86;border-radius:inherit}
.pu-fondo .pu-body{position:relative;z-index:2}

/* contenido */
.pu-body{padding:1.9rem}
.pu-sub{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--pu-bt,#A6CC33);margin-bottom:.6rem}
.pu-titulo{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;line-height:1.15;color:var(--pu-ti,#1A3A1D);margin-bottom:.7rem}
.pu-texto{font-size:.94rem;line-height:1.6;opacity:.9}
.pu-btn{
  display:block;width:100%;margin-top:1.2rem;padding:.9rem 1.4rem;border:0;cursor:pointer;
  background:var(--pu-bt,#A6CC33);color:var(--pu-btx,#1A3A1D);border-radius:calc(var(--pu-r,10px) * .6);
  font-family:inherit;font-size:.95rem;font-weight:700;text-align:center;text-decoration:none;transition:.25s;
}
.pu-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}

/* formulario */
.pu-form{margin-top:1.2rem}
.pu-f{margin-bottom:.75rem}
.pu-f label{display:block;font-size:.76rem;font-weight:700;margin-bottom:.3rem;opacity:.85}
.pu-f input,.pu-f select,.pu-f textarea{
  width:100%;padding:.72rem .85rem;border:1.5px solid rgba(26,58,29,.22);border-radius:calc(var(--pu-r,10px) * .55);
  font-family:inherit;font-size:.9rem;background:rgba(255,255,255,.85);color:#1A1F1C;transition:.2s;
}
.pu-f input:focus,.pu-f select:focus,.pu-f textarea:focus{outline:none;border-color:var(--pu-bt,#A6CC33);box-shadow:0 0 0 3px rgba(166,204,51,.25)}
.pu-f textarea{min-height:86px;resize:vertical}
.pu-check{display:flex;gap:.55rem;align-items:flex-start;font-size:.8rem;margin:.7rem 0;cursor:pointer;opacity:.9}
.pu-check input{margin-top:.15rem;accent-color:var(--pu-bt,#A6CC33);width:16px;height:16px;flex-shrink:0}
.pu-msg{display:none;margin-top:.8rem;padding:.7rem .9rem;border-radius:8px;font-size:.87rem;text-align:center}
.pu-msg.ok{display:block;background:rgba(166,204,51,.18);color:#3F6B0C;border:1px solid rgba(166,204,51,.6)}
.pu-msg.err{display:block;background:#FDECEC;color:#B3261E;border:1px solid #F5C6C6}

/* barra inferior: todo en línea */
.pu-barra-abajo .pu-body{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;padding:1.1rem 3rem 1.1rem 1.8rem;max-width:1200px;margin:0 auto}
.pu-barra-abajo .pu-titulo{margin-bottom:0;font-size:1.15rem}
.pu-barra-abajo .pu-sub{margin-bottom:0}
.pu-barra-abajo .pu-texto{flex:1;min-width:200px}
.pu-barra-abajo .pu-btn{width:auto;margin-top:0;flex-shrink:0}
.pu-barra-abajo .pu-form{display:flex;gap:.6rem;margin-top:0;flex-wrap:wrap;align-items:flex-end;flex:1}
.pu-barra-abajo .pu-f{margin-bottom:0;flex:1;min-width:150px}
.pu-barra-abajo.pu-lado{width:100%}
.pu-barra-abajo .pu-img{flex:0 0 160px;border-radius:0}

/* Pantallas de poca altura: menos aire para que quepa más contenido */
@media(max-height:760px){
  .pu-body{padding:1.4rem}
  .pu-titulo{font-size:1.3rem;margin-bottom:.5rem}
  .pu-f{margin-bottom:.6rem}
  .pu-f input,.pu-f select{padding:.6rem .8rem}
  .pu-btn{margin-top:.9rem;padding:.8rem 1.4rem}
}

@media(max-width:640px){
  .pu-lado{flex-direction:column;width:min(var(--pu-w,520px),calc(100vw - 1.6rem))}
  .pu-lado .pu-img{flex:0 0 auto;max-height:190px;border-radius:var(--pu-r,10px) var(--pu-r,10px) 0 0}
  .pu-img-derecha{flex-direction:column}
  .pu-body{padding:1.4rem}
  .pu-titulo{font-size:1.25rem}
  .pu-abajo-derecha,.pu-abajo-izquierda{left:.8rem;right:.8rem;bottom:.8rem}
  .pu-barra-abajo .pu-body{padding:1rem;gap:.8rem}
  .pu-barra-abajo .pu-btn{width:100%}
}