.card-container {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: flex-start; /* Karten sind zuerst links ausgerichtet */
    width: 100%;
    max-width: 1600px; /* Maximale Breite des Containers */
	
}

.card {
    width: calc(33.333% - 20px); /* 3 Karten pro Reihe, mit Abstand */
    background-color: #2c2c2c; /* Dunkler Hintergrund für die Karte */
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Hellerer Schatten für besseren Kontrast */
    overflow: hidden;
    text-align: left;
	transition: transform 0.3s ease; /* Sanfter Übergang für den Zoom-Effekt */
}

.card:hover {
    transform: scale(1.05); /* Zoom-Effekt: Karte wird leicht vergrößert */
}

.card-image {
    width: 100%; /* Breite des Bildes füllt den Container */
    height: auto; /* Höhe wird automatisch angepasst, um das Seitenverhältnis zu wahren */
}

.card-content {
    padding: 15px;
    text-align: left;
}

.card-title {
    font-size: 1.5em;
    margin-bottom: 10px;
    color: #ffffff; /* Weißer Text für den Titel */
}

.card-text {
    font-size: 1em;
    color: #d0d0d0; /* Hellgrauer Text für den Inhalt */
}

/* Responsive Anpassungen */
@media (max-width: 1200px) {
    .card {
        width: calc(50% - 100px); /* Zwei Karten pro Reihe auf mittleren Bildschirmen */
		 
    }
}

@media (max-width: 768px) {
    .card {
        width: calc(60% - 40px); /* Eine Karte pro Reihe, mit Abstand auf beiden Seiten */
       
    }
}

.image-container {
    position: relative;
    width: 100%;
    height: auto;
}

.platzhalter-img {
	background-image: url('https://images.grasshalmserien.de/image/gserien-hintergrund-540p.png');
	background-size: cover;
	background-position: center;	
}

.time-overlay {
    position: absolute;
    bottom: 8px;
    right: 8px;
    background-color: rgba(0, 0, 0, 0.75);
    color: #fff;
    padding: 4px 10px;
    font-size: 0.85rem;
    border-radius: 8px;
    pointer-events: none;
}


.exclusive-overlay {
    position: absolute;
    bottom: 8px;
    right: 8px;
    background-color: rgba(0, 0, 0, 0.75);
    color: #fff;
    padding: 4px 10px;
    font-size: 0.85rem;
    border-radius: 8px;
    pointer-events: none;
}