/* Modifikator bilder-hoch bei Aufruf von GridCards
- die Werte wirken nur auf eingebettetes Plugin PicSlide; ansonsten wirklungslos
- umschließender Container (Grid-Element) steuert Werte in anderem Plugin (PicSlide)
- damit kann das Standardaussehen von PicSlide per GridCards übersteuert werden
- alle zulässigen Variablen von PicSlide sind in der plugin.css von PicSlide dokumentiert
- per GridCard-Modifikator können einzelne PicSlide-Aufrufe individuell abgewandelt werden
*/
.gc-grid.bilder-hoch {
    --picslide-frame-ratio: 1 / 2;
    --picslide-frame-max-height: 48rem;
    --picslide-image-fit: cover;
    --picslide-image-position: center top;
}

/* Fotos in GridCards sollen gleich hoch sein und sich responsive Verhalten
- dazu zwei Modifikatoren in Kombination
- bilder-einheitlich + eine der Formvarianten
*/
/* Gemeinsames Verhalten */
.gc-grid.bilder-einheitlich {
    --gc-img-width: 100%;
    --gc-img-height: auto;
    --gc-img-max-height: none;
    --gc-img-fit: cover;
    --gc-img-position: center;
    --gc-img-margin-start: 0;
    --gc-img-margin-end: 0;
}

/* Formatvarianten */
.gc-grid.bildformat-hoch {
    --gc-img-ratio: 3 / 4;
}

.gc-grid.bildformat-quer {
    --gc-img-ratio: 4 / 3;
}

.gc-grid.bildformat-breit {
    --gc-img-ratio: 16 / 9;
}

.gc-grid.bildformat-quadrat {
    --gc-img-ratio: 1 / 1;
}