:root {
  /* Colors */
  --color-primary: #41FE95;
  --color-secondary: #00F;
  --color-dark: #0d0d0d;
  --color-black: #000;
  --color-white: #fff;
  --color-gray-light: #f2f2f2;
  --color-gray-medium: #ccc;
  --color-gray-dark: #888;
  --color-text-dark: rgba(0, 0, 0, 0.75);
  --color-text-light: rgba(255, 255, 255, 0.75);
  --pix-blue: #0033cc;

  /* Fonts */
  --font-family-space-grotesk: 'Space Grotesk', sans-serif;

  /* Spacing */
  --spacing-xs: 8px;
  --spacing-sm: 10px;
  --spacing-md: 16px;
  --spacing-lg: 20px;
  --spacing-xl: 24px;
  --spacing-xxl: 30px;

  /* Border Radius */
  --border-radius-sm: 8px;
  --border-radius-md: 10px;
  --border-radius-lg: 15px;
  --border-radius-xl: 20px;
  --border-radius-full: 999px;
}

/* Inclusões 06-08-2025 */
:root {
  --h1: 60px;
  --lead: 23px;
  --h2: 40px;
  --h3: 22px;
  --p: 18px;
  --p-minus: 16px;
  --small: 12px;
}

@media (max-width: 768px) {
  :root {
    --h1: 33px;
    --lead: 18px;
    --p: 16px;
    --p-minus: 16px;
    --h2: 28px;
    --h3: 16px; /* não está claro */
  }
  .link-cta {
    width: 90%;
    text-align: center;
    margin: 0 auto;
  }
}

h1 {
  font-size: var(--h1);
  font-weight: 400;
}

h2 {
  font-size: var(--h2);
  font-weight: 400;
}

h3 {
  font-size: var(--h3);
  font-weight: 400;
}

p {
  font-size: var(--p);
  font-weight: 400;
}

.lead {
  font-size: var(--lead);
  font-weight: 400;
}

.p-minus {
  font-size: var(--p-minus);
  font-weight: 400;
}

small {
  font-size: var(--small);
  font-weight: 400;
}

.full {
  width: 100%;
}

/* INÍIO LINK CTA */

button.link-cta {
  border: none;
}

@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

.link-cta {
  font-size: 16px;
  padding: 12px 40px;
  background-color: #000;
  color: #fff;
  cursor: pointer;
  text-decoration: none;
  position: relative;
  display: inline-block;
  font-weight: 400;
  z-index: 1;
  overflow: hidden;
  border-radius: 8px;
  transition: color 0.3s, background-color 0.3s;
}
.link-cta:hover::before {
  transform: translateX(0%);
}

.link-cta span {
  position: relative;
  z-index: 1;
}
.link-cta::before {
    content: "";
    position: absolute;
    right: -6px; /* -131px */
    top: -64px;
    width: 110%; /* 513px */
    height: 166px;
    transform: translateX(-100%);
    z-index: 0;
    border-radius: 150px;
    background: linear-gradient(261deg, rgb(65, 254, 149) 6.53%, rgb(0, 0, 255) 123.97%);
    transition: transform 0.5s;  /* 0.9s */
}

.link-cta.white {
  background-color: #fff;
  color: #000;
}

.link-cta.white:hover {
  color: #fff;
}

.cta-box .link-cta::before {
    background: black;
}

/* FIM LINK CTA */

/* Verificar incompatibilidade com o CSS  FNORD */
section {
  padding: 60px 20px;
}



/* Utility classes for responsive visibility */
 html body .xs\:hidden { display: none; }

 /* Small screens and up (640px+) */
 @media (min-width: 640px) {
     html body .sm\:hidden { display: none; }
     html body .sm\:block { display: block; }
     html body .sm\:flex { display: flex; }
     html body .sm\:grid { display: grid; }
 }

 /* Medium screens and up (768px+) */
 @media (min-width: 768px) {
     html body .md\:hidden { display: none; }
     html body .md\:block { display: block; }
     html body .md\:flex { display: flex; }
     html body .md\:grid { display: grid; }
 }

 /* Large screens and up (1200px+) */
 @media (min-width: 1200px) {
     html body .lg\:hidden { display: none; }
     html body .lg\:block { display: block; }
     html body .lg\:flex { display: flex; }
     html body .lg\:grid { display: grid; }
 }