/* ============================================================
   Badania kliniczne — prezentacja dla pacjenta.

   Spójność z klinika.cudmed.pl: te same kroje (Taviraj w nagłówkach,
   Montserrat w tekście), ten sam piaskowy akcent #E2D9C4 i kwadratowe
   przyciski bez zaokrągleń. Paleta pozostaje kliniczna — granat zamiast
   spa-owej bieli, bo ta strona ma budować wiarygodność ośrodka badawczego.
   ============================================================ */

.badaniaLista{
    --granat:      #13213f;
    --granat-jasny:#2c3f63;
    --piasek:      #e2d9c4;
    --piasek-ciemny:#c9bb9a;
    --tekst:       #3d4550;
    --tekst-slaby: #6b7481;
    --linia:       #dfe3e8;
    --tlo-karty:   #ffffff;
    --zielony:     #1f6b3a;
    --zielony-tlo: #e6f1e9;
    --bursztyn:    #8a5d00;
    --bursztyn-tlo:#f7efdc;

    font-family: 'Montserrat', 'Segoe UI', Helvetica, Arial, sans-serif;
    color: var(--tekst);
    display: flex;
    flex-direction: column;
    gap: 22px;
    margin: 30px 0 50px;
}

/* ---------- filtry ---------- */

.badaniaFiltry{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--linia);
}

.badanieFiltr{
    font-family: inherit;
    font-size: 14px;
    padding: 9px 18px;
    background: #fff;
    color: var(--tekst);
    border: 1px solid var(--piasek-ciemny);
    border-radius: 0;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
}

.badanieFiltr:hover{ background: var(--piasek); }

.badanieFiltr.is-aktywny{
    background: var(--granat);
    border-color: var(--granat);
    color: #fff;
}

.badanieFiltr:focus-visible{
    outline: 3px solid #ffd34d;
    outline-offset: 2px;
}

/* ---------- karta badania ---------- */

.badanieKarta{
    background: var(--tlo-karty);
    border: 1px solid var(--linia);
    border-left: 4px solid var(--piasek-ciemny);
    padding: 24px 26px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.badanieKarta[data-faza]:has(.badanieStatus--rekrutacja){
    border-left-color: var(--zielony);
}

.badanieNaglowek{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.badanieStatus{
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .09em;
    text-transform: uppercase;
    padding: 4px 11px;
}

.badanieStatus--rekrutacja{ background: var(--zielony-tlo); color: var(--zielony); }
.badanieStatus--wkrotce,
.badanieStatus--wstrzymana{ background: var(--bursztyn-tlo); color: var(--bursztyn); }
.badanieStatus--w_toku,
.badanieStatus--zakonczone{ background: #eef0f3; color: var(--tekst-slaby); }

.badanieFaza{
    font-size: 12px;
    letter-spacing: .06em;
    color: var(--tekst-slaby);
    padding: 4px 10px;
    border: 1px solid var(--linia);
}

.badanieTytul{
    font-family: 'Taviraj', Georgia, serif;
    font-size: 23px;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -.01em;
    margin: 0;
    text-wrap: balance;
}

.badanieTytul a{
    color: var(--granat);
    text-decoration: none;
}

.badanieTytul a:hover{ text-decoration: underline; }

.badanieChoroba{
    margin: 0;
    font-size: 15px;
    color: var(--tekst-slaby);
}

/* ---------- fakty ---------- */

.badanieFakty,
.badanieTabelka{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px 26px;
    margin: 4px 0 0;
}

.badanieFakty > div,
.badanieTabelka > div{
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.badanieFakty dt,
.badanieTabelka dt{
    font-size: 11px;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--tekst-slaby);
    font-weight: 600;
}

.badanieFakty dd,
.badanieTabelka dd{
    margin: 0;
    font-size: 15px;
    color: var(--tekst);
}

/* ---------- kryteria ---------- */

.badanieKryteria h4{
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--tekst-slaby);
    margin: 6px 0 8px;
    font-weight: 600;
}

.badanieKryteria ul,
.badanieSzczegoly ul{
    margin: 0;
    padding-left: 20px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    font-size: 15px;
}

.badanieWiecej{ margin: 8px 0 0; font-size: 14px; }

/* ---------- wezwanie do dzialania ---------- */

.badanieAkcje{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin: 8px 0 0;
}

.badanieCta{
    display: inline-block;
    padding: 13px 28px;
    background: var(--granat);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    border: 2px solid var(--granat);
    transition: background-color .15s ease, color .15s ease;
}

.badanieCta:hover,
.badanieCta:focus{
    background: #fff;
    color: var(--granat);
}

.badanieLink{
    font-size: 15px;
    color: var(--granat-jasny);
}

.badanieCta:focus-visible,
.badanieLink:focus-visible{
    outline: 3px solid #ffd34d;
    outline-offset: 3px;
}

.badaniaPusto{
    font-family: 'Montserrat', sans-serif;
    background: #f6f7f9;
    border-left: 4px solid var(--piasek-ciemny);
    padding: 22px 24px;
    font-size: 16px;
}

/* ---------- strona pojedynczego badania ---------- */

.badanieSzczegoly{
    font-family: 'Montserrat', 'Segoe UI', Helvetica, Arial, sans-serif;
    --granat:#13213f; --tekst:#3d4550; --tekst-slaby:#6b7481; --linia:#dfe3e8;
    --piasek-ciemny:#c9bb9a;
    color: var(--tekst);
    display: flex;
    flex-direction: column;
    gap: 34px;
    margin-top: 34px;
}

.badanieSekcja h2{
    font-family: 'Taviraj', Georgia, serif;
    font-size: 26px;
    font-weight: 500;
    color: var(--granat);
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--piasek-ciemny);
}

.badanieSekcja--rejestr{
    background: #f6f7f9;
    padding: 22px 24px;
}

.badanieAkcje--duze{
    padding: 22px 24px;
    background: #f6f7f9;
    border-left: 4px solid var(--granat);
}

.badanieTelefon{
    font-size: 15px;
    color: var(--tekst-slaby);
}

@media (max-width: 600px){
    .badanieKarta{ padding: 20px 18px; }
    .badanieTytul{ font-size: 20px; }
    .badanieCta{ width: 100%; text-align: center; }
}

@media (prefers-reduced-motion: reduce){
    .badanieFiltr, .badanieCta{ transition: none; }
}

/* ============================================================
   Kwalifikacje zespołu i wizytówka ośrodka dla sponsorów
   ============================================================ */

.zespolKwalifikacje,
.osrodekSponsor{
    --granat:#13213f; --tekst:#3d4550; --tekst-slaby:#6b7481;
    --linia:#dfe3e8; --piasek:#e2d9c4; --piasek-ciemny:#c9bb9a;
    font-family: 'Montserrat', 'Segoe UI', Helvetica, Arial, sans-serif;
    color: var(--tekst);
    margin-top: 34px;
}

.zespolKwalifikacje h2,
.osrodekSponsor h3{
    font-family: 'Taviraj', Georgia, serif;
    font-weight: 500;
    color: var(--granat);
    margin: 0 0 14px;
}

.zespolKwalifikacje h2{
    font-size: 26px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--piasek-ciemny);
}

.zespolKwalifikacje h3,
.osrodekSponsor h3{
    font-size: 19px;
    margin-top: 26px;
}

.zespolKwalifikacje ul,
.osrodekSponsor ul{
    margin: 0;
    padding-left: 20px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 15px;
}

/* Liczby opisujące ośrodek — to pierwsza rzecz, której szuka sponsor. */
.osrodekLiczby{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 1px;
    background: var(--linia);
    border: 1px solid var(--linia);
    margin-bottom: 30px;
}

.osrodekLiczba{
    background: #fff;
    padding: 22px 18px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    text-align: center;
}

.osrodekWartosc{
    font-family: 'Taviraj', Georgia, serif;
    font-size: 32px;
    line-height: 1;
    color: var(--granat);
    font-variant-numeric: tabular-nums;
}

.osrodekEtykieta{
    font-size: 11px;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--tekst-slaby);
}

.osrodekSekcja{ margin-bottom: 8px; }

@media (max-width: 600px){
    .osrodekWartosc{ font-size: 26px; }
    .zespolKwalifikacje h2{ font-size: 22px; }
}
