/* SiempreIA · efectos de scroll "wow" (bandeja que se limpia, página que se arma sola, recorrido por el depa) */

/* ============ 1) BANDEJA: Emilio limpia ============ */
#orden .wash{display:none}
.scr-w{position:relative}
#orden .order{will-change:clip-path}
.debris{position:absolute;inset:0;z-index:4;pointer-events:none}
.debris .dbn{position:absolute;min-width:22px;height:22px;border-radius:11px;background:var(--bad);color:#fff;font-weight:700;font-size:11.5px;display:grid;place-items:center;padding:0 6px;font-family:var(--body);box-shadow:0 0 0 3px rgba(239,68,68,.18);will-change:translate,rotate,opacity}
.debris .dbn.big{min-width:30px;height:26px;border-radius:13px;font-weight:800;font-size:13px}
.debris .float-n{animation:popn 2.6s infinite;will-change:translate,rotate,opacity}
.debris .float-n:nth-of-type(2){animation-delay:.6s}.debris .float-n:nth-of-type(3){animation-delay:1.2s}
.swp{position:absolute;top:-12%;height:124%;left:0;width:0;z-index:6;pointer-events:none;opacity:0;will-change:transform}
.swp-b{position:absolute;inset:0 auto 0 -3px;width:6px;border-radius:6px;background:linear-gradient(180deg,transparent,#fff 12%,#fff 88%,transparent);box-shadow:0 0 14px 4px rgba(196,181,253,.95),0 0 60px 16px rgba(139,92,246,.55)}
.swp-sh{position:absolute;top:0;bottom:0;right:0;width:150px;background:linear-gradient(90deg,transparent,rgba(196,181,253,.10) 55%,rgba(233,213,255,.38));mix-blend-mode:screen}
.swp-h{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:7px;padding:7px 12px 7px 8px;border-radius:999px;background:linear-gradient(110deg,#6D28D9,#8B5CF6 55%,#EC4899);box-shadow:0 10px 30px -6px rgba(139,92,246,.9),0 0 0 1px rgba(255,255,255,.35) inset;white-space:nowrap}
.swp-h img{width:30px;height:auto;display:block;filter:drop-shadow(0 0 6px rgba(255,255,255,.6)) brightness(1.4)}
.swp-h b{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;color:#fff}
.swp i{position:absolute;left:0;width:6px;height:6px;margin:-3px;border-radius:50%;background:#fff;box-shadow:0 0 10px 3px rgba(233,213,255,.9);animation:spk 1.1s ease-out infinite}
@keyframes spk{0%{transform:translate(0,0) scale(1);opacity:1}100%{transform:translate(var(--sx),var(--sy)) scale(.2);opacity:0}}
.foam{position:absolute;right:6px;width:var(--s);height:var(--s);border-radius:50%;border:1.5px solid rgba(233,213,255,.7);background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.55),rgba(196,181,253,.08) 60%);animation:foam 1.6s ease-out infinite}
@keyframes foam{0%{transform:translate(0,0) scale(.4);opacity:0}20%{opacity:1}100%{transform:translate(-70px,var(--fy)) scale(1);opacity:0}}
/* medidor tipo "limpieza 100%" */
.odial{position:absolute;right:-18px;top:-22px;z-index:9;width:96px;height:96px;border-radius:50%;background:radial-gradient(circle,#15111f 58%,#0b0912 60%);box-shadow:0 18px 40px -10px #000,0 0 0 1px rgba(255,255,255,.12);display:grid;place-items:center;text-align:center;pointer-events:none;transition:box-shadow .5s,transform .5s cubic-bezier(.2,1.6,.3,1)}
.odial svg{position:absolute;inset:6px;width:calc(100% - 12px);height:calc(100% - 12px);transform:rotate(-90deg)}
.odial circle{fill:none;stroke-width:7;stroke-linecap:round}
.odial .bgc{stroke:rgba(255,255,255,.08)}
.odial b{display:block;font-family:var(--disp);font-weight:800;font-size:23px;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.odial small{display:block;font-family:var(--mono);font-size:7.5px;letter-spacing:.16em;color:var(--mut);margin-top:3px}
#orden.done .odial{transform:scale(1.12);box-shadow:0 18px 40px -10px #000,0 0 0 1px rgba(134,239,172,.5),0 0 40px rgba(34,197,94,.45)}
@media(max-width:700px){.odial{width:78px;height:78px;right:-8px;top:-16px}.odial b{font-size:19px}.odial small{font-size:6.5px}.swp-h{padding:6px 10px 6px 7px}.swp-h img{width:24px}.swp-h b{font-size:9px}}

/* ============ 2) PIZZERÍA: la página se arma sola ============ */
#paginas-pin{height:480vh}
#paginas-pin .bw .wash{display:none}
#paginas-pin .neu{clip-path:none;z-index:1}
#paginas-pin .old{z-index:3;transition:background-color .2s}
#paginas-pin .old>*,#paginas-pin .old .bd>*>*{will-change:translate,rotate}
.pg-step{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;padding:7px 14px 7px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04)}
.pg-step b{display:grid;place-items:center;min-width:26px;height:26px;padding:0 6px;border-radius:999px;background:#fff;color:#000;font-weight:700;letter-spacing:0;transition:background .4s,color .4s}
.pg-step.go b{background:linear-gradient(110deg,var(--p2),var(--pk));color:#fff}
.pg-step span{transition:opacity .25s,transform .25s}
.pg-step span.sw{opacity:0;transform:translateY(6px)}
.pg-step .bar{width:64px;height:3px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.pg-step .bar i{display:block;height:100%;width:100%;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,var(--p2),var(--pk))}
/* planos */
.bp{position:absolute;inset:36px 0 0 0;z-index:2;pointer-events:none;opacity:0}
.bp-grid{position:absolute;inset:0;background:
  linear-gradient(rgba(125,211,252,.13) 1px,transparent 1px) 0 0/24px 24px,
  linear-gradient(90deg,rgba(125,211,252,.13) 1px,transparent 1px) 0 0/24px 24px,
  linear-gradient(rgba(125,211,252,.22) 1px,transparent 1px) 0 0/120px 120px,
  linear-gradient(90deg,rgba(125,211,252,.22) 1px,transparent 1px) 0 0/120px 120px,
  radial-gradient(circle at 50% 40%,#0b2a4a,#061428 70%)}
.bp svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.bp rect{fill:rgba(125,211,252,.05);stroke:#7DD3FC;stroke-width:1.5;stroke-dasharray:var(--L) var(--L);vector-effect:non-scaling-stroke}
.bp text{font-family:var(--mono);font-size:10px;letter-spacing:.14em;fill:#BAE6FD}
.bp .ms{stroke:rgba(186,230,253,.55);stroke-width:1;stroke-dasharray:3 3}
.bp-scan{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#7DD3FC,transparent);box-shadow:0 0 18px 2px rgba(125,211,252,.7)}
/* palabra grande de cada paso */
.bcap{position:absolute;inset:36px 0 0 0;z-index:5;display:grid;place-items:center;pointer-events:none;text-align:center;padding:0 16px}
.bcap b{font-family:var(--disp);font-weight:800;font-style:italic;font-size:clamp(40px,9vw,120px);letter-spacing:-.06em;line-height:.9;color:#fff;text-shadow:0 0 40px rgba(139,92,246,.8),0 10px 40px rgba(0,0,0,.6);opacity:0}
.bcap b em{font-style:italic;background:linear-gradient(100deg,#C4B5FD,#F472B6);-webkit-background-clip:text;background-clip:text;color:transparent}
/* piezas de la página nueva */
#paginas-pin .nph{will-change:clip-path}
#paginas-pin .nph img{transition:none}
#paginas-pin .neu .nn,#paginas-pin .htx>*,#paginas-pin .cta span,#paginas-pin .resv,#paginas-pin .wid i,#paginas-pin .wid span{will-change:translate,opacity}
.neu h4{perspective:600px}
.neu h4 .fw{display:inline-block;background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#fff;transform-origin:50% 100%;will-change:transform,opacity}
.neu h4 .gw{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;color:#fff!important}
.neu h4 .fw.g{background:linear-gradient(100deg,#FDE68A,#F59E0B 50%,#EF4444);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.04em}
#paginas-pin .resv{animation:none}
#paginas-pin .resv div span{transition:background .3s,color .3s}
#paginas-pin .resv b{transition:background .4s}
#paginas-pin .resv.ok b{background:linear-gradient(110deg,#22C55E,#16A34A)}
.wid .wring{position:absolute;right:0;bottom:0;width:46px;height:46px;border-radius:50%;border:2px solid #C4B5FD;opacity:0;pointer-events:none}
.wid.ping .wring{animation:wring 1.4s ease-out infinite}
@keyframes wring{from{transform:scale(1);opacity:.9}to{transform:scale(2.2);opacity:0}}
.ptoast{position:absolute;left:50%;top:8px;z-index:4;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:16px;background:rgba(255,255,255,.96);color:#111;font-size:12.5px;box-shadow:0 20px 40px -12px rgba(0,0,0,.7);white-space:nowrap;opacity:0;translate:-50% -30px}
.ptoast i{font-style:normal;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,#6D28D9,#EC4899);font-size:15px}
.ptoast small{display:block;font-size:10.5px;color:#6b7280}
.fxm .nph,.fxm .nph img,.fxm .nn,.fxm .htx>*,.fxm .cta span,.fxm .resv,.fxm .wid,.fxm .wid i,.fxm .wid span,.fxm .nscroll{translate:none!important;rotate:none!important;scale:none!important;clip-path:none!important;animation:none!important;transform:none!important}
@media(max-width:700px){
  #paginas-pin .nhero .resv{display:grid;left:auto;right:10px;bottom:auto;top:62px;transform:none;padding:9px 10px;gap:6px;font-size:11px}
  #paginas-pin .resv div span{padding:4px 7px}
  #paginas-pin .neu .wid span{display:block;font-size:11px;max-width:150px;white-space:nowrap;overflow:hidden}
  #paginas-pin .nhero .hh{padding-bottom:70px}
  .pg-step{font-size:10.5px;gap:8px}.pg-step .bar{width:40px}
  .bp text{font-size:8.5px}
  .ptoast{top:6px;font-size:11.5px}
}

/* ============ 3) DEPA: caminar cuarto por cuarto ============ */
#casa{height:520vh}
#casa .ph-room{transform-origin:50% 58%;will-change:transform,clip-path}
#casa .ph-room img{will-change:filter}
.door{position:absolute;z-index:2;pointer-events:none;border:7px solid #2b2119;border-radius:8px;box-shadow:inset 0 0 0 2px rgba(255,236,200,.35),inset 0 0 40px rgba(0,0,0,.55),0 0 0 2px rgba(0,0,0,.4),0 30px 60px -20px #000;opacity:0}
.door:after{content:"";position:absolute;inset:-7px;border-radius:8px;background:linear-gradient(90deg,rgba(255,236,200,.18),transparent 12%,transparent 88%,rgba(255,236,200,.18))}
.plano{position:absolute;right:14px;top:14px;z-index:4;width:132px;padding:8px 8px 6px;border-radius:14px;background:rgba(10,8,20,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14);opacity:0;transition:opacity .5s}
.plano.on{opacity:1}
.plano small{display:block;font-family:var(--mono);font-size:8.5px;letter-spacing:.18em;color:var(--p3);margin:0 0 4px 2px}
.plano svg{display:block;width:100%;height:auto}
.plano rect{fill:rgba(255,255,255,.03);stroke:rgba(255,255,255,.35);stroke-width:1;transition:fill .4s,stroke .4s}
.plano rect.on{fill:rgba(139,92,246,.35);stroke:#C4B5FD}
.plano text{font-family:var(--mono);font-size:7px;fill:rgba(255,255,255,.75);letter-spacing:.05em}
.plano .trail{fill:none;stroke:#F0ABFC;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.plano .dot{fill:#fff;filter:drop-shadow(0 0 4px #F0ABFC)}
.plano .dotr{fill:none;stroke:#F0ABFC;stroke-width:1.5;animation:pr 1.4s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes pr{from{transform:scale(1);opacity:1}to{transform:scale(3);opacity:0}}
.room-t b.lt{transition:none}
.room-t b .ch{display:inline-block;transform:translateY(105%);opacity:0;transition:transform .55s cubic-bezier(.16,1,.3,1),opacity .4s}
.room-t b.in .ch{transform:none;opacity:1}
.room-t b{overflow:hidden;padding-bottom:.06em}
@media(max-width:700px){.plano{width:104px;right:10px;top:54px;padding:6px 6px 4px}.plano small{font-size:7px}}
