/* Der Haupt-Container für das 4-Spalten-Raster am Desktop (> 1200px) */
        .VG-container {
            display: grid;
            grid-template-columns: repeat(4, 1fr); 
            gap: 20px; 
        }

        /* Jede Spalte ist ein eigener, voll klickbarer Link */
        .VG-column-link {
            display: grid;
            grid-template-rows: subgrid; /* Desktop: Nutzt die globalen Zeilenhöhen */
            grid-row: span 3; /* Erstreckt sich über alle 3 Textzeilen */
            gap: 10px;
            
            /* Rahmen und Design um die gesamte Spalte */
            border: 2px solid var(--linkcolor); 
            border-radius: 8px;
            padding: 15px;
            background-color: #fff;
            box-shadow: 0 4px 6px rgba(0,0,0,0.05);
            
            /* Link-Spezifische Bereinigungen */
            text-decoration: none;
            color: #333;
            transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
        }

        /* Hover-Effekt */
        .VG-column-link:hover {
            transform: translateY(-4px);
            box-shadow: 0 8px 15px rgba(0,0,0,0.1);
            border-color: #007bff; 
        }

        /* Die inneren Inhalts-Boxen */
        .VG-box {
            /* padding: 15px; */
        }

        /* Unterschiedliche Farben zur Veranschaulichung der Zeilenhöhen */
        .VG-box-top { font-weight: bold; color: var(--linkcolor2);}
        .VG-box-middle { border: 1px solid #eee; border-radius: 4px; display: flex; justify-content: center; align-items: center; background-color: #FFFFFF; vertical-align: center;}
        .VG-box-bottom { background-color: #FFFFFF; border-radius: 4px; text-align: right; padding: 15px; padding-bottom: 0px;}

        /* ========================================================
           TABLET-ANSICHT (1000px bis 1200px)
           ======================================================== */
        @media (max-width: 1200px) {
            .VG-container {
                grid-template-columns: repeat(3, 1fr); /* 3 Spalten nebeneinander */
            }

            /* Die 4. Spalte auf Tablets verstecken */
            .VG-column-link:nth-child(4) {
                display: none;
            }
        }

        /* ========================================================
           SMARTPHONE-ANSICHT (Unter 1000px)
           ======================================================== */
        @media (max-width: 800px) {
            .VG-container {
                grid-template-columns: 1fr; /* Alles in einer Spalte untereinander */
                gap: 25px; 
            }

            .VG-column-link {
                grid-template-rows: auto; /* Schaltet Subgrid-Kopplung ab */
            }

            /* Die 4. Spalte auf dem Smartphone wieder aktivieren */
            .VG-column-link:nth-child(4) {
                display: grid; 
            }
        }