/* =========================================================
   LOGO (img) – poprawne zachowanie w Gravity:
   - #header.alt  (landing/home): większe logo
   - #header      (podstrony): mała belka, małe logo
   - #titleBar    (mobile): małe logo w górnym pasku
   ========================================================= */

/* Wspólne: link logo ma się zachowywać jak dawny tekst */
#header #logo a {
    display: inline-flex;
    align-items: center;
    height: inherit;
    line-height: inherit;
}

/* PODSTRONY: header bez .alt = niska belka -> logo MUSI być małe */
#header:not(.alt) #logo img.site-logo {
    height: 42px; /* dopasowane do wysokości paska */
    width: auto;
    display: block;
}

/* STRONA GŁÓWNA: header.alt = duży header -> logo może być większe */
#header.alt #logo img.site-logo {
    height: 130px; /* tu możesz regulować “duże” logo */
    width: auto;
    display: block;
}

/* Breakpoint z main.css: header ma mniejszą wysokość (3.85em) */
@media screen and (max-width: 1280px) {
    #header:not(.alt) #logo img.site-logo {
        height: 34px;
    }
}

/* MOBILE: tylko pasek #titleBar (tu zostaje małe logo u góry) */
@media screen and (max-width: 736px) {
    #titleBar .title a {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 44px;
    }

    #titleBar .title img.site-logo {
        height: 36px; /* Twoje “dobre małe” logo na telefonie */
        width: auto;
        max-width: 78vw;
        display: inline-block;
    }
}

/* =========================================================
   STOPKA: copyright w 3 liniach
   ========================================================= */
#footer .copyright .copyright-line {
    display: block;
    margin-top: 0.35em;
}

#footer .copyright .copyright-line:first-child {
    margin-top: 0;
}

/* Kontakt: równe boxy + responsywna mapa */
.contact-split .box {
    height: 100%;
}

.contact-map {
    width: 100%;
    aspect-ratio: 16 / 10;
    min-height: 320px;
    overflow: hidden;
    border-radius: 6px;
}

.contact-map iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

/* Kontakt: wyśrodkuj przyciski */
.contact-actions {
    justify-content: center;
}

.masonry {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    max-width: 1400px;
    margin: auto;
}
.masonry-item {
    margin: 8px;
    width: calc(25% - 16px);
    position: relative;
}
.masonry-item a {
    display: block;
    position: relative;
}
.masonry-item img,
.masonry-item video {
    width: 100%;
    border-radius: 5px;
    display: block;
    transition: transform 0.3s;
}
.masonry-item video {
    aspect-ratio: 16 / 9;
    background: #111;
    object-fit: cover;
}
.masonry-item a:hover img,
.masonry-item a:hover video {
    transform: scale(1.03);
}
.gallery-video-play {
    align-items: center;
    background: rgba(0, 0, 0, 0.62);
    border: 2px solid rgba(255, 255, 255, 0.86);
    border-radius: 999px;
    display: flex;
    height: 3.5rem;
    justify-content: center;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 3.5rem;
}
.gallery-video-play::before {
    border-bottom: 0.72rem solid transparent;
    border-left: 1.05rem solid #fff;
    border-top: 0.72rem solid transparent;
    content: "";
    display: block;
    margin-left: 0.22rem;
}
@media (max-width: 1024px) {
    .masonry-item {
        width: calc(33.33% - 16px);
    }
}
@media (max-width: 768px) {
    .masonry-item {
        width: calc(50% - 16px);
    }
}
