.siteCta{
  padding-block: clamp(52px, 7vw, 88px);
}

.siteCta__card{
  position: relative;
  overflow: hidden;

  max-width: 1080px;
  margin-inline: auto;
  padding: clamp(30px, 4vw, 42px) clamp(28px, 4vw, 44px);

  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 28px;
  align-items: center;

  border-radius: 28px;
  border: 1px solid rgba(201,151,53,.16);

  background:
    radial-gradient(
      circle at 88% 18%,
      rgba(201,151,53,.10) 0%,
      rgba(201,151,53,.04) 18%,
      transparent 42%
    ),
    linear-gradient(
      135deg,
      #1A6048 0%,
      #10503D 50%,
      #0B3D30 100%
    );

  box-shadow:
    0 16px 34px rgba(10,47,38,.08),
    inset 0 1px 0 rgba(255,255,255,.03);

  color: #fff;
}

.siteCta__content{
  max-width: 680px;
}

.siteCta__eyebrow{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 14px;

  color: var(--accent-500);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.siteCta__eyebrowDot{
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent-500);
  flex: 0 0 auto;
}

.siteCta__title{
  margin: 0;

   max-width: 18ch;

  color: #fff;
  font-size: clamp(34px, 3.8vw, 52px);
  line-height: 1.02;
  letter-spacing: -.045em;
  font-weight: 760;
}

.siteCta__lead{
  max-width: 58ch;
  margin: 18px 0 0;

  color: rgba(255,255,255,.76);
  font-size: clamp(16px, 1.15vw, 18px);
  line-height: 1.68;
}

.siteCta__actions{
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: stretch;
  justify-content: center;
}

.siteCta__btn{
  width: 100%;
  justify-content: center;
  text-align: center;
}

/* decorativos sutiles */
.siteCta__line{
  position: absolute;
  top: 44px;
  right: 40px;
  width: 72px;
  height: 1px;
  background: linear-gradient(
    90deg,
    rgba(201,151,53,0) 0%,
    rgba(201,151,53,.62) 100%
  );
}

.siteCta__dot{
  position: absolute;
  right: 42px;
  bottom: 42px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent-500);
  opacity: .9;
}

.siteCta__ring{
  position: absolute;
  right: 66px;
  bottom: 28px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(201,151,53,.18);
}

/* Responsive */
@media (max-width: 860px){
  .siteCta__card{
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .siteCta__actions{
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .siteCta__btn{
    width: auto;
    min-width: 180px;
  }
}

@media (max-width: 640px){
  .siteCta__card{
    padding: 26px 22px;
    border-radius: 22px;
  }

  .siteCta__title{
    max-width: 12ch;
  }

  .siteCta__actions{
    flex-direction: column;
    align-items: stretch;
  }

  .siteCta__btn{
    width: 100%;
  }

  .siteCta__line,
  .siteCta__ring{
    display: none;
  }
}

.cta__card{
  position: relative;
  overflow: hidden;

  max-width: 1180px;
  margin-inline: auto;
  padding: clamp(30px, 4vw, 46px);

  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(28px, 5vw, 68px);
  align-items: center;

  border-radius: var(--radius-xl);
  border: 1px solid rgba(201,151,53,.22);
  background:
    linear-gradient(
      180deg,
      var(--surface-green) 0%,
      var(--surface-dark) 100%
    );

  color: var(--text-inverse);
  box-shadow: 0 22px 58px rgba(10,47,38,.16);
}

.cta__card::before{
  content: "";
  position: absolute;
  left: 32px;
  right: 32px;
  top: 0;

  height: 4px;
  border-radius: var(--radius-pill);
  background: var(--accent-500);
}

.cta__card::after{
  content: "";
  position: absolute;
  right: -70px;
  bottom: -90px;

  width: 250px;
  height: 250px;

  border-radius: 50%;
  border: 1px solid rgba(201,151,53,.16);

  pointer-events: none;
}

.cta__content{
  position: relative;
  z-index: 1;

  max-width: 720px;
}

.cta__eyebrow{
  margin: 0 0 15px;

  color: var(--accent-400);
  font-size: 11px;
  font-weight: 880;
  letter-spacing: .15em;
  line-height: 1;
  text-transform: uppercase;
}

.cta__title{
  max-width: 18ch;
  margin: 0;

  color: var(--text-inverse);
  font-size: clamp(32px, 3.4vw, 50px);
  line-height: 1;
  letter-spacing: -.06em;
  font-weight: 860;
}

.cta__lead{
  max-width: 660px;
  margin: 20px 0 0;

  color: var(--text-inverse-muted);
  font-size: 15px;
  line-height: 1.72;
}

.cta__actions{
  position: relative;
  z-index: 1;

  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px;
}

