@charset "utf-8";
/* Grundinställningar */
body {
    margin: 0;
    font-family: Arial, sans-serif;
    background-color: #f4f4f4;
}

/* Container */
.container {
    width: 80%;
    margin: 0 auto;
    padding: 20px 0;
}

/* Inlägg */
.post {
    display: flex;
    background-color: #fff8cc;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 10px;
    margin-bottom: 20px;
}

/* Bild */
.post img {
    width: 200px;
    height: auto; /* Ändrat från 100% för att inte sträcka bilder */
    object-fit: cover;
    padding: 10px; /* Lite mindre padding för att spara plats */
    border-radius: 8px;
}

/* Text */
.post-content {
    padding: 15px;
    flex: 1; /* Gör att texten tar upp resten av utrymmet bredvid bilden */
}

.post-content h2, .post-content h1 {
    margin-top: 0;
    font-size: 1.5rem;
}

.post-content p {
    line-height: 1.6;
}

.kursiv-mindre {
    font-style: italic;
    font-weight: normal;
    font-size: 0.85rem;
}
/* Specialstyling för loggorna i botten */
.footer-logos {
    justify-content: center; /* Centrerar innehållet horisontellt */
}

.logo-grid {
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    flex-wrap: wrap; /* Tillåter radbrytning om det blir trångt */
}

.logo-grid img {
    width: auto !important; /* Behåller originalproportioner */
    max-width: 150px;       /* Begränsar storleken så de inte blir jättestora */
    height: auto;
    margin: 10px;
}
/* Stil för samarbetslistor */
.partner-lista {
    list-style-type: none; /* Tar bort standardprickarna */
    padding-left: 5px;     /* Minskar indraget eftersom prickarna är borta */
    margin-bottom: 20px;
}

.partner-lista li {
    margin-bottom: 8px;    /* Ger lite luft mellan länkarna */
}

.partner-lista a {
    text-decoration: none; /* Tar bort understrykningen om så önskas */
    color: #0056b3;        /* En klassisk länkblå färg */
}

.partner-lista a:hover {
    text-decoration: underline; /* Visar understrykning när man för musen över */
}
/* ========================= */
/* 📱 MOBILANPASSNING        */
/* ========================= */

@media (max-width: 768px) {
    .container {
        width: 95% !important;
        padding: 10px 0;
    }

    .post {
        /* Detta tvingar innehållet att staplas vertikalt */
        flex-direction: column; 
        display: flex; 
        align-items: center; /* Centrerar bilden i mitten */
        text-align: center;
    }

    .post img {
        /* Tar bort den fasta bredden på 200px */
        width: 100% !important; 
        max-width: 300px; /* Hindrar loggor från att bli gigantiska */
        height: auto !important;
        padding: 10px;
    }

    .post-content {
        padding: 15px;
        text-align: left; /* Texten förblir lättläst från vänster */
    }

    /* Fix för sista rutan med flera loggor  */
    .logo-grid {
        flex-direction: column !important;
    }
}