/* CSS de produção — efeitos e componentes do site */

@keyframes gradient-x{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.animate-gradient-x{animation:gradient-x 15s ease infinite;background-size:200% 200%}
@keyframes pulse-slow{0%,100%{opacity:1}50%{opacity:.5}}
.animate-pulse-slow{animation:pulse-slow 2.5s infinite}
html{scroll-behavior:smooth;overflow-x:hidden}
body{overflow-x:hidden;max-width:100vw}
input:focus,textarea:focus{outline:none;box-shadow:0 0 0 2px rgba(233,30,99,.2)}
@media (max-width:768px){
.container{padding-left:1rem;padding-right:1rem}
body{overflow-x:hidden}
*{max-width:100%;box-sizing:border-box}
.hero-bg-mobile{background-image:url('../images/hero-mobile.png')!important;background-size:contain!important;background-position:center top!important;background-attachment:fixed!important}
}
.hero-bg-mobile{background-image:url('../images/bg-hero.png');background-size:cover;background-position:center;background-repeat:no-repeat}
@media (min-width:769px){.hero-bg-mobile{background-image:url('../images/bg-hero.png')!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}}
.btn{position:relative;padding:1.5rem 3rem;font-size:1.1rem;font-weight:600;color:#fff;background:none;border:none;cursor:pointer;overflow:hidden;transition:all .4s ease}
.hologram{border:2px solid rgba(0,255,255,.5);background:rgba(0,255,255,.1);box-shadow:0 0 15px rgba(0,255,255,.3);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.hologram span{position:relative;z-index:2;display:block}
.hologram span::before,.hologram span::after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;background:transparent;color:transparent;z-index:-1}
.hologram span::before{animation:glitch 3s infinite linear alternate-reverse;color:#ff00ff;text-shadow:2px 0 #00ffff;clip:rect(44px,450px,56px,0)}
.hologram span::after{animation:glitch 2s infinite linear alternate-reverse;color:#00ffff;text-shadow:-2px 0 #ff00ff;clip:rect(44px,450px,56px,0)}
.scan-line{position:absolute;top:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,rgba(0,255,255,.8),transparent);animation:scan 2s linear infinite;z-index:1}
@keyframes glitch{0%{clip:rect(42px,9999px,44px,0);transform:skew(.15deg)}5%{clip:rect(12px,9999px,59px,0);transform:skew(.25deg)}10%{clip:rect(48px,9999px,29px,0);transform:skew(.1deg)}15%{clip:rect(42px,9999px,73px,0);transform:skew(.4deg)}20%{clip:rect(63px,9999px,27px,0);transform:skew(.15deg)}25%{clip:rect(34px,9999px,55px,0);transform:skew(.2deg)}30%{clip:rect(86px,9999px,73px,0);transform:skew(.25deg)}35%{clip:rect(20px,9999px,20px,0);transform:skew(.15deg)}40%{clip:rect(26px,9999px,60px,0);transform:skew(.1deg)}45%{clip:rect(25px,9999px,66px,0);transform:skew(.3deg)}50%{clip:rect(57px,9999px,98px,0);transform:skew(.4deg)}55%{clip:rect(5px,9999px,46px,0);transform:skew(.25deg)}60%{clip:rect(82px,9999px,31px,0);transform:skew(.2deg)}65%{clip:rect(54px,9999px,27px,0);transform:skew(.3deg)}70%{clip:rect(28px,9999px,99px,0);transform:skew(.15deg)}75%{clip:rect(45px,9999px,69px,0);transform:skew(.1deg)}80%{clip:rect(23px,9999px,85px,0);transform:skew(.4deg)}85%{clip:rect(54px,9999px,84px,0);transform:skew(.35deg)}90%{clip:rect(45px,9999px,47px,0);transform:skew(.25deg)}95%{clip:rect(37px,9999px,20px,0);transform:skew(.4deg)}100%{clip:rect(4px,9999px,91px,0);transform:skew(.1deg)}}
@keyframes scan{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.glow-on-hover{width:auto;height:auto;border:none;outline:none;color:#fff;background:#111;cursor:pointer;position:relative;z-index:0;border-radius:10px}
.glow-on-hover:before{content:'';background:linear-gradient(45deg,#ff0000,#ff7300,#fffb00,#48ff00,#00ffd5,#002bff,#7a00ff,#ff00c8,#ff0000);position:absolute;top:-2px;left:-2px;background-size:400%;z-index:-1;filter:blur(5px);width:calc(100% + 4px);height:calc(100% + 4px);animation:glowing 20s linear infinite;opacity:1;border-radius:10px}
.glow-on-hover:after{z-index:-1;content:'';position:absolute;width:100%;height:100%;background:#111;left:0;top:0;border-radius:10px}
@keyframes glowing{0%{background-position:0 0}50%{background-position:400% 0}100%{background-position:0 0}}
.neon-text{color:#fff;text-shadow:0 0 5px #ff005e,0 0 10px #ff005e,0 0 20px #ff005e,0 0 40px #ff005e,0 0 80px #ff005e;animation:glow 1.5s infinite alternate}
@keyframes glow{0%{text-shadow:0 0 5px #ff005e,0 0 10px #ff005e,0 0 20px #ff005e,0 0 40px #ff005e,0 0 80px #ff005e}100%{text-shadow:0 0 10px #00d4ff,0 0 20px #00d4ff,0 0 40px #00d4ff,0 0 80px #00d4ff,0 0 160px #00d4ff}}
.text-caterpillar{color:#22c55e}
.city-nights{animation:lights 5s 750ms linear infinite}
@keyframes lights{0%{color:hsl(230,40%,80%);text-shadow:0 0 1em hsla(320,100%,50%,.2),0 0 .125em hsla(320,100%,60%,.3),-1em -.125em .5em hsla(40,100%,60%,0),1em .125em .5em hsla(200,100%,60%,0)}30%{color:hsl(230,80%,90%);text-shadow:0 0 1em hsla(320,100%,50%,.5),0 0 .125em hsla(320,100%,60%,.5),-.5em -.125em .25em hsla(40,100%,60%,.2),.5em .125em .25em hsla(200,100%,60%,.4)}40%{color:hsl(230,100%,95%);text-shadow:0 0 1em hsla(320,100%,50%,.5),0 0 .125em hsla(320,100%,90%,.5),-.25em -.125em .125em hsla(40,100%,60%,.2),.25em .125em .125em hsla(200,100%,60%,.4)}70%{color:hsl(230,80%,90%);text-shadow:0 0 1em hsla(320,100%,50%,.5),0 0 .125em hsla(320,100%,60%,.5),.5em -.125em .25em hsla(40,100%,60%,.2),-.5em .125em .25em hsla(200,100%,60%,.4)}100%{color:hsl(230,40%,80%);text-shadow:0 0 1em hsla(320,100%,50%,.2),0 0 .125em hsla(320,100%,60%,.3),1em -.125em .5em hsla(40,100%,60%,0),-1em .125em .5em hsla(200,100%,60%,0)}}
@media (prefers-reduced-motion:reduce){.animate-gradient-x,.animate-pulse-slow,.city-nights,.neon-text,.hologram span::before,.hologram span::after,.scan-line,.glow-on-hover:before{animation:none!important}}
