@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

@import url("header.css");
@import url("menu.css");
@import url("hero.css");
@import url("limites.css");
@import url("decisao.css");
@import url("mudanca.css");
@import url("marketplace.css");
@import url("process.css");
@import url("faq.css");
@import url("final-cta.css");
@import url("footer.css");

:root{
    --bg:#0b0b0f;
    --bg-soft:#111118;
    --purple:rgb(113, 0, 214);
    --purple-soft:#a855f7;
    --text:#ffffff;
    --muted:#b3b3c6;
    --border:#23232f;
}

*{box-sizing:border-box;margin:0;padding:0;font-family: "Inter", sans-serif;font-optical-sizing: auto;}
body{
    font-family: Inter, system-ui, -apple-system, sans-serif;
    background: #0a0a0a;
    /* background: radial-gradient(80% 80% at 80% 0%, #1a1030 0%, var(--bg) 60%); */
    color: var(--text);
    scroll-behavior: smooth;
}

a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}

.no-draggable{
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: none; /* opcional */
}

.page-size{
    max-width: 1300px;
}

button, a{
  -webkit-tap-highlight-color: transparent;
  outline: none;

}
button:focus-visible,
a:focus-visible{
  outline: 2px solid rgba(124,58,237,.8);
  outline-offset: 2px;
}

html{
  scroll-behavior: smooth;
}


.reveal{
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 600ms ease,
    transform 600ms ease;
  transition-delay: 200ms;
}

.reveal.is-visible{
  opacity: 1;
  transform: translateY(0);
}
.reveal-left{ transform: translateX(-24px); }
.reveal-right{ transform: translateX(24px); }
.reveal-down{ transform: translateY(-24px); }
.reveal-up{ transform: translateY(24px); }
.reveal.delay-1{ transition-delay:600ms; }
.reveal.delay-2{ transition-delay:900ms; }

.mockup.reveal{
  transform: translateY(24px) rotate(3deg);
}
.mockup.reveal.is-visible{
  opacity: 1;
  transform: translateY(0) rotate(3deg);
}
.mockup.reveal.is-visible:hover{
  transform: translateY(0) rotate(0deg);
}


@media screen and (max-width: 900px) {
  .mockup.reveal{
    transform: translateY(24px);
  }
  .mockup.reveal.is-visible{
    opacity: 1;
    transform: translateY(0);
  }
}