/* ---------------------------------------------------------------------------
 * storefront.css - the ONLY stylesheet in this tree that is not part of the
 * approved mockup set. It exists for exactly one reason.
 *
 * App\Support\ResponsiveImage::picture() wraps every data-driven image in a
 * <picture> element so it can offer AVIF and WebP sources. The mockups have a
 * bare <img> in those positions, and the theme sizes images with rules like
 * `.image-wrapper .image { width: 100% }` plus flex/absolute layouts on the
 * wrapper. An inline <picture> in between would introduce a new layout box and
 * an inline-level baseline gap, which would move pixels.
 *
 * `display: contents` removes the <picture> box from the layout tree entirely,
 * so the <img> is laid out exactly as if it were a direct child of the wrapper,
 * which is what the mockup measured. No other declaration belongs in this file.
 * ------------------------------------------------------------------------- */
picture {
    display: contents;
}