/* =========================
   CARD LAYOUT STABILITY
   ========================= */

.card-box {
    display: flex;
    flex-direction: column;
    text-align: center;
}

/* =========================
   RESPONSIVE IMAGE FIX
   (prevents huge images on resize)
   ========================= */

.card-box img {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
}


/* =========================
   EQUAL CARD HEIGHT FIX
   ========================= */

.row {
    display: flex !important;
    flex-wrap: wrap !important;
}

.col-md-3 {
    width: 25% !important;
    flex: 0 0 25% !important;
    max-width: 25% !important;
}

/* ensures full vertical structure inside card */
.card-box img {
    width: 80%;
    max-width: 80%;
    height: auto;
    display: block;
    margin: 0 auto;   /* centers image */
}

.card-img-top {
    width: 100%;
    height: 150px; 
    object-fit: cover; 
    display: block;
}

img[src="images/ALMANCA_isik.jpg"],
img[src="images/HIRVATCA_isik.jpg"],
img[src="images/HOLLANDACA_isik.jpg"],
img[src="images/IBRANICE_isik.jpg"],
img[src="images/INGILIZCE_isik.jpg"],
img[src="images/ISPANYOLCA_isik.jpg"],
img[src="images/LEHCE_isik.jpg"],
img[src="images/PORTEKIZCE_isik.jpg"],
img[src="images/RUSCA_isik.jpg"],
img[src="images/SIRPCA_isik.jpg"],
img[src="images/TURKCE_isik.jpg"] {
    width: 85%;
    max-width: 85%;
    height: auto;
    display: block;
    margin: 0 auto;
}

img[src="images/ALMANCA_secmeler.jpg"],
img[src="images/ARAPCA_secmeler.jpg"],
img[src="images/FARSCA_secmeler.jpg"],
img[src="images/FRANSIZCA_secmeler.jpg"],
img[src="images/HOLLANDACA_secmeler.jpg"],
img[src="images/IBRANICE_secmeler.jpg"],
img[src="images/INGILIZCE_secmeler.jpg"],
img[src="images/ISPANYOLCA_secmeler.jpg"],
img[src="images/ITALYANCA_secmeler.jpg"],
img[src="images/PORTEKIZCE_secmeler.jpg"],
img[src="images/RUSCA_secmeler.jpg"],
img[src="images/TURKCE_secmeler.jpg"] {
    width: 85%;
    max-width: 85%;
    height: auto;
    display: block;
    margin: 0 auto;
}


img[src="images/ALMANCA_uzay.jpg"],
img[src="images/HOLLANDACA_uzay.jpg"],
img[src="images/IBRANICE_uzay.jpg"],
img[src="images/INGILIZCE_uzay.jpg"],
img[src="images/ISPANYOLCA_uzay.jpg"],
img[src="images/PORTEKIZCE_uzay.jpg"],
img[src="images/RUSCA_uzay.jpg"],
img[src="images/TURKCE_uzay.jpg"] {
    width: 85%;
    max-width: 85%;
    height: auto;
    display: block;
    margin: 0 auto;
}



/* 4. Footer styling */
.card-footer-line {
    width: 100%;
    height: 6px;
display: block;
    margin-top: auto; /* Keeps footer pinned to the bottom */
}


/* This targets any image with the class "card-img-top" */
.card-img-top {
    width: 100%;
    height: 150px;      /* Consistent height for all cards */
    object-fit: cover;  /* Crops the image to fit without distortion */
    display: block;
}


/* 3. Text styling: Keeps mobile text clean */
.card-content p {
    margin: 0 0 5px 0;      /* Adds a little space below each paragraph */
    line-height: 1.4;       /* Standard, readable spacing */
    font-size: 14px;
}

.card-title {
    font-weight: bold;
    padding-top: 10px;
    word-wrap: break-word;     /* Traditional browser support */
    word-break: break-word;    /* Forces the break if the word is too long */
    hyphens: auto;             /* Tries to add a dash (-) where appropriate */
}

/* MOBILE FIX */
@media (max-width: 768px) {

    .col-md-3 {
        width: 70% !important;
        flex: 0 0 70% !important;
        max-width: 70% !important;
        margin: 0 auto;
    }

    .card-box img {
        width: 70%;
        max-width: 70%;
        margin: 0 auto;
    }

}