/* ==========================================================================
 * Conprisa · Cintillo de suscripción y pie (plantilla de pie 620, todo el sitio)
 *
 * Lo que tiene control en Elementor está en la plantilla: colores, tipografías,
 * rellenos, columnas, redes, listas y el formulario. Aquí solo lo que ningún
 * control alcanza.
 *
 * Índice de clases (puestas desde Elementor):
 *   .cz-news        contenedor del cintillo (lo marca .in js/pie.js al verse)
 *   .cz-news-deco   widget HTML con los cuatro productos decorativos
 *   .cz-news-form   formulario de suscripción
 *   .back-btn       botón «Regresar» de arriba del cintillo
 * ========================================================================== */

/* Productos decorativos: entran desde fuera del cintillo y después flotan
   (referencia: padding-web.css, «newsletter dinámico»). Van por DEBAJO de la
   superposición azul del contenedor: z-index -1 dentro de su contexto
   (el contenedor lleva z-index 0 desde Elementor). */
.cz-news .cz-news-deco{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.cz-news .cz-news-deco .elementor-widget-container{position:absolute;inset:0}
.cz-news .nd{position:absolute;opacity:0;transition:transform 1.2s cubic-bezier(.2,.8,.2,1),opacity .9s ease}
.cz-news .nd img{display:block;width:100%;height:100%;max-width:none;object-fit:contain}
.cz-news .nd-pachon{left:1%;top:-34%;width:20%;height:128%;transform:translateY(-60%);transition-delay:.05s}
.cz-news .nd-pachon img{transform:rotate(-22deg)}
.cz-news .nd-boligrafo{left:31%;top:16%;width:14%;height:72%;transform:translateY(40px) scale(.9);transition-delay:.35s}
.cz-news .nd-boligrafo img{transform:rotate(28deg)}
.cz-news .nd-agenda{left:53%;bottom:-42%;width:26%;height:108%;transform:translateY(70%);transition-delay:.2s}
.cz-news .nd-agenda img{transform:rotate(-12deg)}
.cz-news .nd-taza{right:-9%;top:6%;width:26%;height:100%;transform:translateX(70%);transition-delay:.5s}
.cz-news .nd-taza img{transform:rotate(14deg)}
.cz-news.in .nd{opacity:1;transform:none}
.cz-news.in .nd img{animation:cz-ndfloat 7s ease-in-out 1.6s infinite}
.cz-news.in .nd-agenda img{animation-delay:2.4s}
.cz-news.in .nd-taza img{animation-delay:3s}
@keyframes cz-ndfloat{50%{translate:0 -10px}}
@media (prefers-reduced-motion:reduce){.cz-news .nd{transition:none}.cz-news.in .nd img{animation:none}}

/* Formulario en «píldora»: el correo y el botón dentro de la misma caja blanca,
   con el sobre a la izquierda. El formulario de Elementor pone el botón en su
   propia fila después de todos los campos (también de la casilla), así que se
   lleva encima del campo de correo. */
.cz-news-form .elementor-form{position:relative}
/* Fondo blanco, radio y borde van en los controles del formulario; aquí solo
   lo que no tiene control: alto, relleno para el sobre y el botón, sombra y el
   ícono del sobre como imagen de fondo. */
.cz-news-form .elementor-field-group.elementor-field-type-email input{height:62px;padding:0 180px 0 54px;box-shadow:0 20px 50px rgba(0,0,0,.25);
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%236b7090' d='M2 5h20v14H2zm2 2v.5l8 5 8-5V7zm16 2.9-8 5-8-5V17h16z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:22px center;background-size:20px}
/* Elementor fija el ancho y el relleno de la fila del botón con su clase de
   columna (elementor-col-100): se pisan a propósito. */
.cz-news-form .elementor-field-group.elementor-field-type-submit{position:absolute;top:6px;right:6px;width:auto;max-width:none;padding:0}
.cz-news-form .elementor-field-type-submit button{height:50px;transition:background .3s,transform .3s}
.cz-news-form .elementor-field-type-submit button:hover{transform:scale(1.04)}
.cz-news-form .elementor-field-type-acceptance{margin-left:22px}
.cz-news-form .elementor-field-type-acceptance input{accent-color:#0a1157}
/* La casilla y su texto en la misma línea, como en la referencia (el formulario
   de Elementor no tiene control para la disposición de la casilla). */
.cz-news-form .elementor-field-type-acceptance .elementor-field-option{display:flex;align-items:center;gap:8px}
.cz-news-form .elementor-field-type-acceptance .elementor-field-option label{margin:0}
@media (max-width:767px){
	.cz-news-form .elementor-field-group.elementor-field-type-email input{padding-right:20px}
	.cz-news-form .elementor-field-group.elementor-field-type-submit{position:static;width:100%;margin-top:10px}
}

/* Botón «Regresar»: forma, colores y texto van en sus controles; el punto con
   aro de la referencia (.back .dot), que se vuelve rojo con el puntero, no
   tiene control en el widget Botón. */
.back-btn .elementor-button-content-wrapper{align-items:center;gap:10px}
.back-btn .elementor-button-content-wrapper::before{content:"";width:12px;height:12px;border-radius:50%;background:#0a1157;box-shadow:0 0 0 4px rgba(10,17,87,.15);transition:.3s}
.back-btn .elementor-button:hover .elementor-button-content-wrapper::before{background:#b20e1e;box-shadow:0 0 0 6px rgba(178,14,30,.15)}