/* ==========================================================================
   correcciones.css — correcciones sobre webflow.css
   --------------------------------------------------------------------------
   webflow.css es copia byte a byte del CSS original y no se toca. Lo que hay
   que corregir de ese CSS se sobrescribe acá, con el mismo selector.
   Cargar DESPUÉS de webflow.css.
   ========================================================================== */

/* Fondo del <h1> de /formulario-de-contacto, /gracias-por-contactarnos y la
   404. El original lo sirve el CDN de Webflow
   (696f8d51fe63eb3f9b9f1996_envato-labs-image-edit.png), que deja de
   existir al cancelar el plan. Es la misma imagen (700×394), recodificada
   a WebP en la Fase 1. */
.heading-43 {
  background-image: url("/assets/img/contacto/heading-background.webp");
}

/* Medidas de imagen agregadas por scripts/imagenes.mjs (data-medidas).
   width/height reservan el espacio antes de que la imagen cargue (CLS),
   pero como atributos también fijan un tamaño en px. Estas reglas lo
   neutralizan solo en las imágenes donde las medidas las puso el build;
   las que ya traían width y height de Webflow no se tocan (son tamaños de
   diseño: con height:auto, un ícono de 25 px se encogía a 19,6 px).
   Con :where() la especificidad es 0: cualquier regla de webflow.css que
   fije ancho o alto sigue ganando. */

/* Tenían width de Webflow pero no height: que el alto no las deforme si
   max-width las achica. */
:where(img[data-medidas="alto"]) {
  height: auto;
}

/* No tenían medidas: el ancho lo sigue dando el srcset (o el archivo),
   como en Webflow. */
:where(img[data-medidas="naturales"]) {
  width: auto;
  height: auto;
}
