Conditionally remove content padding

assets/component-image-with-text.css

@@ -321,6 +321,23 @@
   margin-bottom: 1rem;
 }
 
+@media screen and (max-width: 749px) {
+  .collapse-padding .image-with-text__grid .image-with-text__content {
+    padding-left: 0;
+    padding-right: 0;
+  }
+}
+
+@media screen and (min-width: 750px) {
+  .collapse-padding .image-with-text__grid:not(.image-with-text__grid--reverse) .image-with-text__content {
+    padding-right: 0;
+  }
+
+  .collapse-padding .image-with-text__grid--reverse .image-with-text__content {
+    padding-left: 0;
+  }
+}
+
 /* check for flexbox gap in older Safari versions */
 @supports not (inset: 10px) {
   .image-with-text .grid {
@@ -330,7 +347,7 @@
 
 /*
   Multirow
-  note: move out of this stylesheet if the number of multirow-specific styles grows
+  note: remove from this stylesheet if multirow-specific styles increase signficantly
 */
 .multirow .image-with-text {
   margin-bottom: var(--grid-mobile-vertical-spacing)

sections/multirow.liquid

@@ -27,18 +27,21 @@
     assign transparent_content = true
   endif
 
+  if transparent_content and settings.text_boxes_shadow_opacity == 0 and settings.text_boxes_border_thickness == 0 or settings.text_boxes_border_opacity == 0
+    assign padding_class = ' collapse-padding'
+  endif
   if settings.text_boxes_border_thickness > 0 and settings.text_boxes_border_opacity > 0 and settings.media_border_thickness > 0 and settings.media_border_opacity > 0
-    assign borders_class = 'collapse-borders'
+    assign borders_class = ' collapse-borders'
   endif
   unless transparent_content and settings.media_border_thickness > 0 and settings.text_boxes_shadow_opacity == 0 and settings.text_boxes_border_thickness == 0 or settings.text_boxes_border_opacity == 0
-    assign corners_class = 'collapse-corners'
+    assign corners_class = ' collapse-corners'
   endunless
 -%}
 
 <div class="multirow section-{{ section.id }}-padding gradient color-{{ section.settings.section_color_scheme }}">
   <div class="page-width">
     {%- for block in section.blocks -%}
-      <div class="image-with-text isolate {{ borders_class }} {{ corners_class }}">
+      <div class="image-with-text isolate{{ borders_class }}{{ corners_class }}{{ padding_class }}">
         <div class="image-with-text__grid grid grid--gapless grid--1-col grid--{% if section.settings.desktop_image_width == 'medium' %}2-col-tablet{% else %}3-col-tablet{% endif %}{% if section.settings.image_layout contains 'alternate' %} {% cycle odd_class, even_class %}{% else %} {{ odd_class }}{% endif %}">
           <div class="image-with-text__media-item image-with-text__media-item--{{ section.settings.desktop_image_width }} image-with-text__media-item--{{ section.settings.desktop_content_position }} grid__item">
             <div