Update index.css

src/index.css

@@ -109,12 +109,13 @@ main {
 /* Container for the whole services section */
 /* Container for the whole services section */
 /* Container for the whole services section */
+/* Container for the whole services section */
 .services {
   background-color: #f7f7f7;
   padding: 2rem;
   margin: 2rem auto;
   border-radius: 5px 20px 5px;
-  max-width: 1200px; /* Limits the width on large screens */
+  max-width: 1200px; /* Limits the width on larger screens */
 }
 
 /* Our Services heading */
@@ -138,20 +139,19 @@ main {
   }
 }
 
-/* Individual service item as an adaptable square box */
+/* Individual service item that adapts its height to the text content */
 .service {
   background-color: #fff;
   padding: 1rem;
   border-radius: 0px 30px 30px 0px;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
 
-  /* Force a square shape that scales with its grid cell */
-  aspect-ratio: 1 / 1;
+  /* Remove the fixed aspect ratio so the box adapts to its content */
+  /* Instead of aspect-ratio, we let the content determine the height */
 
-  /* Center the content within the square */
+  /* Optional: Use flexbox to vertically center content if desired */
   display: flex;
   flex-direction: column;
-  justify-content: center;
   align-items: center;
   text-align: center;
 }