/* ══ Rivonte · motion pack para páginas de serviço (carregar depois de services-v2.css) ══ */

/* fundo do hero: grelha + orbes */
.sv-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.sv-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 40%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse 70% 70% at 50% 40%,#000 30%,transparent 75%);animation:svGridMove 18s linear infinite}
@keyframes svGridMove{to{background-position:56px 56px,56px 56px}}
.sv-orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;display:block}
.sv-orb-a{width:520px;height:520px;left:-140px;top:-120px;background:radial-gradient(circle,rgba(217,118,46,.55),transparent 65%);animation:svDriftA 16s ease-in-out infinite alternate}
.sv-orb-b{width:460px;height:460px;right:-120px;bottom:-160px;background:radial-gradient(circle,rgba(37,99,235,.35),transparent 65%);animation:svDriftB 20s ease-in-out infinite alternate}
@keyframes svDriftA{to{transform:translate(120px,90px) scale(1.15)}}
@keyframes svDriftB{to{transform:translate(-140px,-80px) scale(1.1)}}
.pg-hero>.pg-hero-inner{position:relative;z-index:1}

/* título palavra a palavra + brilho no destaque */
.sv-w{display:inline-block;opacity:0;transform:translateY(28px) rotate(2deg);animation:svWordIn .7s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes svWordIn{to{opacity:1;transform:none}}
.pg-hero-title em{background:linear-gradient(100deg,var(--gold) 0%,#F5B876 45%,var(--gold) 60%,#F5B876 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:svShine 4s linear infinite;letter-spacing:normal;padding-right:0.14em;margin-right:-0.14em}
@keyframes svShine{to{background-position:-220% 0}}
/* o <em> precisa de mais especificidade que ".pg-hero-title em" para o fade-in não perder para o brilho */
.pg-hero-title em.sv-w{opacity:0;transform:translateY(28px) rotate(2deg);animation:svWordIn .7s cubic-bezier(.2,.8,.2,1) forwards,svShine 4s linear infinite}
.pg-hero-sub,.pg-hero-ctas,.sv-hero-badges,.hero-stats-row,.pg-hero-service,.pg-hero .hero-eyebrow{animation:svFadeUp .8s cubic-bezier(.2,.8,.2,1) both}
.pg-hero .hero-eyebrow{animation-delay:.05s}.pg-hero-service{animation-delay:.15s}.pg-hero-sub{animation-delay:.55s}.pg-hero-ctas{animation-delay:.7s}.sv-hero-badges{animation-delay:.85s}.hero-stats-row{animation-delay:1s}
@keyframes svFadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

/* formulário com borda luminosa rotativa */
.sv-glow{position:relative;border-radius:22px;padding:2px;overflow:hidden;animation:svFadeUp .9s .35s both;isolation:isolate}
.sv-glow::before{content:"";position:absolute;inset:-60%;background:conic-gradient(from 0deg,transparent 0 62%,rgba(217,118,46,.15) 72%,var(--gold) 82%,#F5B876 88%,transparent 96%);animation:svSpin 5s linear infinite;z-index:0}
.sv-glow::after{content:"";position:absolute;inset:2px;border-radius:20px;background:#F0F4F8;z-index:0}
.sv-glow>.contact-form-box{position:relative;z-index:1;border:0!important}
@keyframes svSpin{to{transform:rotate(360deg)}}

/* botões magnéticos */
.pg-hero-ctas a{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s;will-change:transform}
.pg-hero-ctas .btn-slide:not(.btn-slide-wa){box-shadow:0 10px 30px rgba(217,118,46,.35)}
.pg-hero-ctas .btn-slide:not(.btn-slide-wa):hover{box-shadow:0 16px 40px rgba(217,118,46,.5)}

/* demo: ecrã com tilt, tabs com progresso, bob suave */
.sv-screen-wrap{perspective:1200px}
.sv-screen{position:relative;transform-style:preserve-3d;transition:transform .35s ease,box-shadow .35s ease;animation:svBob 6s ease-in-out infinite}
@keyframes svBob{0%,100%{translate:0 0}50%{translate:0 -8px}}
.sv-screen::after{content:"";position:absolute;left:0;right:0;top:0;height:40%;background:linear-gradient(180deg,rgba(255,255,255,.05),transparent);pointer-events:none}
.sv-tab{position:relative;overflow:hidden}
.sv-tab.active::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:#1a1204;opacity:.5;animation:svTabBar 6s linear forwards}
@keyframes svTabBar{to{width:100%}}
.sv-msg.user{animation:svPop .4s cubic-bezier(.2,.8,.2,1) both}
@keyframes svPop{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}

/* cartões com tilt 3D + ícone que salta + brilho a seguir o rato */
.sv-grid{perspective:1400px}
.sv-card{transform-style:preserve-3d;will-change:transform}
.sv-card:hover .sv-card-icon{animation:svIcon .5s cubic-bezier(.2,.8,.2,1)}
@keyframes svIcon{0%{transform:scale(1)}40%{transform:scale(1.18) rotate(-6deg)}100%{transform:scale(1)}}
.sv-card-shine{position:absolute;inset:0;background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),rgba(217,118,46,.14),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.sv-card:hover .sv-card-shine{opacity:1}

/* marquee de palavras-chave */
.sv-marquee{background:#fff;border-top:1px solid rgba(20,20,20,.08);border-bottom:1px solid rgba(20,20,20,.08);overflow:hidden;padding:1.1rem 0}
.sv-marquee-track{display:flex;width:max-content;gap:2.5rem;animation:svMarquee 32s linear infinite}
.sv-marquee:hover .sv-marquee-track{animation-play-state:paused}
.sv-marquee span{font-family:"Inter",sans-serif;font-weight:900;font-size:1.35rem;font-style:italic;letter-spacing:-.01em;text-transform:uppercase;white-space:nowrap;color:#141414;display:flex;align-items:center;gap:2.5rem}
.sv-marquee span::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold);display:block}
@keyframes svMarquee{to{transform:translateX(-50%)}}

/* timeline: pulso e cometa */
.sv-tl-fill::after{content:"";position:absolute;right:-6px;top:-5px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 18px 4px rgba(217,118,46,.9)}
.sv-tl-step.on::before{animation:svPulse 2.2s ease-out infinite}
@keyframes svPulse{0%{box-shadow:0 0 0 0 rgba(217,118,46,.55)}100%{box-shadow:0 0 0 16px rgba(217,118,46,0)}}

/* órbita de plataformas à volta do logo */
.sv-orbit{--r:min(560px,92vw);position:relative;width:var(--r);aspect-ratio:1;margin:0 auto}
.sv-orbit-ring{position:absolute;inset:0;border-radius:50%;border:1px dashed rgba(20,20,20,.22);animation:svSpin 90s linear infinite}
.sv-orbit-ring.r2{inset:19%;border-style:solid;border-color:rgba(20,20,20,.1);animation-direction:reverse;animation-duration:60s}
/* Os aneis eram pensados para fundo claro (.sv-light); em .sv-dark ficavam quase
   invisiveis por serem quase pretos sobre preto. */
.sv-dark .sv-orbit-ring{border-color:rgba(255,255,255,.22)}
.sv-dark .sv-orbit-ring.r2{border-color:rgba(255,255,255,.14)}
.sv-orbit-core{position:absolute;left:50%;top:50%;width:150px;height:150px;transform:translate(-50%,-50%);border-radius:50%;background:#fff;box-shadow:0 20px 50px rgba(20,20,20,.14),0 0 0 12px rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center}
.sv-orbit-core img{width:64px;height:auto}
.sv-orbit-core::after{content:"";position:absolute;inset:-14px;border-radius:50%;border:2px solid rgba(217,118,46,.5);animation:svPulse 2.4s ease-out infinite}
.sv-orbit-spin{position:absolute;inset:0;animation:svSpin 40s linear infinite}
.sv-sat{position:absolute;left:50%;top:50%;width:0;height:0;transform:rotate(var(--a)) translateX(calc(var(--r) / 2))}
.sv-sat>span{position:absolute;left:0;top:0;transform:translate(-50%,-50%) rotate(calc(var(--a) * -1));animation:svCounter 40s linear infinite;white-space:nowrap;display:inline-flex;align-items:center;gap:.5rem;background:#fff;border:1px solid rgba(20,20,20,.08);border-radius:999px;padding:.65rem 1.1rem;font-family:"Inter",sans-serif;font-size:.82rem;font-weight:800;color:#141414;box-shadow:0 10px 26px rgba(20,20,20,.12)}
@keyframes svCounter{to{transform:translate(-50%,-50%) rotate(calc(var(--a) * -1 - 360deg))}}
.sv-sat i{width:10px;height:10px;border-radius:50%;background:var(--gold);display:block}
.sv-sat i.b{background:#2563EB}.sv-sat i.g{background:#16a34a}.sv-sat i.p{background:#7c3aed}
.sv-badges-fallback{display:none}
@media(max-width:700px){.sv-orbit{display:none}.sv-badges-fallback{display:flex}}

@media(prefers-reduced-motion:reduce){
  .sv-grid-bg,.sv-orb,.sv-glow::before,.sv-screen,.sv-marquee-track,.sv-orbit-ring,.sv-orbit-spin,.sv-sat>span,.pg-hero-title em{animation:none!important}
  .sv-w{opacity:1;transform:none;animation:none}
}
