/* =========================================================
   GUOBAILING — motion layer for the ALUFIRE structure
   loader · smooth scroll · split-text reveal · parallax ·
   magnetic buttons · custom cursor · scroll progress ·
   project compare easing · menu stagger
   ========================================================= */

/* ---------- scroll progress ---------- */
.progress{position:fixed;left:0;top:0;height:2px;width:0;background:var(--red);z-index:190;pointer-events:none;transition:width .1s linear}

/* ---------- preloader ---------- */
.preloader{position:fixed;inset:0;z-index:300;background:#0E0E0D;color:#fff;display:grid;place-items:center;transition:clip-path 1s cubic-bezier(.76,0,.24,1);clip-path:inset(0 0 0 0)}
.preloader.done{clip-path:inset(0 0 100% 0)}
.preloader .inner{text-align:center;transition:opacity .5s ease,transform .8s cubic-bezier(.76,0,.24,1)}
.preloader.done .inner{opacity:0;transform:translateY(-30px)}
.preloader .lg{font-size:clamp(20px,2vw,30px);letter-spacing:.18em;text-transform:uppercase;color:var(--red);font-weight:700}
.preloader .ct{margin-top:18px;font-size:11px;letter-spacing:.3em;color:rgba(255,255,255,.55)}
.preloader .bar{margin:22px auto 0;width:180px;height:1px;background:rgba(255,255,255,.18);overflow:hidden}
.preloader .bar i{display:block;height:100%;width:0;background:var(--red);transition:width .2s linear}

/* ---------- split text reveal ---------- */
.w{display:inline-block;overflow:hidden;vertical-align:bottom}
.i{display:inline-block;transform:translateY(115%);transition:transform .95s cubic-bezier(.22,.7,.18,1)}
.in .i{transform:none}

.split .line{display:block;overflow:hidden}
.split .line>span{display:block;transform:translateY(110%);transition:transform 1s cubic-bezier(.22,.7,.18,1)}
.split.in .line>span{transform:none}
.split .line:nth-child(2)>span{transition-delay:.08s}
.split .line:nth-child(3)>span{transition-delay:.16s}

/* ---------- hero panel lines ---------- */
.hero-panel .line{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform .9s cubic-bezier(.22,.7,.18,1)}
.hero-panel .line:nth-child(2){transition-delay:.12s}
body.loaded .hero-panel .line{opacity:1;transform:none}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.22,.7,.18,1),transform .9s cubic-bezier(.22,.7,.18,1)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}

/* ---------- cursor ---------- */
.cursor,.cursor-ring{position:fixed;left:0;top:0;pointer-events:none;z-index:400;border-radius:50%;mix-blend-mode:difference}
.cursor{width:6px;height:6px;background:#fff;transform:translate(-50%,-50%)}
.cursor-ring{width:34px;height:34px;border:1px solid #fff;transform:translate(-50%,-50%);transition:width .25s ease,height .25s ease,opacity .25s ease;opacity:.6}
body.hovering .cursor-ring{width:64px;height:64px;opacity:1}
body.hovering .cursor{width:4px;height:4px}
@media (hover:none){.cursor,.cursor-ring{display:none}}

/* ---------- magnetic buttons ---------- */
.magnetic{transition:transform .25s cubic-bezier(.22,.7,.18,1)}
.btn,.tf,.hold{position:relative;overflow:hidden}
.btn::after,.tf::after,.allnews::after{content:"";position:absolute;inset:0;background:currentColor;opacity:.12;transform:translateY(101%);transition:transform .5s cubic-bezier(.76,0,.24,1)}
.btn:hover::after,.tf:hover::after,.allnews:hover::after{transform:translateY(0)}
.btn>*,.tf>*,\.allnews>*{position:relative;z-index:2}

/* ---------- hero ---------- */
.hero-media img{animation:kenburns 22s ease-out infinite alternate}
@keyframes kenburns{from{transform:scale(1.06) translate3d(0,0,0)}to{transform:scale(1.14) translate3d(-1.5%,-1.2%,0)}}
.hero-copy h1 span.line>span{transition-duration:1.1s}
body.loaded .hero-copy h1 .line>span{transform:none}
.hero-copy h1 .line>span{transform:translateY(110%)}
.hero-copy .k,.hero-copy .arrow{opacity:0;transform:translateY(14px);transition:opacity .9s ease .35s,transform .9s cubic-bezier(.22,.7,.18,1) .35s}
body.loaded .hero-copy .k,body.loaded .hero-copy .arrow{opacity:1;transform:none}

/* ---------- parallax targets ---------- */
[data-parallax]{will-change:transform}

/* ---------- featured panel ---------- */
.featured .panel{transition:transform 1.1s cubic-bezier(.22,.7,.18,1)}
.featured .panel .art{transition:transform 1.4s cubic-bezier(.22,.7,.18,1),opacity 1.2s ease}
.featured .panel:hover .art{transform:scale(1.06);opacity:.2}

/* ---------- project hold ---------- */
.project .hold{transition:transform .3s cubic-bezier(.22,.7,.18,1),background .3s ease,border-color .3s ease}
.project .hold:hover{transform:translate(-50%,-50%) scale(1.06);border-color:var(--red);background:rgba(243,120,77,.16)}
.project .hold.active{background:var(--red);border-color:var(--red)}
.project .top{transition:clip-path .12s linear}

/* ---------- rail ---------- */
.rail a svg{transition:transform .35s cubic-bezier(.22,.7,.18,1),color .25s ease}
.rail a:hover svg{transform:translateY(-2px) scale(1.08)}
.rail .menu b{transition:transform .35s cubic-bezier(.22,.7,.18,1)}
.rail .menu:hover b{transform:translateX(2px)}

/* ---------- modal ---------- */
.modal{opacity:0;visibility:hidden;transform:translateY(16px);transition:opacity .45s ease,transform .6s cubic-bezier(.22,.7,.18,1),visibility .45s}
.modal.on{opacity:1;visibility:visible;transform:none;display:block}
.modal .row{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .7s cubic-bezier(.22,.7,.18,1)}
.modal.on .row{opacity:1;transform:none}
.modal.on .row:nth-child(1){transition-delay:.08s}
.modal.on .row:nth-child(2){transition-delay:.16s}
.modal.on .row:nth-child(3){transition-delay:.24s}

/* ---------- images / hover ---------- */
.hero-panel .line img,.about-media img,.project>img{transition:transform 1.2s cubic-bezier(.22,.7,.18,1),filter .6s ease}
.hero-panel .line:hover img{transform:scale(1.045)}
.hero-panel .line h3,.trust h3,.news h3{transition:color .3s ease}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .hero-media img{animation:none}
  .preloader{display:none}
  .rv,.split .line>span,.hero-copy .k,.hero-copy .arrow{opacity:1;transform:none;transition:none}
  .cursor,.cursor-ring{display:none}
}

/* Low-end devices can keep the core reveals while skipping continuous effects. */
body.low-performance .hero-media img{animation:none}
body.low-performance [data-parallax]{will-change:auto}
body.no-motion *,body.no-motion *::before,body.no-motion *::after{
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important;
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  .hero-media img{animation:none}
}