/* LemnaProt v25 · Ventana de preinscripción
   Se abre sola 0,5 s después de entrar (una vez por visita). Entrada suave:
   el fondo se desenfoca, la tarjeta sube flotando y el título aparece palabra por palabra
   (ideas de 21st.dev "Animated Dialog" y "Blur Out Up", escritas a mano).
   En celular es una hoja que sube desde abajo. */

.prein{all:unset;position:fixed;inset:0;z-index:1000;display:none;width:100%;height:100%;max-width:none;max-height:none;
  font-family:Inter,Schibsted,Arial,sans-serif;color:#2c371d}
.prein[open]{display:grid;place-items:center;padding:20px;box-sizing:border-box}
.prein::backdrop{background:rgba(44,55,29,0);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);transition:background .5s ease,backdrop-filter .5s ease}
.prein.in::backdrop{background:rgba(44,55,29,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
html.prein-open{overflow:hidden}

.prein-card{position:relative;width:min(500px,100%);max-height:calc(100dvh - 40px);overflow:auto;overscroll-behavior:contain;
  background:#f4f0e9;border-radius:26px;box-shadow:0 40px 100px -30px rgba(20,26,12,.55),0 0 0 1px rgba(44,55,29,.08);
  opacity:0;transform:translateY(34px) scale(.965);filter:blur(6px);
  transition:opacity .55s cubic-bezier(.2,.8,.2,1),transform .75s cubic-bezier(.16,1.12,.3,1),filter .55s ease}
.prein.in .prein-card{opacity:1;transform:none;filter:none}
.prein.out .prein-card{opacity:0;transform:translateY(24px) scale(.98);filter:blur(4px);transition-duration:.28s}
.prein.out::backdrop{background:rgba(44,55,29,0);backdrop-filter:blur(0)}

.prein-body{padding:38px 34px 26px;position:relative}

/* Lemna flotando en la esquina */
.prein-lemna{position:absolute;top:-6px;right:44px;width:150px;height:112px;pointer-events:none;overflow:visible}
.prein-lemna .fr ellipse{fill:#b6cf59;stroke:#909d65;stroke-width:1}
.prein-lemna .fr path{fill:none;stroke:#5e6f3a;stroke-width:1;stroke-linecap:round;opacity:.55}
.prein-lemna .f1{transform:translate(96px,52px) rotate(-14deg)}
.prein-lemna .f2{transform:translate(122px,66px) rotate(22deg)}
.prein-lemna .f3{transform:translate(110px,36px) rotate(48deg)}
.prein-lemna .rip{fill:none;stroke:#909d65;stroke-width:1;opacity:0;transform-origin:104px 58px}
.prein.in .prein-lemna .fr{animation:pr-drop .9s cubic-bezier(.2,.9,.25,1.15) both,pr-float 6s ease-in-out 1.1s infinite}
.prein.in .prein-lemna .f2{animation-delay:.12s,1.3s}
.prein.in .prein-lemna .f3{animation-delay:.24s,1.5s}
.prein.in .prein-lemna .rip{animation:pr-rip 1.6s ease-out .35s both}
@keyframes pr-drop{from{opacity:0;translate:0 -18px;scale:.6}to{opacity:1;translate:0 0;scale:1}}
@keyframes pr-float{0%,100%{translate:0 0}50%{translate:2px -3px}}
@keyframes pr-rip{0%{opacity:.7;transform:scale(.3)}100%{opacity:0;transform:scale(2.4)}}

/* X de cerrar: clara y fácil de tocar */
.prein-close{position:absolute;top:14px;right:14px;z-index:3;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  background:#2c371d;color:#f4f0e9;border:0;cursor:pointer;transition:transform .2s ease,background .2s ease}
.prein-close svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;stroke-linecap:round;fill:none}
.prein-close:hover{transform:rotate(90deg);background:#5e6f3a}
.prein-close:focus-visible,.prein-send:focus-visible,.prein-skip:focus-visible{outline:2px solid #5e6f3a;outline-offset:3px}

.prein-k{font-family:'Space Mono',Plex,monospace;font-size:11px;letter-spacing:.14em;color:#5e6f3a;margin:0 0 14px}
.prein-title{font-family:Satoshi,Archivo,Arial,sans-serif;font-weight:300;font-size:clamp(34px,8vw,46px);line-height:1.04;letter-spacing:-.01em;margin:0 0 14px;color:#2c371d;text-transform:none}
.prein-title em{font-style:italic;color:#5e6f3a}
.prein-title .w{display:inline-block}
.prein.in .prein-title .w{animation:pr-word .7s cubic-bezier(.2,.8,.2,1) both}
.prein.in .prein-title .w:nth-child(1){animation-delay:.18s}
.prein.in .prein-title .w:nth-child(2){animation-delay:.24s}
.prein.in .prein-title .w:nth-child(3){animation-delay:.30s}
.prein.in .prein-title .w:nth-child(4){animation-delay:.38s}
@keyframes pr-word{from{opacity:0;filter:blur(8px);transform:translateY(12px)}to{opacity:1;filter:none;transform:none}}
.prein-p{font-size:15px;line-height:1.55;color:#2c371d;opacity:.82;margin:0 0 22px;max-width:40ch}

.prein form{display:grid;gap:12px}
.prein .fld{display:grid;gap:6px}
.prein .fld>span{font-family:'Space Mono',Plex,monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#5e6f3a}
.prein .fld input{font:inherit;font-size:16px;color:#2c371d;background:#fff;border:1px solid rgba(44,55,29,.18);border-radius:14px;padding:13px 15px;outline:none;transition:border-color .2s,box-shadow .2s}
.prein .fld input::placeholder{color:#909d65;opacity:.9}
.prein .fld input:focus{border-color:#5e6f3a;box-shadow:0 0 0 4px rgba(182,207,89,.35)}
.prein-check{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start;font-size:13px;line-height:1.45;color:#2c371d;opacity:.85;margin-top:2px;cursor:pointer}
.prein-check input{width:18px;height:18px;margin:1px 0 0;accent-color:#5e6f3a}
.prein-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

.prein-send{display:inline-flex;align-items:center;justify-content:center;gap:10px;margin-top:6px;padding:15px 26px;border-radius:999px;border:0;
  background:#2c371d;color:#f4f0e9;font:500 15px/1 Inter,Schibsted,Arial,sans-serif;cursor:pointer;text-decoration:none;
  transition:background .25s ease,transform .25s ease}
.prein-send:hover{background:#5e6f3a;transform:translateY(-1px)}
.prein-send[disabled]{opacity:.6;cursor:wait}
.prein form .prein-send{width:100%}

.prein-skip{display:block;margin:14px auto 0;background:none;border:0;padding:8px;font:500 14px Inter,Schibsted,Arial,sans-serif;color:#5e6f3a;
  text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(94,111,58,.4);cursor:pointer}
.prein-skip:hover{color:#2c371d}
.prein-msg{min-height:0;margin:10px 0 0;font-size:14px;text-align:center;color:#5e6f3a}
.prein-msg:empty{display:none}
.prein-msg.err{color:#8a3b1d}
.prein-foot{font-family:'Space Mono',Plex,monospace;font-size:9.5px;letter-spacing:.14em;color:#909d65;text-align:center;margin:12px 0 0}

/* Éxito */
.prein-ok{text-align:left;padding-top:6px}
.prein-ok .ok-ico{width:52px;height:52px;margin-bottom:16px}
.prein-ok .ok-ico circle{fill:#b6cf59;opacity:.45}
.prein-ok .ok-ico path{fill:none;stroke:#2c371d;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40;animation:pr-check .6s .15s ease-out forwards}
@keyframes pr-check{to{stroke-dashoffset:0}}
.prein-ok .prein-send{margin-top:4px}
.prein.done .prein-k,.prein.done #prein-title,.prein.done #prein-desc{display:none}

/* Celular: hoja que sube desde abajo */
@media (max-width:640px){
  .prein[open]{place-items:end center;padding:0}
  .prein-card{width:100%;max-height:94dvh;border-radius:26px 26px 0 0;transform:translateY(100%);filter:none;
    transition:opacity .35s ease,transform .6s cubic-bezier(.2,1,.3,1)}
  .prein.in .prein-card{transform:none}
  .prein.out .prein-card{transform:translateY(100%);opacity:1}
  .prein-card:before{content:"";position:absolute;top:9px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:4px;background:rgba(44,55,29,.18)}
  .prein-body{padding:34px 22px calc(18px + env(safe-area-inset-bottom))}
  .prein-lemna{right:40px;width:120px;height:90px}
  .prein-title{font-size:36px}
  .prein-p{font-size:14px;margin-bottom:16px}
}

@media (prefers-reduced-motion:reduce){
  .prein-card,.prein::backdrop{transition:opacity .2s!important;transform:none!important;filter:none!important}
  .prein *{animation:none!important}
  .prein-ok .ok-ico path{stroke-dashoffset:0}
}

/* Ajustes */
.prein [hidden]{display:none!important}
.prein .prein-title .w{color:#2c371d}
.prein .prein-title em{color:#5e6f3a}
.prein-card:focus{outline:none}
.prein-lemna{right:66px}
@media (max-width:640px){.prein-lemna{right:62px}}