validation

src/app/validationpage/validationpage.component.css

@@ -857,11 +857,11 @@ footer {
 }
 
 /* Cards row: horizontal layout to fit page width */
-.cards-row { display:flex; gap:16px; align-items:flex-start; width:100%; justify-content:flex-start; grid-column:1 / -1; justify-self: start; margin-left:0; padding-left:0; position: relative; left:0; }
+.cards-row { display: grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:20px; align-items: start; width:100%; justify-items: stretch; margin-left:0; padding-left:0; position: relative; left:0; }
 .card-modal { background: linear-gradient(120deg,#ffffff,#f6faff); border-radius:12px; box-shadow:0 8px 32px rgba(2,6,23,0.04); padding:12px; display:flex; flex-direction:column; }
 
 /* Make all card-modals expand to fill available horizontal space evenly */
-.cards-row .card-modal { flex:110; min-width:350px; height: calc(100vh - 200px); overflow:hidden; }
+.cards-row .card-modal { min-width:280px; height:auto; overflow:hidden; }
 
 /* Remove previous rigid per-card max-widths (selectors kept for compatibility) */
 .card-modal-case, .card-modal-metrics, .card-modal-results, .card-modal-summary { /* sized by .cards-row .card-modal */ }
@@ -1004,7 +1004,7 @@ footer {
 .card-modal { background: linear-gradient(120deg,#ffffff,#f6faff); border-radius:12px; box-shadow:0 8px 32px rgba(2,6,23,0.04); padding:12px; display:flex; flex-direction:column; }
 
 /* Make all card-modals expand to fill available horizontal space evenly */
-.cards-row .card-modal { flex:110; min-width:200px; height: calc(100vh - 200px); overflow:hidden; }
+.cards-row .card-modal { flex:1 1 0; min-width:200px; overflow:hidden; }
 
 /* Remove previous rigid per-card max-widths (selectors kept for compatibility) */
 .card-modal-case, .card-modal-metrics, .card-modal-results, .card-modal-summary { /* sized by .cards-row .card-modal */ }