@font-face {
  font-family: "Satoshi Variable";
  src: url("https://framerusercontent.com/third-party-assets/fontshare/wf/NWBQYJIM7GCZ5XWD7D26ARB3VDY55ZRT/K63EV2KZIGKLE7RANQ2U42S6SVHU5RJ7/X6XYTKIVDUW7GZTZPZNN4EUM5KH54KHF.woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

.framer-clone-wrap {
  margin: 0;
  padding: 85px 0 0;
  width: 100%;
  background: transparent;
  color: #1f1f1f;
}

.framer-clone-wrap,
.framer-clone-wrap * {
  box-sizing: border-box;
}

.framer-clone-wrap .framer-hero-root {
  width: 100%;
}

.framer-clone-wrap .framer-hero-main,
.framer-clone-wrap .framer-triggers {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
}

.framer-clone-wrap .framer-hero-section {
  width: 100%;
  max-width: 1400px;
}

.framer-clone-wrap .framer-hero-content {
  position: relative;
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 44px;
  padding: 85px 64px 64px;
}

.framer-clone-wrap .framer-hero-graphics {
  position: sticky;
  top: 0;
  z-index: 2;
  opacity: 0.001;
  transform: translateY(10px) scale(0.985);
  will-change: transform, opacity;
}

.framer-clone-wrap .framer-phone-reveal {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  will-change: transform;
  transform: translate3d(0, 0, 0) scale(1);
}

.framer-clone-wrap .framer-phone-frame-wrap {
  margin: 0;
  position: relative;
  z-index: 3;
  width: 365px;
  aspect-ratio: 0.4866666667 / 1;
  user-select: none;
  pointer-events: none;
}

.framer-clone-wrap .framer-phone-frame {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.framer-clone-wrap .framer-phone-screen-wrap {
  position: absolute;
  top: 0.833353%;
  left: 2.73972%;
  z-index: 2;
  width: 95%;
  height: 98%;
}

.framer-clone-wrap .framer-phone-screen-surface {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 56px;
  background: #0f1512;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.framer-clone-wrap .framer-phone-screen {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
  z-index: 1;
  transform-origin: center center;
  will-change: auto;
}

.framer-clone-wrap .framer-phone-screen-header {
  position: absolute;
  top: 44px;
  right: 32px;
  left: 32px;
  min-height: 40px;
  transition: opacity 0.2s linear;
}

.framer-clone-wrap .framer-phone-analysis {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 1px;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
  height: 303px;
  padding: 12px;
  border-radius: 38px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  background: rgba(21, 27, 23, 0.18);
  opacity: 0.001;
  transform: translate3d(0, 350px, 0);
  will-change: transform, opacity;
}

.framer-clone-wrap .framer-phone-analysis img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  border-radius: 26px;
}

.framer-clone-wrap .framer-reveal-row {
  position: absolute;
  bottom: -170px;
  left: 50%;
  width: 110%;
  max-width: 900px;
  transform: translateX(-50%);
  overflow: visible;
  z-index: 8;
}

.framer-clone-wrap .framer-reveal-title {
  margin: 0;
  width: 100%;
  max-width: 900px;
  color: #f4dfd0;
  text-align: center;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 64px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.03em;
  opacity: 0;
  transform: translate3d(0, 0, 0);
  clip-path: none;
  filter: none;
  text-shadow: 0 0 0 rgba(0, 0, 0, 0);
  will-change: opacity;
  position: relative;
  z-index: 9;
}

.framer-clone-wrap .framer-trigger {
  width: 100%;
  height: 100px;
  pointer-events: none;
  user-select: none;
}

.framer-clone-wrap .framer-scroll-area {
  width: 100%;
  height: 75vh;
  pointer-events: none;
  user-select: none;
}

@media (min-width: 810px) and (max-width: 1199.98px) {
  .framer-clone-wrap .framer-hero-content {
    padding: 85px 44px 44px;
  }

  .framer-clone-wrap .framer-reveal-title {
    font-size: 58px;
  }
}

@media (max-width: 809.98px) {
  .framer-clone-wrap .framer-hero-content {
    padding: 64px 32px 32px;
  }

  .framer-clone-wrap {
    padding-top: 64px;
  }

  .framer-clone-wrap .framer-phone-frame-wrap {
    width: 286px;
  }

  .framer-clone-wrap .framer-phone-screen-surface {
    border-radius: 49px;
  }

  .framer-clone-wrap .framer-reveal-row {
    bottom: -128px;
  }

  .framer-clone-wrap .framer-reveal-title {
    font-size: 44px;
  }
}
