/* =====================================================================
   CORE Medycyna Ratunkowa — jeden arkusz dla całego portalu.
   Tokeny marki w :root (tryb JASNY — domyślny); html.noc nadpisuje je
   wartościami nocnymi. Komponenty korzystają wyłącznie z tokenów,
   żeby zmiana kolorystyki była zmianą w jednym miejscu.
   ===================================================================== */

:root{
  --tlo:#F7FAFB; --panel:#ECF4F5; --panel2:#DFEDEF;
  --linia:rgba(14,124,134,.16); --linia-mocna:rgba(14,124,134,.42);
  --turkus:#0E7C86; --turkus-ciemny:#0A5A62; --bursztyn:#96610F; --roz:#b34a59;
  --tekst:#15282D; --tekst-mocny:#0A181C; --przygaszony:#48656C; --slaby:#6d858c;
  --szklo:rgba(247,250,251,.92);
  --pole:rgba(14,124,134,.045);
  --zaznaczenie:rgba(14,124,134,.09);
  --pasek:rgba(14,124,134,.05);
  --stopka-tlo:#EDF3F4;
  --miara:68ch;
}
html.noc{
  --tlo:#0A0D16; --panel:#0C2A33; --panel2:#0E3340;
  --linia:rgba(24,181,192,.18); --linia-mocna:rgba(24,181,192,.4);
  --turkus:#18B5C0; --turkus-ciemny:#0E7C86; --bursztyn:#C9821F; --roz:#e07a88;
  --tekst:#E8EEF0; --tekst-mocny:#fff; --przygaszony:#9DB4BA; --slaby:#6d858c;
  --szklo:rgba(10,13,22,.92);
  --pole:rgba(10,13,22,.4);
  --zaznaczenie:rgba(24,181,192,.09);
  --pasek:rgba(12,42,51,.3);
  --stopka-tlo:rgba(12,42,51,.28);
}
*{margin:0;padding:0;box-sizing:border-box}
html{color-scheme:light;scroll-behavior:smooth}
html.noc{color-scheme:dark}
body{background:var(--tlo);color:var(--tekst);font-family:'Inter',system-ui,sans-serif;font-size:16.5px;line-height:1.7;-webkit-font-smoothing:antialiased}
.pas{max-width:940px;margin:0 auto;padding:0 24px}
a{color:var(--turkus)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--panel2);padding:10px 16px;border-radius:8px;z-index:10}
:focus-visible{outline:2px solid var(--turkus);outline-offset:3px;border-radius:4px}

/* nagłówek */
.naglowek{border-bottom:1px solid var(--linia);position:sticky;top:0;background:var(--szklo);backdrop-filter:blur(8px);z-index:5}
.naglowek .pas{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:16px;padding-bottom:16px;flex-wrap:wrap}
.logo{text-decoration:none;display:flex;align-items:baseline;gap:9px}
.logo-core{font-family:'Poppins',sans-serif;font-weight:800;font-size:21px;letter-spacing:-.02em;color:var(--turkus)}
.logo-reszta{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--przygaszony)}
.nawigacja{display:flex;gap:22px;font-size:14.5px}
.nawigacja a{color:var(--przygaszony);text-decoration:none}
.nawigacja a:hover,.nawigacja a[aria-current]{color:var(--turkus)}

/* artykuł */
.artykul{padding:38px 24px 90px}
.okruchy{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--slaby);margin-bottom:22px}
.okruchy a{color:var(--slaby);text-decoration:none}
.okruchy a:hover{color:var(--turkus)}
.plakietki{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.plakietka{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;padding:5px 11px;border:1px solid var(--linia);border-radius:999px;color:var(--przygaszony)}
.plakietka.otwarte{color:var(--turkus);border-color:var(--linia-mocna)}
h1{font-family:'Poppins',sans-serif;font-weight:800;font-size:clamp(27px,4.6vw,40px);line-height:1.14;letter-spacing:-.02em;text-wrap:balance;margin-bottom:14px;color:var(--tekst-mocny)}
h2{font-family:'Poppins',sans-serif;font-weight:600;font-size:22px;margin:46px 0 12px;text-wrap:balance;color:var(--tekst-mocny)}
.lead{font-size:18px;color:var(--przygaszony);max-width:var(--miara)}
p{margin:14px 0;max-width:var(--miara)}
.mut{color:var(--przygaszony)}
.podpowiedz{font-size:14px;color:var(--slaby);margin-top:4px}

/* kalkulator */
.kalkulator{margin-top:40px;border:1px solid var(--linia);border-radius:16px;padding:26px 24px;background:linear-gradient(165deg,var(--panel),var(--tlo))}
.kalkulator h2{margin-top:0}
.kalkulator h3,.tabela-tytul{font-family:'JetBrains Mono',monospace;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--turkus);margin:24px 0 4px}
.tabela-tytul{margin:20px 0 8px}
.pola-num{display:grid;gap:14px;margin:18px 0 4px}
.pole-num{display:grid;gap:6px}
.pole-etykieta{font-weight:500;color:var(--tekst)}
.pole-wejscie{display:flex;align-items:center;gap:10px}
.pole-num input{flex:0 0 auto;width:140px;padding:11px 13px;border:1px solid var(--linia-mocna);border-radius:10px;background:var(--pole);color:var(--tekst-mocny);font:600 17px 'JetBrains Mono',monospace;font-variant-numeric:tabular-nums}
.pole-num input:focus{outline:2px solid var(--turkus);outline-offset:1px;border-color:var(--turkus)}
.pole-jednostka{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--slaby)}
.poziomy{display:grid;gap:7px;margin:20px 0}
.poziom{display:grid;grid-template-columns:56px 168px 1fr;gap:12px;align-items:center;padding:11px 14px;border:1px solid var(--linia);border-radius:11px;cursor:pointer;background:var(--pole)}
.poziom:hover{border-color:var(--linia-mocna)}
.poziom input{position:absolute;opacity:0;pointer-events:none}
.poziom:has(input:checked){border-color:var(--turkus);background:var(--zaznaczenie)}
.poziom:has(input:focus-visible){outline:2px solid var(--turkus);outline-offset:2px}
.punkt{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:17px;color:var(--turkus);text-align:center;font-variant-numeric:tabular-nums}
.etykieta{font-weight:500}
.opis{font-size:13.5px;color:var(--przygaszony)}
.wynik{display:block;border:1px solid var(--linia-mocna);border-radius:12px;padding:18px 20px;font-size:17px;background:var(--zaznaczenie)}
.wynik.pusty{color:var(--slaby);border-color:var(--linia);background:none;font-size:14.5px}
.wynik b{color:var(--turkus);font-family:'JetBrains Mono',monospace}
.wynik-opis,.wynik-cel,.wynik-uwaga{display:block;font-size:14px;margin-top:7px;color:var(--przygaszony)}
.wynik-cel{color:var(--turkus)}
.wynik-uwaga{color:var(--bursztyn)}

/* tabela, listy */
.tabelka{overflow-x:auto;border:1px solid var(--linia);border-radius:12px;margin:18px 0}
table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:480px}
th{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--turkus);text-align:left;padding:12px 15px;background:var(--panel2)}
td{padding:11px 15px;border-top:1px solid var(--linia)}
td.num{font-family:'JetBrains Mono',monospace;color:var(--turkus);text-align:center;font-variant-numeric:tabular-nums}
tr:nth-child(even) td{background:var(--pasek)}
.kroki{margin:14px 0 14px 20px;max-width:var(--miara)}
.kroki li{margin:10px 0}
.kroki b{color:var(--tekst-mocny)}
.pulapki{list-style:none;max-width:var(--miara)}
.pulapki li{position:relative;padding-left:22px;margin:10px 0;color:var(--przygaszony)}
.pulapki li::before{content:'';position:absolute;left:3px;top:.75em;width:7px;height:1px;background:var(--bursztyn)}
.zrodla ol{margin-left:20px;font-size:14px;color:var(--przygaszony);max-width:var(--miara)}
.zrodla li{margin:9px 0}

/* strona główna i listy — kafle zamiast dawnej .lista-narzedzi */
.glowna{padding:0 24px 90px}
.hero{padding:56px 0 12px}
.hero h1{font-size:clamp(30px,5.4vw,46px);max-width:19ch}
.hero .lead{margin-top:8px;font-size:19px}
.akcje{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:26px;max-width:none}
.przycisk{display:inline-block;padding:12px 24px;border-radius:11px;background:var(--turkus);color:var(--tlo);text-decoration:none;font-weight:600;font-size:15.5px}
.przycisk:hover{background:var(--turkus-ciemny)}
.akcja-uwaga{font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--slaby)}
.sekcja{margin-top:16px}
.role{list-style:none;display:grid;gap:2px;margin:20px 0;max-width:var(--miara)}
.role li{display:flex;flex-direction:column;gap:2px;padding:14px 0;border-top:1px solid var(--linia)}
.role b{color:var(--tekst-mocny)}
.role span{font-size:14.5px;color:var(--przygaszony)}
.kafle{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:12px;margin:22px 0}
.kafel{display:flex;flex-direction:column;gap:4px;padding:18px 20px;border:1px solid var(--linia);border-radius:13px;text-decoration:none;background:var(--pole)}
a.kafel:hover{border-color:var(--linia-mocna);background:var(--zaznaczenie)}
.kafel b{font-family:'Poppins',sans-serif;font-weight:600;font-size:17.5px;color:var(--tekst-mocny)}
.kafel-stan{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--slaby);margin-bottom:4px}
.kafel-stan.gotowe{color:var(--turkus)}
.kafel-pelna{font-size:13px;color:var(--slaby)}
.kafel-opis{font-size:14px;color:var(--przygaszony);margin-top:6px}
.kafel-plan{background:none;border-style:dashed}
.zasady{list-style:none;margin:20px 0;max-width:var(--miara)}
.zasady li{position:relative;padding-left:24px;margin:14px 0;color:var(--przygaszony)}
.zasady li::before{content:'';position:absolute;left:2px;top:.62em;width:9px;height:9px;border:1px solid var(--linia-mocna);border-radius:3px}
.zasady b{color:var(--tekst-mocny)}
.zastrzezenie{font-size:14px;padding-top:14px;border-top:1px solid var(--linia)}

/* artykuł Wiedzy — treść czytana, nie skanowana */
.meta-artykul{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--slaby);margin:2px 0 14px}
.prose{max-width:var(--miara)}
.prose h2{font-family:'Poppins',sans-serif;font-weight:600;font-size:23px;margin:38px 0 10px;color:var(--tekst-mocny);text-wrap:balance}
.prose h3{font-family:'Poppins',sans-serif;font-weight:600;font-size:18px;margin:26px 0 6px;color:var(--tekst-mocny)}
.prose p{margin:15px 0;line-height:1.75}
.prose p:first-of-type{font-size:17px}
.historia{max-width:var(--miara);margin-top:36px}
.historia ul{list-style:none;display:grid;gap:8px;margin-top:10px}
.historia li{font-size:14.5px;color:var(--przygaszony);padding-left:16px;border-left:2px solid var(--linia-mocna)}
.historia time{font-family:'JetBrains Mono',monospace;font-size:12.5px;color:var(--turkus)}

/* formularz kontaktowy */
.formularz{margin-top:26px;max-width:var(--miara)}
.formularz label{display:block;font-weight:500;color:var(--tekst-mocny);margin-bottom:6px}
.formularz input[type=email],.formularz textarea{width:100%;padding:12px 14px;border:1px solid var(--linia-mocna);border-radius:11px;background:var(--pole);color:var(--tekst);font:inherit}
.formularz input[type=email]:focus,.formularz textarea:focus{outline:2px solid var(--turkus);outline-offset:1px;border-color:var(--turkus)}
.formularz textarea{resize:vertical;min-height:160px}
.formularz-rodo{font-size:13.5px}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.komunikat{max-width:var(--miara);margin:22px 0;padding:16px 18px;border-radius:12px;border:1px solid var(--linia-mocna);list-style:none}
.komunikat li{margin:4px 0}
.komunikat-ok{border-color:var(--turkus);background:var(--zaznaczenie)}
.komunikat-blad{border-color:var(--bursztyn);color:var(--bursztyn)}
.formularz-stopka{font-family:'Inter',system-ui,sans-serif;font-size:14px}

/* rewizja i stopka */
.rewizja{display:flex;gap:22px;flex-wrap:wrap;margin-top:52px;padding-top:18px;border-top:1px solid var(--linia);font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--slaby)}
.stopka{border-top:1px solid var(--linia);background:var(--stopka-tlo);padding:38px 0}
.stopka-siatka{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:32px}
.stopka-marka{font-family:'Poppins',sans-serif;font-weight:600;color:var(--tekst);margin-bottom:8px}
.stopka-tytul{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--turkus);margin-bottom:10px}
.stopka p{margin:6px 0;font-size:14px;color:var(--przygaszony)}
.stopka-opis{max-width:38ch}
.stopka-adres{font-size:13px;color:var(--slaby)}

@media(max-width:640px){
  .poziom{grid-template-columns:48px 1fr;row-gap:2px}
  .poziom .opis{grid-column:2}
  .nawigacja{gap:16px;font-size:13.5px}
  .hero{padding:36px 0 4px}
  .kafle{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
