@charset "UTF-8";
/**
 * Landing «Contacto» — fc_landings.
 * Se carga DESPUÉS de /landings/newsletter/newsletter.css y solo cambia colores:
 * fondo crema (#F0EBDB), texto oscuro y los adornos (palabra, asterisco, arcos) en naranja.
 */

.nl--crema {
  --nl-crema-bg: #f0ebdb;
  color: var(--nl-ink);
}

.nl--crema .nl-hero { background: var(--nl-crema-bg); }

.nl--crema .nl-kicker,
.nl--crema .nl-lead { color: var(--nl-ink); }

.nl--crema .nl-word text { fill: var(--nl-orange); }
.nl--crema .nl-star { fill: var(--nl-orange); }
.nl--crema .nl-arcs { color: var(--nl-orange); }

.nl--crema :focus-visible { outline-color: var(--nl-ink); }

/* --- Columna de texto: título + dos párrafos ------------------------------------------- */

.nl--crema .ct-title {
  margin: 0 0 clamp(14px, 1.4vw, 24px);
  padding: 0;
  color: var(--nl-orange);
  font-family: inherit;
  font-size: clamp(26px, 2.4vw, 42px);
  font-weight: 600;
  line-height: 1.15;
  text-transform: none;
}

.nl--crema .nl-lead + .nl-lead { margin-top: 1em; }

/* Con dos párrafos el texto grande de PC de la newsletter queda excesivo. */
@media (min-width: 1101px) {
  .nl--crema .nl-lead { font-size: clamp(19px, 1.45vw, 26px); }
}

/* --- Formulario de contacto (Brevo «Contacto web») ------------------------------------- */

/* Es más largo que el de la newsletter (5 campos), con fondo crema en Brevo: altura propia, medida a mano. */
.nl--crema .nl-form__frame { height: 800px; }

@media (max-width: 760px) {
  .nl--crema .nl-form__frame { height: 900px; }
}