.trustindex-widget {
width: 100% !important;
}

.trustindex-widget .ti-review-item {
min-width: 260px !important;
}
/* CONTENEDOR GENERAL DEL FORMULARIO */
.fluentform {
  max-width: 920px;
  margin: 0 auto;
  padding: 34px;
  background: #f7f3f1;
  border-radius: 26px;
  box-shadow: 0 10px 30px rgba(177, 144, 154, 0.12);
}

/* ESPACIADO ENTRE CAMPOS */
.fluentform .ff-el-group {
  margin-bottom: 24px;
}

/* LABELS */
.fluentform label,
.fluentform .ff-el-input--label label {
  display: block;
  font-size: 16px;
  font-weight: 600;
  color: #5f4f54 !important;
  margin-bottom: 10px;
}

/* CAMPOS */
.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform input[type="tel"],
.fluentform input[type="number"],
.fluentform select,
.fluentform textarea,
.fluentform .ff-el-form-control {
  width: 100% !important;
  border: 1px solid #dfd4d1 !important;
  background: #fbf8f7 !important;
  border-radius: 18px !important;
  padding: 16px 18px !important;
  font-size: 16px !important;
  color: #6f5a60 !important;
  -webkit-text-fill-color: #6f5a60 !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
  min-height: 58px;
}

/* PLACEHOLDER */
.fluentform input::placeholder,
.fluentform textarea::placeholder {
  color: #ae9ea3 !important;
  opacity: 1;
}

/* FOCUS */
.fluentform input:focus,
.fluentform select:focus,
.fluentform textarea:focus,
.fluentform .ff-el-form-control:focus {
  border-color: #d7a4b1 !important;
  box-shadow: 0 0 0 4px rgba(216, 142, 160, 0.12) !important;
  background: #fff !important;
  color: #6f5a60 !important;
  -webkit-text-fill-color: #6f5a60 !important;
  outline: none !important;
}

/* TEXTAREA */
.fluentform textarea {
  min-height: 120px !important;
  resize: vertical;
}

/* TEXTO DE AYUDA */
.fluentform .ff-el-help-message,
.fluentform small {
  display: block;
  margin-top: 8px;
  color: #9c8a90 !important;
  font-size: 14px;
}

/* BOTÓN */
.fluentform .ff-btn-submit,
.fluentform button[type="submit"] {
  display: inline-block;
  width: 100%;
  border: none !important;
  border-radius: 999px !important;
  padding: 18px 28px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  color: #fff !important;
  background: linear-gradient(135deg, #d9a7a0, #cf9a93) !important;
  cursor: pointer;
  box-shadow: 0 12px 24px rgba(201, 150, 144, 0.25) !important;
  transition: transform .2s ease, box-shadow .2s ease;
}

.fluentform .ff-btn-submit:hover,
.fluentform button[type="submit"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 28px rgba(201, 150, 144, 0.3) !important;
}

/* DOS COLUMNAS */
.fluentform .ff-t-container {
  margin-left: -12px;
  margin-right: -12px;
}

.fluentform .ff-t-cell {
  padding-left: 12px;
  padding-right: 12px;
}

/* MENSAJE DE ÉXITO */
.fluentform .ff-message-success {
  border-radius: 16px;
  background: #f3ebe8 !important;
  color: #6f5a60 !important;
  border: 1px solid #e3d3cf !important;
}

@media (max-width: 767px) {
  .fluentform {
    padding: 22px;
    border-radius: 20px;
  }

  .fluentform input[type="text"],
  .fluentform input[type="email"],
  .fluentform input[type="tel"],
  .fluentform input[type="number"],
  .fluentform select,
  .fluentform textarea,
  .fluentform .ff-el-form-control {
    min-height: 54px;
  }
}
.pagina-libro-sensorial {
  background-color: #f6f1e7;
  background-image:
    /* base suave */
    linear-gradient(180deg, rgba(255,255,255,0.16), rgba(0,0,0,0.015)),

    /* manchas orgánicas */
    radial-gradient(circle at 15% 20%, rgba(255,255,255,0.22) 0%, transparent 22%),
    radial-gradient(circle at 85% 25%, rgba(255,255,255,0.12) 0%, transparent 18%),
    radial-gradient(circle at 30% 78%, rgba(0,0,0,0.025) 0%, transparent 22%),

    /* textura papel (CLAVE) */
    url("https://www.transparenttextures.com/patterns/paper-fibers.png");
}
/* =====================================================
   CORRECCIONES MÓVIL - /tarjeta-regalo/
   Añadir en: Elementor > Site Settings > Custom CSS
   o en: Apariencia > Personalizar > CSS Adicional
   ====================================================*/

@media (max-width: 767px) {

  /* ── HERO: quitar padding lateral 100px/80px y apilar en columna ── */
  .elementor-62 .elementor-element.elementor-element-d6984c9 {
    --padding-top: 30px;
    --padding-bottom: 30px;
    --padding-left: 20px;
    --padding-right: 20px;
    --flex-direction: column;
    --margin-top: 0px;
  }

  /* ── HERO columna de texto: quitar padding-left 46px ── */
  .elementor-62 .elementor-element.elementor-element-2e854ad {
    --padding-left: 0px;
    --padding-bottom: 20px;
  }

  /* ── TEXTO DESCRIPTIVO (el más crítico): margin 100px + padding 200px → overflow total ── */
  .elementor-62 .elementor-element.elementor-element-5ac8937 {
    margin: 0px !important;
    padding: 0px 16px !important;
  }

  /* ── SECCIÓN CTA: padding lateral 82px ── */
  .elementor-62 .elementor-element.elementor-element-85a1e0a {
    --padding-top: 40px;
    --padding-bottom: 40px;
    --padding-left: 20px;
    --padding-right: 20px;
  }

  /* ── TARJETA DE PRODUCTO (padding 77px/135px) ── */
  .elementor-62 .elementor-element.elementor-element-8d38502 {
    --padding-top: 30px;
    --padding-bottom: 40px;
    --padding-left: 20px;
    --padding-right: 20px;
  }

  /* ── TARJETA DE PRODUCTO (padding 64px) ── */
  .elementor-62 .elementor-element.elementor-element-dfd8e5b {
    --padding-top: 30px;
    --padding-bottom: 30px;
    --padding-left: 20px;
    --padding-right: 20px;
  }

  /* ── ICON BOXES: márgenes laterales fijos (80px / 125px) ── */
  .elementor-62 .elementor-element.elementor-element-b19a10d,
  .elementor-62 .elementor-element.elementor-element-0bf392f {
    margin: 0px !important;
  }

  /* ── CONTENEDORES con content-width fijo (826px / 982px): evitar overflow ── */
  .elementor-62 .elementor-element.elementor-element-7be41af,
  .elementor-62 .elementor-element.elementor-element-62f4cff,
  .elementor-62 .elementor-element.elementor-element-be49ab8 {
    --content-width: 100%;
  }

  /* ── BOTONES: ocupar todo el ancho disponible ── */
  .elementor-62 .elementor-element.elementor-element-6468e80 .eael-creative-button,
  .elementor-62 .elementor-element.elementor-element-66b7f26 .eael-creative-button {
    width: 100%;
    max-width: 320px;
  }
}
/* ── "Ideas de regalo": heading pegado al borde izquierdo ── */
@media (max-width: 767px) {
  .elementor-62 .elementor-element.elementor-element-948d51c {
    --padding-left: 20px;
    --padding-right: 20px;
    --padding-top: 40px;
    --padding-bottom: 40px;
  }
}
/* ── HERO: /crea-tu-libro-sensorial/ ── */
@media (max-width: 767px) {

  /* Apilar texto e imagen en columna */
  .elementor-58 .elementor-element.elementor-element-7f70871 {
    --flex-direction: column;
    --margin-top: -20px;
  }

  /* Columna de texto: quitar padding 73px/70px */
  .elementor-58 .elementor-element.elementor-element-ed8e644 {
    --padding-left: 20px;
    --padding-right: 20px;
    --padding-top: 30px;
    --padding-bottom: 20px;
  }

  /* Título principal: añadir padding lateral legible */
  .elementor-58 .elementor-element.elementor-element-1ac8dcf {
    padding: 0px 20px 0px 0px;
    max-width: 100%;
    width: 100% !important;
  }

  .elementor-58 .elementor-element.elementor-element-1ac8dcf .elementor-heading-title {
    font-size: 42px;
  }

  /* Subtítulo "que cuentan historias" */
  .elementor-58 .elementor-element.elementor-element-cec391e {
    padding: 0px;
  }

  .elementor-58 .elementor-element.elementor-element-cec391e .elementor-heading-title {
    font-size: 36px;
  }

  /* Texto descriptivo: recuperar padding lateral */
  .elementor-58 .elementor-element.elementor-element-3277f9a {
    padding: 8px 0px 16px 0px;
  }

  /* Imagen: altura fija 289px → automática, ancho completo */
  .elementor-58 .elementor-element.elementor-element-b62b3e1 img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: cover;
  }
}
