/* cta.css — CTA "Contato" com assinatura Matter, reutilizável site-wide (<CtaMatter />).
 * Valores portados de .fm-home-cta* (route-home.css): branco/navy, título Oswald, miolo
 * por cima do canvas, pílulas caindo sobre branco. */

.fm-cta {
  position: relative;
  z-index: 4;
  overflow: hidden;
  background: var(--fm-white);
  color: var(--fm-navy);
  min-height: clamp(680px, 88vh, 880px);
  display: flex;
  align-items: center;
  justify-content: center;
  border-top-left-radius: var(--fm-radius-screen);
  border-top-right-radius: var(--fm-radius-screen);
}

.fm-cta--overlap {
  margin-top: calc(-1 * var(--fm-radius-screen));
}

.fm-cta-inner {
  position: relative;
  z-index: 2;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--fm-space-4);
  text-align: center;
  padding: var(--fm-space-12) var(--fm-space-6);
}
.fm-cta-inner a, .fm-cta-inner button { pointer-events: auto; }

.fm-cta-eyebrow {
  font-family: var(--fm-font-body);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 800;
  font-size: 1.5rem;
  line-height: 1.5;
  color: var(--fm-navy);
}
.fm-cta-title {
  margin: 0;
  max-width: 16ch;
  font-family: var(--fm-font-display);
  font-weight: 600;
  font-size: clamp(2.5rem, 6vw, 6rem);
  line-height: 1.1;
  color: var(--fm-navy);
}

.fm-cta-matter { position: absolute; inset: 0; z-index: 1; pointer-events: auto; }
.fm-cta-matter canvas { display: block; }