.table-container {
            background-color: #98cbff; /* Light blue */
            padding: 20px;
            border-radius: 10px;
            box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
            max-width: 650px;
            min-width: 300px;
            margin: 20px auto;
        }

.grid-container {
            display: grid;
            grid-template-columns: repeat(2, 1fr); /* Two equal columns */
            gap: 20px;
            justify-content: center;
            max-width: 600px;
            margin: 0 auto;
        }

.group {
            padding: 15px;
            border-radius: 8px;
            box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
            text-align: center;
            width: 100%;
            font-size: clamp(0.5rem, 2.5vw, 1.0rem);
            font-weight: bold;
            white-space: nowrap;
            overflow: hidden;
        }

        /* Different colors for each group */
        .group:nth-child(1) { background-color: #FFD700; } /* Gold */
        .group:nth-child(2) { background-color: #87CEEB; } /* Sky Blue */
        .group:nth-child(3) { background-color: #90EE90; } /* Light Green */
        .group:nth-child(4) { background-color: #FFA07A; } /* Light Salmon */

        /* Full-width fifth group */
        .full-width {
            background-color: #DDA0DD; /* Plum */
            grid-column: 1 / -1; /* Makes it span across both columns */
            width: 100%;
        }