/* =========================================
   WEBSITEPRO – HEADER (clean v1)
   - Sticky, stabil, nincs shrink JS
   - Nincs felesleges layout-transition
   ========================================= */

.site-header {
    position: sticky;
    top: 0;
    z-index: 60;

    background: var(--bg);
    border: 0;
    box-shadow: none;
}

/* Ugyanaz a szélesség, mint a .section .inner */
.header-inner {
    max-width: min(1360px, 96vw);
    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: flex-start;

    /* A sectionnél van oldalsó safe-area padding, a headernél is legyen */
    padding: 18px var(--page-px) 14px;
    padding-left: calc(var(--page-px) + env(safe-area-inset-left));
    padding-right: calc(var(--page-px) + env(safe-area-inset-right));
}

/* Logo blokk */
.logo {
    display: inline-flex;
    align-items: center;
    background-color: white;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;
    border-radius: 14px;
}

/* Ha a logó kép klikkelhető link, ne “ugráljon” */
.logo:active {
    transform: translateY(0);
}

/* Logo kép */
.logo__img {
    display: block;
    height: 104px;
    width: auto;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    border-radius: 10px;

    /* transform transition csak akkor kell, ha tényleg animálod */
    transition: none;
}

/* ha valahol maradna logo__text, ne látszódjon */
.logo__text {
    display: none;
}

/* Spacer */
.spacer {
    flex: 1;
}

/* Mobil: kisebb és stabilabb logó */
@media (max-width: 768px) {
    .header-inner {
        padding: 14px var(--page-px) 10px;
        padding-left: calc(var(--page-px) + env(safe-area-inset-left));
        padding-right: calc(var(--page-px) + env(safe-area-inset-right));
    }

    .logo__img {
        height: 52px;
    }
}