/* ARTORIA · botón flotante de WhatsApp, barra fija de la acción principal en el móvil y dos arreglos
   del pie (plantillas de pie #128 / #127, scripts/footer-build.php). Diseño en las clases V4 art-wa,
   art-wa__ico y art-barra (scripts/flotantes-classes.php); aquí solo lo que V4 no expresa: las
   transiciones con la curva de la marca, la barra escondida (assets/js/pagina-flotantes.js pone
   data-art-barra-ve cuando se ve), el botón que sale y se esconde con ella, el botón abajo del todo
   donde no hay barra (muestras y gracias: condiciones de visualización) y el movimiento reducido.
   Réplica de prototipo/assets/css/artoria.css (.wa, .barra, .pie). En el editor de Elementor todo
   se ve (body.elementor-editor-active). Enganchado a data-art-*, nunca a clases. */

/* ---- WhatsApp: transiciones (V4 no admite la curva) ---- */
.elementor a[data-art-wa] {
	transition: background-color .25s var(--art-curva), color .25s var(--art-curva), inset-block-end .35s var(--art-curva);
}

@media (max-width: 899px) {
	/* ---- barra: sube y baja con transform; escondida no se enfoca (visibility se apaga al
	   terminar de bajar). Escondida por defecto, hasta que el JS sabe que no se ve nada que ya
	   lleve la acción (héroe, cabecera de página, cierre, formulario, pie) ---- */
	.elementor [data-art-barra] { transition: transform .35s var(--art-curva); }
	body:not(.elementor-editor-active) .elementor [data-art-barra]:not([data-art-barra-ve]) {
		transform: translateY(110%); visibility: hidden;
		transition: transform .35s var(--art-curva), visibility 0s linear .35s;
	}

	/* ---- WhatsApp encima de la barra (clase art-wa: 84 px): sale y se esconde con ella, así en
	   el primer pantallazo no tapa las acciones del héroe ---- */
	.elementor a[data-art-wa] { transition: opacity .35s var(--art-curva), visibility 0s; }
	body:not(.elementor-editor-active):has([data-art-barra]:not([data-art-barra-ve])) .elementor a[data-art-wa] {
		opacity: 0; visibility: hidden;
		transition: opacity .35s var(--art-curva), visibility 0s linear .35s;
	}
	/* sin barra (muestras y gracias), abajo del todo y siempre a la vista */
	body:not(:has([data-art-barra])) .elementor a[data-art-wa] {
		inset-block-end: calc(16px + env(safe-area-inset-bottom)); opacity: 1; visibility: visible;
	}

	/* ---- el botón no tapa el selector de idioma de la base del pie (WCAG 2.4.11; corregido el
	   12/10/2026 también en el prototipo). Sin barra, el pie guarda abajo solo el sitio del botón
	   (16 + 52 + 16) en vez de los 32 px de style.css; con barra no hace falta: el botón se esconde
	   con ella cuando se ve el pie ---- */
	html body:not(:has([data-art-barra])) .elementor [data-art-pie] { padding-bottom: calc(84px + env(safe-area-inset-bottom)); }
	/* con Tab, lo enfocado no queda debajo de la barra ni del botón (la barra tapaba enteros enlaces
	   enfocados): el navegador lo coloca por encima de su franja (barra 74 + 10 + botón 52 + 8). Sin
	   barra, la del botón (16 + 52 + 16), de abajo */
	html:has([data-art-barra]) { scroll-padding-bottom: calc(144px + env(safe-area-inset-bottom)); }
}

/* ---- con Tab, lo enfocado queda entero por encima de la franja del botón (20 + 56 + 8; en el
   móvil sin barra, 16 + 52 + 16): el navegador no lo deja pegado al borde de abajo (WCAG 2.4.11).
   Solo cambia hasta dónde desplaza el navegador al enfocar; no se ve ---- */
html { scroll-padding-bottom: calc(84px + env(safe-area-inset-bottom)); }

/* ---- escritorio: donde el botón chocaría con el selector de idioma de la base del pie (ventanas
   de 900 a ~1370 px), la base guarda a la derecha el sitio del botón (20 + 56 px y 8 de aire); con
   más ancho manda su padding de siempre (el de la clase art-pie__base) ---- */
@media (min-width: 900px) {
	.elementor [data-art-pie] .art-pie__base {
		padding-inline-end: max(clamp(20px, 4vw, 56px), calc(84px - max(0px, (100% - var(--ancho, 1320px)) / 2)));
	}
}

@media (prefers-reduced-motion: reduce) {
	.elementor a[data-art-wa], .elementor [data-art-barra],
	body:not(.elementor-editor-active) .elementor [data-art-barra]:not([data-art-barra-ve]),
	body:not(.elementor-editor-active):has([data-art-barra]:not([data-art-barra-ve])) .elementor a[data-art-wa] { transition: none; }
}

/* ---- pie: el aviso de privacidad, subrayado como en el prototipo (el subrayado lo pone su estilo
   local en el pie; aquí, la distancia por defecto del navegador, no los 4 px de los enlaces de las
   columnas al pasar el ratón) ---- */
.elementor [data-art-pie] .art-pie__enlace--base { text-underline-offset: auto; }

/* ---- pie entre 521 y 599 px: dos columnas, como el prototipo (que pasa a una a 520 px; el punto
   de corte móvil del kit es 599) ---- */
@media (min-width: 521px) and (max-width: 599px) {
	.elementor [data-art-pie] .art-pie__grid { grid-template-columns: 1fr 1fr; }
}
