.h1_inn{
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 16px 0;
    color: #1a1a1a;
    text-transform: none;
}

/* === WRAPPER STOPKI === */
#foot_inn {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    #foot_inn {
        padding: 24px 16px;
    }
}

/* === STOPKA - siatka 2x2: O firmie / Newsletter / Pomoc / Sociale === */
#f.clear {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    column-gap: 60px;
    row-gap: 32px;
    align-items: start;
}

#f .box,
#f .data,
#f .links,
#f .social,
#f .newsletter {
    float: none !important;
    clear: none !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
}

/* Newsletter wyrównany do prawej strony treści (input i tak jest full-width) */
#f .newsletter {
    text-align: right;
}

#f .newsletter .cnt,
#f .newsletter form {
    text-align: left; /* input z powrotem wyrównany normalnie */
}

/* Social wyrównane do prawej, żeby wizualnie "trzymało się" newslettera nad nim */
#f .social ul.icons {
    display: flex;
    gap: 10px;
    float: none !important;
    justify-content: flex-end;
}

#f .social h5 {
    text-align: right;
    float: none !important;
}


/* Na dużych ekranach: prawa kolumna (Newsletter/Social) max 1/4 kontenera */
@media (min-width: 1024px) {
    #f.clear {
        grid-template-columns: 3fr 1fr;
    }
}

/* === MOBILE: jedna kolumna, kolejność jak w HTML === */
@media (max-width: 768px) {
    #f.clear {
        grid-template-columns: 1fr;
        row-gap: 24px;
    }

    #f .newsletter,
    #f .newsletter h4,
    #f .newsletter .cnt,
    #f .social h5,
    #f .social ul.icons {
        text-align: left !important;
        justify-content: flex-start !important;
    }
}