/* ═══ PROVENNCE STUDIO — studio-fx.css (estilos de los trucos) ═══ */

/* 1 · GRANO */
.fx-grain{position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.5;
  mix-blend-mode:overlay;background-repeat:repeat}

/* 2 · CURSOR PROPIO */
.fx-has-cursor,.fx-has-cursor *{cursor:none!important}
.fx-cur-dot,.fx-cur-ring{position:fixed;top:0;left:0;z-index:10000;pointer-events:none;
  border-radius:50%;will-change:transform;margin-left:-4px;margin-top:-4px}
.fx-cur-dot{width:8px;height:8px;background:var(--st,#00E58A)}
.fx-cur-ring{width:38px;height:38px;margin-left:-19px;margin-top:-19px;
  border:1.5px solid var(--st,#00E58A);transition:opacity .25s;mix-blend-mode:difference}
.fx-cur-ring.down{width:30px;height:30px}
@media (hover:none){.fx-cur-dot,.fx-cur-ring{display:none}}

/* 3 · BARRIDO DE LUZ */
.fx-sweep{position:relative;overflow:hidden;isolation:isolate}
.fx-sweep::after{content:'';position:absolute;top:0;left:-120%;width:60%;height:100%;z-index:1;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);transition:none;pointer-events:none;opacity:0}
.fx-sweep:hover::after,.fx-sweep.fx-sweep-go::after{opacity:1;left:130%;
  transition:left .8s cubic-bezier(.16,1,.3,1),opacity .1s}

/* 4 · STICKY-STACKING */
[data-stack]{position:relative}
.fx-stack-card{position:sticky;top:14vh;transform-origin:center top;
  transition:transform .5s cubic-bezier(.16,1,.3,1),filter .5s;will-change:transform}

/* 5 · DISTORSIÓN LÍQUIDA */
.fx-liquid-on{position:relative}
.fx-liquid-on>img{opacity:0}
.fx-liquid-cv{position:absolute;inset:0;width:100%;height:100%;display:block;border-radius:inherit}

/* 6 · VISOR 360 */
[data-spin]{position:relative;aspect-ratio:1/1;max-width:640px;margin:0 auto;cursor:grab;
  touch-action:pan-y;border-radius:24px;overflow:hidden;
  background:radial-gradient(circle at 50% 42%,rgba(0,229,138,.08),transparent 60%)}
[data-spin]:active{cursor:grabbing}
.fx-spin-cv{width:100%;height:100%;display:block;filter:drop-shadow(0 24px 34px rgba(0,0,0,.45))}
.fx-spin-hint{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);
  font:600 10px/1 ui-monospace,'JetBrains Mono',monospace;letter-spacing:.14em;color:#7d8f87;
  background:rgba(6,12,9,.6);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.1);
  border-radius:99px;padding:8px 14px;transition:opacity .4s}
.fx-spin-touched .fx-spin-hint{opacity:0}

/* 7 · FÍSICA */
[data-physics]{position:relative;overflow:hidden;touch-action:none}
.fx-phys-obj{position:absolute;top:0;left:0;will-change:transform;user-select:none;
  -webkit-user-drag:none;filter:drop-shadow(0 12px 18px rgba(0,0,0,.35));cursor:grab}
.fx-phys-obj:active{cursor:grabbing}

/* 8 · TRANSICIONES ENTRE PÁGINAS */
.fx-trans{position:fixed;inset:0;z-index:10001;pointer-events:none;transform:translateY(100%);
  background:linear-gradient(160deg,#04140d,#00251a);}
.fx-trans-out .fx-trans{transform:translateY(0);transition:transform .5s cubic-bezier(.7,0,.3,1)}
.fx-trans-in .fx-trans{transform:translateY(-100%);transition:transform .6s cubic-bezier(.16,1,.3,1)}

@media (prefers-reduced-motion:reduce){
  .fx-grain,.fx-cur-dot,.fx-cur-ring,.fx-trans{display:none!important}
  .fx-stack-card{position:static;transform:none!important;filter:none!important}
}
