feat: improve formatting

app/frontend/styles/_data_box.scss

@@ -4,35 +4,47 @@
   white-space: nowrap;
 }
 
-@media (min-width: 48.0625em) {
+@media (min-width: 54.0625em) {
   .app-data-box-group-one-third {
     display: flex;
     justify-content: space-between;
     column-gap: govuk-spacing(4);
     width: 100%;
+    min-width: 733.33px;
   }
 }
-@media (min-width: 66.25em) {
+@media (min-width: 54.0625em) {
   .app-data-box-one-third {
     width: 33.3333333%;
     float: left;
   }
 }
+@media (min-width: 54.0625em) {
+  .app-data-box__underline {
+    min-width: 733.33px;
+  }
+}
 @media (min-width: 54.0625em) {
   .app-data-box-group-one-half {
     display: flex;
     justify-content: space-between;
     column-gap: govuk-spacing(4);
     width: 100%;
+    min-width: 733.33px;
   }
 }
-
 @media (min-width: 54.0625em) {
   .app-data-box-one-half {
     width: 50%;
     float: left;
   }
 }
+@media (min-width: 54.0625em) {
+  .app-data-box-one-half__underline {
+    min-width: 733.33px;
+  }
+}
+
 .app-data-box__upper {
   @include govuk-responsive-margin(2, "bottom");
   @include govuk-responsive-padding(4);

app/views/home/index.html.erb

@@ -42,8 +42,10 @@
         </div>
       </div>
       <div class="govuk-grid-row">
+        <div class="app-data-box__underline">
           <hr class="govuk-section-break govuk-section-break--visible govuk-section-break--m">
         </div>
       </div>
     </div>
+  </div>
 </div>