/* ===== Nubebe — immersive layer (preloader, cursor, 3D hero, motion) ===== */

/* Preloader */
body.is-loading{overflow:hidden}
.preloader{position:fixed;inset:0;z-index:9999;background:#f7f9fc;display:grid;place-items:center;transition:opacity .8s ease,visibility .8s ease}
.preloader.done{opacity:0;visibility:hidden}
.preloader__inner{text-align:center;width:min(300px,72vw)}
.preloader__logo{height:56px;width:auto;margin:0 auto 24px;animation:pl-float 2.4s ease-in-out infinite}
@keyframes pl-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.preloader__bar{height:3px;background:#dde6f1;border-radius:3px;overflow:hidden}
.preloader__fill{height:100%;width:0%;background:linear-gradient(90deg,#1597e5,#4b5a7e)}
.preloader__pct{margin-top:13px;font-size:.74rem;letter-spacing:.26em;color:#697086;font-weight:600}

/* Cursor nativo del sistema (visible siempre); solo tintamos el caret */
@media (pointer:fine){
  input,textarea{caret-color:#1597e5}
}

/* 3D hero canvas (metallic silk shader) */
.hero{overflow:hidden}
.hero__in{position:relative;z-index:2}
.hero__badge,.hero__frame{z-index:3}

/* reveal helpers used by GSAP */
.will-reveal{opacity:0}

@media (prefers-reduced-motion: reduce){
  .preloader__logo{animation:none}
}