/* Contenedor */
.cact-callout {
  padding-block: clamp(2rem, 6vw, 5rem);
}

/* Alineación por si el tema no trae utilidades */
.text-start { text-align: left; }
.text-center { text-align: center; }
.text-end { text-align: right; }

/* Eyebrow */
.cact-callout__eyebrow {
  margin: 0 0 .75rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 700;
  font-size: clamp(.875rem, 1.4vw, .9375rem);
  color: #8b8b8b;
}

/* Título (cobre) */
.cact-callout__title {
  margin: .25rem 0 .75rem;
  line-height: 1.05;
  font-weight: 700;
  font-size: clamp(2.4rem, 6vw, 4.75rem);
  color: #A1561C; /* ajusta si necesitas */
}

/* Texto */
.cact-callout__text {
  max-width: 54rem;
  margin-inline: auto;
  color: #6b6b6b;
  font-size: clamp(1.125rem, 1.4vw, 1.25rem);
  line-height: 1.6;
}

/* CTA */
.cact-callout__cta { margin-top: 2rem; }

/* === CTA del callout con extremos inclinados (no afecta a otros) === */

.cact-callout__cta .btn.btn-primary {
  /* base visual */
  background: #A1561C;
  color: #fff !important;
  border: none;
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 1.3;

  /* tamaño y respiración */
  padding: 0.875rem 2.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .75rem;

  /* forma tipo trapecio con ambos extremos inclinados */
  clip-path: polygon(0 0, 90% 0, 100% 100%, 10% 100%);

  /* acabado */
  text-decoration: none;
  transition: all .2s ease;
  box-shadow: 0 4px 12px rgba(161, 86, 28, .18);
  position: relative;
}

/* Flecha a la derecha (SVG) */
.cact-callout__cta .btn.btn-primary::after {
  content: "";
  width: 18px;
  height: 18px;
  margin-left: .75rem;
  background: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12h14M13 5l7 7-7 7'/></svg>") no-repeat center / 18px 18px;
  flex: 0 0 18px; /* que no se deforme */
}

/* Hover/focus */
.cact-callout__cta .btn.btn-primary:hover,
.cact-callout__cta .btn.btn-primary:focus {
  background: #7e461e;
  color: #fff !important;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(126, 70, 30, .22);
  transform: translateY(-2px);
}

/* Tamaño grande como vienes usando (btn-lg) */
.cact-callout__cta .btn.btn-primary.btn-lg {
  padding: 1rem 2.5rem;
}



