/* DM Sans Font Faces */
@font-face {
  font-family: 'DM Sans';
  src: url('assets/fonts/DMSans-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'DM Sans';
  src: url('assets/fonts/DMSans-SemiBold.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'DM Sans';
  src: url('assets/fonts/DMSans-Bold.ttf') format('truetype');
  font-weight: 600 700;
  font-style: normal;
  font-display: swap;
}

/* Rethink Sans Font Faces */
@font-face {
  font-family: 'Rethink Sans';
  src: url('assets/fonts/RethinkSans-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Rethink Sans';
  src: url('assets/fonts/RethinkSans-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Rethink Sans';
  src: url('assets/fonts/RethinkSans-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Rethink Sans';
  src: url('assets/fonts/RethinkSans-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Stats Section Background */
.stats-section {
  background-image: url('assets/GRID (scale 2x).png');
  background-position: right 0 top 0;
  background-repeat: no-repeat;
}

/* Hero Text - Desktop Padding */
.responsive-hero-text {
  padding: 0 50px;
}

/* CTA Button Arrow Animation */
@keyframes flyArrow {
  0% {
    transform: translate(0, 0);
    opacity: 1;
  }
  50% {
    transform: translate(12px, -12px);
    opacity: 0;
  }
  51% {
    transform: translate(-12px, 12px);
    opacity: 0;
  }
  100% {
    transform: translate(0, 0);
    opacity: 1;
  }
}

/* Position arrow relatively so it can move independently */
a[href*="incode.com/demo"] img[alt=""],
a[href="#"] img[alt=""] {
  position: relative;
  display: inline-block;
}

/* Apply animation on hover */
a[href*="incode.com/demo"]:hover img[alt=""],
a[href="#"]:hover img[alt=""] {
  animation: flyArrow 0.4s ease-in-out;
}

/* Allow arrow to fly outside button bounds */
a[href*="incode.com/demo"],
a[href="#"].inline-flex {
  overflow: visible;
}