/* ═══════════════ FixorAssist — Motion ═══════════════ */

/* reveal on scroll */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .75s cubic-bezier(.22,.61,.36,1),transform .75s cubic-bezier(.22,.61,.36,1);transition-delay:var(--d,0s);will-change:opacity,transform}
.reveal.in-view{opacity:1;transform:none}
.reveal-left{opacity:0;transform:translateX(-40px);transition:opacity .8s cubic-bezier(.22,.61,.36,1),transform .8s cubic-bezier(.22,.61,.36,1);transition-delay:var(--d,0s)}
.reveal-left.in-view{opacity:1;transform:none}
.reveal-right{opacity:0;transform:translateX(40px);transition:opacity .8s cubic-bezier(.22,.61,.36,1),transform .8s cubic-bezier(.22,.61,.36,1);transition-delay:var(--d,0s)}
.reveal-right.in-view{opacity:1;transform:none}
.reveal-zoom{opacity:0;transform:scale(.92);transition:opacity .8s ease,transform .8s cubic-bezier(.22,.61,.36,1);transition-delay:var(--d,0s)}
.reveal-zoom.in-view{opacity:1;transform:none}

/* hero entrance */
.hero-copy .eyebrow,.hero-copy h1,.hero-copy p,.hero-copy .hero-actions,.hero-copy .hero-feats{opacity:0;transform:translateY(34px);animation:heroUp .85s cubic-bezier(.22,.61,.36,1) forwards}
.hero-copy h1{animation-delay:.12s}
.hero-copy p{animation-delay:.26s}
.hero-copy .hero-actions{animation-delay:.4s}
.hero-copy .hero-feats{animation-delay:.52s}
.hero-visual{animation:heroImg 1.2s ease forwards}
@keyframes heroUp{to{opacity:1;transform:none}}
@keyframes heroImg{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:none}}

/* floating elements */
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.float{animation:floaty 3.6s ease-in-out infinite}

/* pin bob */
@keyframes pinBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.one-pin,.pb-pin{animation:pinBob 2.6s ease-in-out infinite}
.one-pin.r{animation-delay:1.3s}

/* marching dashes on route lines */
@keyframes dashMove{to{stroke-dashoffset:-68}}
.route-line path,.one-wave path,.pb-wave path,.ps-wave path{animation:dashMove 3.2s linear infinite}

/* icon micro-interactions */
.em-circle,.why-circle,.trust-circle,.net-circle,.hs-circle,.care-circle,.wc-circle,.faq-ic,.step-ic{transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s}
.em-item:hover .em-circle,.why-card:hover .why-circle,.trust-item:hover .trust-circle,.net-card:hover .net-circle,.how-step:hover .hs-circle,.care-card:hover .care-circle,.wc-item:hover .wc-circle{transform:translateY(-6px) scale(1.06)}
.em-item:hover .em-circle{box-shadow:0 14px 30px rgba(225,24,30,.16)}
@keyframes wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg)}75%{transform:rotate(8deg)}}
.strip-item:hover .strip-ic,.af:hover .af-ic,.sc-items>div:hover .sc-ic,.ps-item:hover .ps-ic{animation:wiggle .5s ease}

/* button motion */
.btn{position:relative;overflow:hidden}
.btn .ic{transition:transform .3s ease}
.btn:hover .ic{transform:translateX(5px)}
.btn-red::after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.25),transparent);transform:skewX(-20deg);transition:left .55s ease}
.btn-red:hover::after{left:130%}
.net-link .ic{transition:transform .3s ease}
.net-link:hover .ic{transform:translateX(5px)}

/* number badges pop */
.num-badge{transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.why-card:hover .num-badge,.how-step:hover .num-badge,.sh:hover .num-badge{transform:scale(1.14)}

/* timeline dots pulse */
@keyframes pulse{0%{box-shadow:0 0 0 6px #fff,0 0 0 6px rgba(225,24,30,.35)}70%{box-shadow:0 0 0 6px #fff,0 0 0 18px rgba(225,24,30,0)}100%{box-shadow:0 0 0 6px #fff,0 0 0 18px rgba(225,24,30,0)}}
.steps-timeline .tl-dot{animation:pulse 2.4s ease-out infinite}
.tl-item:nth-child(3) .tl-dot{animation-delay:.4s}
.tl-item:nth-child(4) .tl-dot{animation-delay:.8s}
.tl-item:nth-child(5) .tl-dot{animation-delay:1.2s}

/* stat pop */
.pb-stat strong{display:inline-block}
.pop{animation:statPop .6s cubic-bezier(.34,1.56,.64,1)}
@keyframes statPop{0%{transform:scale(.4);opacity:0}100%{transform:scale(1);opacity:1}}

/* header shadow transition */
.site-header{transition:box-shadow .35s ease}

/* card photo zoom */
.net-photo{overflow:hidden;border-radius:16px 16px 0 0}
.net-photo img,.care-photo img,.step-photo img{transition:transform .6s ease}
.net-card:hover .net-photo img,.care-card:hover .care-photo img,.step-card:hover .step-photo img{transform:scale(1.06)}

/* emergency dial spin-in */
@keyframes dialIn{from{transform:rotate(-120deg) scale(.6);opacity:0}to{transform:rotate(0) scale(1);opacity:1}}
.hero-badge .hb-ic{animation:dialIn .9s .5s cubic-bezier(.22,.61,.36,1) backwards}

/* FAQ accordion */
.faq-item .faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.22,.61,.36,1)}
.faq-item .faq-a>div{overflow:hidden}
.faq-item.open .faq-a{grid-template-rows:1fr}
.faq-item .chev{transition:transform .4s ease}
.faq-item.open .chev{transform:rotate(180deg)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal,.reveal-left,.reveal-right,.reveal-zoom,.hero-copy .eyebrow,.hero-copy h1,.hero-copy p,.hero-copy .hero-actions,.hero-copy .hero-feats{opacity:1;transform:none}
}

/* ── mobile: horizontal reveals → vertical, to avoid off-screen overflow ── */
@media (max-width:820px){
  .reveal-left,.reveal-right{transform:translateY(30px)}
}