:root {
    --red-verylight: #ffe3e3;
    --red-light: #ffc9c9;
    --red-mid: #ff8f8f;
    --red-strong: #e53935;
    --red-deep: #b71c1c;
    --text: #1a1a1a;
    --project-radius: 16px;
    --project-red1: #e53935;
    --project-red2: #b71c1c;
    --project-grad: linear-gradient(135deg,var(--project-red1),var(--project-red2));
}

* {
    box-sizing: border-box;
}
html, body {
    margin: 0;
    padding: 0;
    max-width: 100%;
}
html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    font-family: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
    color: var(--text);
    background-color: white;
    line-height: 1.45;
}

/* Social */
.social-bar {
    display: flex;
    justify-content: center;
    gap: 16px;
    padding: 8px 12px;
    background-color: var(--red-verylight);
}

.social-link {
    display: inline-flex;
    width: 26px;
    height: 26px;
    border-radius: 6px;
    overflow: hidden;
}

    .social-link img {
        width: 100%;
        height: 100%;
        display: block;
    }

/* Logo */
.logo {
    display: grid;
    place-items: center;
    padding: 20px 12px;
    background-color: white;
}

    .logo img {
        max-width: min(100%,1100px);
        height: auto;
        display: block;
    }


/* Nawigacja */
.nav-wrap {
    position: sticky;
    top: 0; /* przyklej do samej góry */
    align-items: center;
    justify-content: center; /* na desktopie menu na środku */
    background: linear-gradient(to right, var(--red-verylight), var(--red-light), var(--red-mid), var(--red-strong), var(--red-deep), var(--red-strong), var(--red-mid), var(--red-light), var(--red-verylight) );
    color: white;
    cursor: pointer;
    z-index: 10;
}

/* Hamburger */
.nav-toggle {
    display: none;
    top: 0px;
    background: none;
    border: none;
    cursor: pointer;
    margin-left: auto;
    padding: 5px 10px;
}

    .nav-toggle .bar {
        display: block;
        width: 26px;
        height: 3px;
        background-color: white;
        margin: 5px 0;
        border-radius: 2px;
    }
/* Menu poziome na desktopie */
.menu {
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: stretch;
    margin: 0;
    padding: 0;
}

    .menu > li {
        position: relative;
        flex: 1 1 0;
    }

    .menu a {
        display: block;
        text-align: center;
        padding: 14px 18px;
        text-decoration: none;
        color: white;
        font-weight: 700;
        letter-spacing: .2px;
        text-shadow: 0 1px 1px #00000026;
    }

        .menu a:hover {
            background: #ffffff1f;
        }

/* Submenu */
.submenu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background-color: white;
    color: #333;
    box-shadow: 0 6px 18px rgba(0,0,0,.15);
    z-index: 10;
    border-radius: 10px;
    overflow: hidden
}

    .submenu li a {
        text-align: left;
        color: #333;
        background: var(--white);
        padding: 12px 16px;
        font-weight: 600;
    }

        .submenu li a:hover {
            background: #f2f2f2;
        }

.has-submenu:hover > .submenu {
    display: block;
}

@media (min-width: 901px) {
    /* wrapper nie wpływa na layout – dzieci traktowane jakby były bezpośrednio w li */
    .menu-row {
        display: contents;
    }

    /* strzałka tylko na mobile */
    .submenu-toggle {
        display: none;
    }
}
/* MOBILE */
@media (max-width: 900px) {
    .nav-wrap {
        justify-content: flex-end; /* wyrównaj hamburger do prawej */
        background: var(--red-verylight); /* stały jasny kolor */
    }

    .nav-toggle {
        display: block; /* pokaż hamburger */
    }

    .menu {
        display: none; /* ukryj menu poziome */
        flex-direction: column;
        background: linear-gradient(to bottom, #e53935, #b71c1c);
    }

        .menu.is-open {
            display: flex;
        }

        .menu a {
            text-align: left;
            background: #ffffff14;
            border-radius: 10px;
            margin: 6px 0;
            padding: 14px 14px;
            display: block;
        }

            .menu a:hover {
                background: #ffffff24;
            }

    .submenu {
        display: block; /* zawsze block, animujemy max-height */
        overflow: hidden; /* ukryj zawartość gdy zamknięte */
        max-height: 0; /* zamknięte */
        transition: max-height .3s ease; /* płynne rozsunięcie */

        position: static;
        width: 100%;
        background-color: white; /* białe tło */
        /*margin: 4px 0 8px 16px;*/ /* odsunięte od głównego linku */
        border-radius: 8px;
        box-shadow: 0 1px 0 #eee inset;
    }

        .submenu li a {
            background-color: white;
            color: #333;
            padding: 12px 16px;
            margin: 0;
            border-bottom: 1px solid #eee;
            border-radius: 0;
        }

        .submenu li:last-child a {
            border-bottom: 0;
        }

        .submenu li a:hover {
            background: #f5f5f5;
        }

    .menu-row {
        position: relative; /* kotwica dla strzałki */
        display: flex;
        align-items: center; /* ładne wyrównanie pionowe */
        text-align: left;
        background-color: transparent;
        border-radius: 10px;
        margin: 6px 0;
        display: block;
    }

        .menu-row .menu-link {
            flex: 1 1 auto;
            color: inherit;
            text-decoration: none;
            display: block;
        }

    /* Strzałka rozwijania podmenu */
    .submenu-toggle {
        position: absolute;
        right: 10px;
        top: 50%; /* połowa wysokości rodzica */
        transform: translateY(-50%); /* przesunięcie w górę o połowę własnej wysokości */
        width: 28px;
        height: 28px;
        border: 0;
        background: transparent;
        color: #fff;
        cursor: pointer;
        line-height: 1;
    }

        .submenu-toggle::before {
            content: '▾';
            font-size: 18px;
            transition: transform .2s ease;
            display: inline-block;
        }

    .has-submenu.open .submenu-toggle::before {
        transform: rotate(180deg);
    }
    /*        .has-submenu > a::after {
            content: '▾';
            margin-left: 8px;
            transition: transform .2s ease;
        }

    .has-submenu.open > a::after {
        transform: rotate(180deg);
    }*/
}



/* main */
main {
    max-width: 1100px;
    margin: 24px auto;
    padding: 0 16px 48px;
}

/* Bajka */
.bajka {
    background: #fff; /* jasne tło */
    border-radius: 18px;
    padding: 32px 24px;
    margin: 0 auto 48px;
    max-width: 900px; /* opcjonalnie: zawężony tekst dla lepszej czytelności */
    box-shadow: 0 6px 20px rgba(0,0,0,.08); /* delikatny cień */
}

.bajka-title {
    font-size: 2.4rem;
    text-align: center;
    margin-bottom: 24px;
    background: var(--red-strong);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: 'Marck Script', cursive;
    letter-spacing: 0.05em;
}

.bajka p {
    font-size: 1.1rem;
    line-height: 1.7;
    margin: 16px 0;
}

    .bajka p::first-letter {
        font-size: 2rem; /* większa litera */
        font-weight: bold;
        color: #e53935;
        display: inline-block; /* żeby zadziałał vertical-align */
        vertical-align: baseline; /* dół litery na linii bazowej */
        line-height: 1; /* bez dodatkowego odstępu */
        margin-right: 2px; /* odstęp od reszty tekstu */
        font-family: 'Marck Script', cursive; /* bajkowy font */
    }

.bajka-signature {
    font-family: 'Marck Script', cursive; /* odręczny krój */
    font-size: 1.8rem;
    color: #444;
    font-style: italic;
    text-align: right; /* podpis do prawej */
    margin-top: 32px;
    transform: rotate(1deg);
}

/* Sekcje */
section {
    padding: 48px 0;
    border-bottom: 1px solid #ececec;
}

    section h2 {
        margin: 0 0 12px;
        padding: 5px 0;
        font-size: 1.7rem;
        text-align: center;
        background-color: var(--red-light);
        width: 100vw; /* pełna szerokość viewportu */
        margin-left: calc(-50vw + 50%); /* przesunięcie, żeby wyrównać do krawędzi okna */
    }

    section h3 {
        margin: 0 0 12px;
        padding: 5px 0;
        font-size: 1.5rem;
        text-align: center;
        background-color: var(--red-verylight);
        width: 100vw; /* pełna szerokość viewportu */
        margin-left: calc(-50vw + 50%); /* przesunięcie, żeby wyrównać do krawędzi okna */
    }


.row {
    display: flex;
    align-items: center; /* wyrównanie pionowe ikony i tekstu */
    gap: 15px; /* odstęp między ikoną a tekstem */
    margin: 20px 0;
}

    .row .icon img {
        width: 40px; /* dostosuj wielkość ikonki */
        height: 40px;
    }

    .row .text {
        flex: 1; /* tekst zajmuje resztę miejsca */
    }

/* Projekty */
.project-section {
    padding: 56px 0;
    background-color: white;
}

.project-wrap {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 16px;
}

.project-logo {
    display: grid;
    place-items: left;
    background-color: white;
}

    .project-logo img {
        max-width: min(50%,600px);
        height: auto;
        display: block;
    }

.project-tabs {
    display: flex;
    flex-wrap: wrap; 
    gap: 8px;
    margin: 18px 0 12px;
}

    .project-tabs button {
        padding: 8px 14px;
        border-radius: 10px;
        border: 1px solid #eee;
        background-color: var(--red-mid);
        cursor: pointer;
    }

        .project-tabs button.is-active {
            background: var(--project-grad);
            color: #fff;
            border-color: transparent;
        }

.project-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 16px;
}

@media (max-width:980px) {
    .project-grid {
        grid-template-columns: repeat(2,1fr);
    }
}

@media (max-width:640px) {
    .project-grid {
        grid-template-columns: 1fr;
    }
}

.project-card {
    background-color: white;
    border: 1px solid #eee;
    border-radius: var(--project-radius);
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    box-shadow: 0 6px 18px rgba(0,0,0,.04);
}

    .project-card img {
        width: 100%; /* obrazek wypełnia szerokość karty */
        height: auto;
        object-fit: cover; /* przycięcie tak, żeby zachować proporcje */
        border-radius: 12px 12px 0 0; /* zaokrąglone rogi u góry (jak karta) */
        margin-bottom: 12px; /* odstęp od tytułu */
        display: block; /* usuwa ewentualne „dziury” pod obrazem */
    }

.project-card__title {
    margin: 0;
    font-size: 1.05rem;
}

.project-card__meta {
    margin: 0;
    color: var(--red-mid);
    font-size: .92rem;
}

.project-card__desc {
    margin: 0;
    color: #333;
}

.project-card__actions {
    margin-top: auto;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.btn {
    display: inline-block; /* a i button zachowują się tak samo */
    text-align: center; /* tekst zawsze na środku */
    padding: 8px 12px;
    border-radius: 10px;
    border: 1px solid #ddd;
    cursor: pointer;
    text-decoration: none;
    font-weight: 600;
    transition: all .2s ease;
}

.btn-primary {
    background: var(--project-grad); 
    color: #fff;
    border: none;
}

    .btn-primary:hover {
        filter: brightness(1.1); /* lekkie rozjaśnienie */
        box-shadow: 0 4px 12px rgba(229,57,53,.35); /* czerwony cień */
    }

.btn-ghost {
    background: #fff;
    color: var(--red-strong);
    border: 2px solid var(--red-strong);
}

    .btn-ghost:hover {
        background: var(--red-strong);
        color: #fff;
        box-shadow: 0 4px 12px rgba(229,57,53,.25);
    }

.project-modal {
    position: fixed;
    inset: 0;
    display: none;
    place-items: center;
    background: rgba(0,0,0,.5);
    padding: 20px;
    z-index: 15;
    /* pozwól przewijanie, gdy dialog jest wyższy niż viewport */
    overflow: auto;
}
.project-modal__dialog {
    position: relative;
    background: #fff;
    max-width: 780px;
    width: 100%;
    max-height: 90vh;
    overflow: auto; /* scroll w środku */
    -webkit-overflow-scrolling: touch;
    padding: 0 20px 20px 20px;
    border-radius: 18px;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
    box-sizing: border-box;
    z-index: 1; /* wystarczy, bo overlay ma 1500 */
}
/* Krzyżyk (sticky) */
.project-modal__close {
    position: sticky;
    top: 0;
    float: right; /* wystarczy wyrzucić w prawo */
    font-size: 22px;
    border: none;
    background: transparent;
    cursor: pointer;
    z-index: 3; /* nad h4 */
}
/* Pasek nagłówka (sticky) */
.project-modal__dialog > h4 {
    position: sticky;
    top: 0;
    background: #fff;
    font-size: 1.5rem;
    margin: 0;
    padding: 12px 56px 12px 10px; /* miejsce na X */
    box-shadow: 0 6px 12px rgba(0,0,0,.05);
    z-index: 2; /* poniżej krzyżyka */
}
/* Obrazy w raporcie, żeby nie „wychodziły” */
.project-modal__dialog img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
}

.project-modal[aria-hidden="false"] {
    display: grid;
}
/* MODALE — poprawki przewijania */
body.no-scroll {
 /*   position: fixed;*/
    overflow: hidden;
}

/* Wspieranie w projektach*/
.donate-callout {
    padding: 5px 18px 15px 18px;
    border: 1px solid #eee;
    border-left: 6px solid var(--red-strong);
    background: var(--red-verylight);
    border-radius: 14px;
    margin-top: 16px;
}

.donate-callout__text {
    display: grid;
    gap: 10px;
}

.donate-callout__title {
    display: inline-block;
    padding: 6px 10px;
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 8px;
    color: var(--red-strong);
    font-weight: 700;
    letter-spacing: .2px;
    margin: 0;
}


.gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
    margin-top: 24px;
    justify-items: center; 
}

    .gallery img {
        width: 90%;
        height: auto;
        border-radius: 12px;
        cursor: pointer;
        transition: transform .2s ease;
    }

        .gallery img:hover {
            transform: scale(1.02);
        }
/* Lightbox */
.lightbox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.8);
    display: flex;
    justify-content: center;
    align-items: center;
    visibility: hidden;
    opacity: 0;
    transition: opacity .3s ease;
    z-index: 7;
}

    .lightbox[aria-hidden="false"] {
        visibility: visible;
        opacity: 1;
    }

.lightbox-img {
    max-width: 90%;
    max-height: 80%;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,.5);
}

.lightbox-close {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 40px;
    color: #fff;
    cursor: pointer;
}

.lightbox-prev, .lightbox-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 48px;
    color: #fff;
    cursor: pointer;
    padding: 12px;
    user-select: none;
}

.lightbox-prev {
    left: 20px;
}

.lightbox-next {
    right: 20px;
}

    .lightbox-prev:hover, .lightbox-next:hover {
        color: #ddd;
    }

/* Statut */
.statut-title {
    font-size: 1.4rem;
    margin-bottom: 30px;
    text-align: center;
}

.pdf-icon {
    width: clamp(150px, 30%, 450px); /* elastyczna, z limitem */
    height: auto;
    display: block;
    margin: 0 auto 0px;
}

.statut-link:hover .pdf-icon {
    transform: scale(1.1); /* delikatne powiększenie przy hover */
}

/* Stopka */
.footer {
    background-color: var(--red-light);
    color: black;
    padding: 20px;
    position: relative;
    width: 100%;
    text-align: center;
    font-size: 80%;
}

/*    .footer p a {
        color: white;
        text-align: center;
        padding: 14px 30px;
    }*/

/* Partnerzy */
.partners-support-intro {
    text-align: center;
    margin: 24px 0 32px;
}

    .partners-support-intro h4 {
        margin: 0 0 10px;
        font-size: 1.6rem;
        color: var(--red-strong);
        background-color: white;
        text-align: center;
    }

    .partners-support-intro p {
        margin: 0 0 16px;
        font-size: 1.06rem;
        color: #444;
    }

.partners-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

    .partners-actions .btn {
        min-width: 160px;
        text-align: center;
        font-weight: 600;
    }

.partners-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 16px;
    margin-top: 16px;
}

.partner-card {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid #ddd; /* neutralna, jasna ramka */
    border-radius: 14px;
    padding: 16px;
    box-shadow: 0 4px 12px rgba(0,0,0,.08); /* subtelny cień */
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    height: 170px; 
}

    .partner-card img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
        display: block;
        transition: transform .25s ease, filter .25s ease;
    }

    .partner-card:hover,
    .partner-card:focus-visible {
        transform: translateY(-2px); /* delikatne uniesienie */
        box-shadow: 0 6px 18px rgba(0,0,0,.15); /* mocniejszy cień */
        border-color: #ccc; /* subtelna zmiana ramki */
    }

        .partner-card:hover img,
        .partner-card:focus-visible img {
            transform: scale(1.1); /* powiększenie logo */
        }

/* węższe przerwy na bardzo małych ekranach */
@media (max-width: 420px) {
    .partners-grid {
        gap: 12px;
    }
}

/* Kontakt */
.contact-card {
    background-color: white;
    border: 1px solid #eee;
    border-radius: 18px;
    padding: 20px;
    box-shadow: 0 6px 18px rgba(0,0,0,.05);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 30px;
    max-width: 1100px;
    margin: 0 auto;
}

.contact-block {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 1rem;
    line-height: 1.5;
}

.contact-icon img {
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}

.btn-copy {
    margin-top: 6px;
    padding: 6px 10px;
    font-size: 0.9rem;
    border-radius: 8px;
    border: 1px solid #ddd;
    background: var(--red-mid);
    color: #fff;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease;
}

    .btn-copy:hover {
        background: var(--red-strong);
        transform: translateY(-1px);
    }

    .btn-copy:active {
        transform: translateY(0);
    }

/* Mobile: jedna kolumna */
@media (max-width: 720px) {
    .contact-card {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

/* Weszpryj nas*/
/* siatka kart (3 kolumny, wyśrodkowana szerokość) */
.support-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
    gap: 16px;
    max-width: 1100px; /* centrowanie całości */
    margin: 0 auto;
    padding: 0 16px;
}

@media (max-width: 980px) {
    .support-grid {
        grid-template-columns: repeat(2,1fr);
    }
}

@media (max-width: 560px) {
    .support-grid {
        grid-template-columns: 1fr;
    }
}

/* karta */
.support-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 16px;
    padding: 16px;
    box-shadow: 0 6px 18px rgba(0,0,0,.05);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

    .support-card h3 {
        margin: 0 0 2px;
        font-size: 1.15rem;
        color: #222;
        background: none;
        width: auto;
        margin-left: 0;
        padding: 0;
        box-shadow: none;
    }

/* listy w kartach – mniejsze odstępy */
.support-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .support-list li {
        margin: 4px 0;
        line-height: 1.4;
    }

.muted {
    font-size: .92rem;
    color: #555;
}

/* IBAN – delikatne wyróżnienie bez ramki */
.iban-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
    flex-wrap: wrap;
}

    .iban-row span {
        font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
        color: var(--red-strong);
        font-weight: 600;
        letter-spacing: 1px;
    }

/* przycisk kopiuj */
.btn-copy {
    padding: 6px 10px;
    font-size: 0.9rem;
    border-radius: 8px;
    border: 1px solid #ddd;
    background: var(--red-mid);
    color: #fff;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
}

    .btn-copy:hover {
        background: var(--red-strong);
        transform: translateY(-1px);
    }

    .btn-copy:active {
        transform: translateY(0);
    }

/* --- zakładki na przelewy pl/zagraniczne --- */
.transfer-tabs {
    display: flex;
    gap: 8px;
    margin-top: 2px;
    margin-bottom: -10px; /* zakładka „wchodzi” na panel */
}

.tab-btn {
    position: relative;
    padding: 10px 16px;
    background: #eeeeee;
    border: 1px solid #cccccc;
    border-bottom: none; /* łączy się z kartą poniżej */
    border-radius: 10px 10px 0 0; /* zaokrąglony „języczek” */
    font-weight: 700;
    color: #444;
    cursor: pointer;
    transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}

    .tab-btn:hover {
        background: #f6f6f6;
    }

    .tab-btn.is-active {
        background: #fff;
        color: var(--red-strong);
        box-shadow: 0 10px 18px rgba(0,0,0,.06);
        z-index: 2;
    }

/* panel z danymi – „karta” */
.transfer-panels {
    border: 1px solid #cccccc;
    border-radius: 0 0px 12px 12px;
    background: #fff;
    padding: 14px 14px 10px;
    box-shadow: 0 6px 16px rgba(0,0,0,.03);
}

.transfer-panel {
    display: none;
}

    .transfer-panel.is-active {
        display: block;
    }

/*.support-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 24px;
    margin-top: 24px;
    max-width: 1100px; 
    margin-left: auto;
    margin-right: auto; 
}

@media (max-width: 980px) {
    .support-grid {
        grid-template-columns: repeat(2,1fr);
    }
}

@media (max-width: 560px) {
    .support-grid {
        grid-template-columns: 1fr;
    }
}

.support-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 16px;
    padding: 16px;
    box-shadow: 0 6px 18px rgba(0,0,0,.05);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

    .support-card h3 {
        margin: 0 0 2px;
        font-size: 1.15rem;
        color: #222;
        background: none;
        width: auto;
        margin-left: 0;
        padding: 0;
        box-shadow: none;*/ /* nadpisanie fullwidth dla h3 */
    /*}

    .support-card .muted {
        color: #666;
        margin: 0;
    }

.iban-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
    flex-wrap: wrap;
}

    .iban-row span {
        font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
        color: var(--red-strong);
        font-weight: 600;
        font-size: 0.9rem;
    }*/


/* przyciski wewnątrz kart – dostosuj spacing */
/*.support-card .btn {
    margin-right: 8px;
    margin-top: 2px;
}*/

/* (opcjonalnie) obrazek QR */
/*.qr {
    width: 140px;
    height: auto;
    border-radius: 10px;
    border: 1px solid #eee;
}
.support-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .support-list li {
        margin: 4px 0;
        line-height: 1.4;
    }*/

/* Zakładki w karcie przelewów */
/* Panele */
/*.transfer-panel {
    display: none;
}

    .transfer-panel.is-active {
        display: block;
    }

.transfer-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: -10px;*/ /* zakładka "wchodzi" na kartę */
/*}

.tab-btn {
    position: relative;
    padding: 10px 20px;
    background: #eee;
    border: 1px solid #ccc;
    border-bottom: none;*/ /* dolna linia zniknie, żeby łączyła się z kartą */
    /*border-radius: 10px 10px 0 0;*/ /* zaokrąglenie jak języczek */
    /*font-weight: 600;
    cursor: pointer;
    transition: background .2s ease, color .2s ease;
}

    .tab-btn:hover {
        background: #f8f8f8;
    }

    .tab-btn.is-active {
        background: white;
        color: var(--red-strong);
        border-bottom: 1px solid white;*/ /* łączy się płynnie z panelem */
        /*z-index: 2;*/ /* aktywna zakładka na wierzchu */
    /*}*/

/* panel – wygląda jak karta */
/*.transfer-panels {
    border: 1px solid #ccc;
    border-radius: 0 10px 10px 10px;
    background: white;
    padding: 20px;
}

.transfer-panel {
    display: none;
}

    .transfer-panel.is-active {
        display: block;
    }*/

/* Zespół */
.team-member {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 32px;
}

    .team-member img {
        width: 140px;
        height: 140px;
        border-radius: 50%; /* okrągłe zdjęcia */
        object-fit: cover;
        box-shadow: 0 4px 10px rgba(0,0,0,.1);
        flex-shrink: 0;
    }

.team-info h4 {
    margin: 0 0 8px;
    font-size: 1.3rem;
    color: var(--red-strong);
}

.team-info p {
    margin: 0;
    line-height: 1.6;
    color: #444;
}

/* responsywność na telefonach */
@media (max-width: 640px) {
    .team-member {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

        .team-member img {
            margin-bottom: 12px;
        }
}

/* aktualności */
.news-list {
    display: grid;
    gap: 16px;
}

.news-card {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 16px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 16px;
    box-shadow: 0 6px 18px rgba(0,0,0,.04);
    overflow: hidden;
}

.news-media {
    position: relative;
    background: #fff;
}

    .news-media img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.news-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 6px 10px;
    font-size: .78rem;
    color: #fff;
    border-radius: 999px;
    background: var(--project-grad);
    box-shadow: 0 4px 10px rgba(229,57,53,.25);
}

.news-body {
    padding: 16px 16px 18px 0;
    display: grid;
    align-content: start;
    gap: 8px;
}

.news-title {
    margin: 0;
    font-size: 1.25rem;
}

.news-meta {
    margin: 0;
    color: var(--red-mid);
    font-size: .92rem;
}

.news-excerpt {
    margin: 0;
}

.news-actions {
    margin-top: 10px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

/* Responsywność */
@media (max-width: 820px) {
    .news-card {
        grid-template-columns: 1fr;
    }

    .news-body {
        padding: 12px 16px 18px 16px;
    }
}