/* Main Container for all the cards */
        .hub-container {
            display: flex;
            flex-wrap: wrap; /* Allows items to wrap to the next line on small screens */
            gap: 20px; /* Replaces the old spacer cells */
            width: 100%;
        }

        /* Individual Card Styles */
        .hub-card {
            display: flex;
            align-items: center; /* Vertically aligns image and text */
            background-color: #ede9f2;
            padding: 20px;
            border-radius: 8px; /* Adds modern rounded corners */
            box-sizing: border-box;
            flex: 1 1 100%; /* Default to full width for mobile-first approach */
        }
        
        /* Set a basis of 48% for larger screens to create a two-column layout */
        @media (min-width: 768px) {
            .hub-card {
                flex: 1 1 48%;
            }
        }

        /* QR Code Container Styles */
        .hub-card .qr-code {
            flex-shrink: 0; /* Prevents the container from shrinking */
            margin-right: 20px;
            display: flex;
            flex-direction: column; /* Stacks the image and text vertically */
            align-items: center; /* Horizontally centers the image and text */
            text-align: center;
        }

        .hub-card .qr-code img {
            width: 125px;
            height: 125px;
            display: block; /* Removes extra space below the image */
            margin-bottom: 5px; /* Adds space between image and "Link" text */
        }

        .hub-card .qr-code .qr-link-text {
            font-weight: bold;
            font-size: 1em;
        }

        /* Text Content Styles */
        .hub-card .hub-content h3 {
            margin-top: 0;
            margin-bottom: 10px;
        }
        
        .hub-card .hub-content p {
            margin: 0;
            line-height: 1.5;
        }

        /* Media Query for Mobile Devices */
        @media (max-width: 600px) {
            .hub-card {
                flex-direction: column; /* Stack image and text vertically */
                text-align: center;
            }

            .hub-card .qr-code {
                margin-right: 0;
                margin-bottom: 15px; /* Add space between QR container and text when stacked */
            }
        }