:root{
  --ink:#0F1115;--ink2:#1B1F27;--paper:#FFFFFF;--mist:#EEF1F5;--line:#DCE1E8;--line-d:#2A2F3A;
  --muted:#5A6372;--muted-ink:#A9B1BD;--heat:#FF4B1F;--heat-deep:#B8300D;--lime:#C8F25A;
  --d:'Bricolage Grotesque',system-ui,sans-serif;--t:'Geist',system-ui,sans-serif;--m:'Geist Mono',ui-monospace,monospace;
  --szer:1320px;--pad:32px;--r:28px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--t);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;line-height:1.5}
a{color:inherit}
a:hover{color:var(--heat-deep)}
img,svg{max-width:100%}
.mono{font-family:var(--m);font-variant-numeric:tabular-nums}
.wrap{max-width:var(--szer);margin:0 auto;padding:0 var(--pad)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
h1,h2,h3{font-family:var(--d);margin:0;letter-spacing:-0.02em}
p{margin:0}

/* pasek danych */
.ticker{background:var(--ink);color:var(--paper);font-family:var(--m);font-size:12.5px;overflow:hidden}
.ticker .wrap{display:flex;gap:18px;align-items:center;padding-top:9px;padding-bottom:9px;white-space:nowrap;overflow-x:auto;scrollbar-width:none}
.ticker .wrap::-webkit-scrollbar{display:none}
.ticker .t-et{color:var(--muted-ink);margin-right:8px}
.ticker .kropka{width:5px;height:5px;border-radius:50%;background:var(--heat);flex-shrink:0}

/* nagłówek */
.naglowek{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:20}
.naglowek .wrap{display:flex;align-items:center;gap:24px;padding-top:14px;padding-bottom:14px}
.logo{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);flex-shrink:0}
.logo-znak{width:34px;height:34px;border-radius:10px;background:var(--heat);color:var(--ink);display:flex;align-items:center;justify-content:center}
.logo-txt{font-family:var(--d);font-size:22px;font-weight:800;letter-spacing:-0.6px}
.logo-txt span{color:var(--heat)}
.logo.ciemne{color:var(--paper)}
.nav{display:flex;gap:2px;flex-grow:1;overflow-x:auto;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav a,.nav span{padding:8px 12px;border-radius:999px;font-size:15px;font-weight:500;text-decoration:none;white-space:nowrap}
.nav a.akt{background:var(--mist)}
.nav span.wkrotce{color:var(--muted);cursor:default}
.nav span.wkrotce small{font-family:var(--m);font-size:10.5px;margin-left:4px;padding:1px 6px;border-radius:999px;background:var(--mist)}

/* przyciski */
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 22px;border-radius:999px;font-weight:600;font-size:16px;text-decoration:none;border:1.5px solid transparent;cursor:pointer;font-family:var(--t);line-height:1.1}
.btn svg{width:18px;height:18px}
.btn-heat{background:var(--heat);color:var(--ink)}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-lime{background:var(--lime);color:var(--ink)}
.btn-obr{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-maly{padding:11px 18px;font-size:14.5px}
.btn:hover{filter:brightness(0.96);color:inherit}
.btn-ink:hover{color:var(--paper)}
.btn-pelny{width:100%;justify-content:center}

/* pola i chipy */
.pole{display:flex;flex-direction:column;gap:7px;font-size:13px;color:var(--muted);min-width:0;flex:1 1 160px}
.pole .wej{display:flex;align-items:center;gap:8px;height:52px;padding:0 16px;border-radius:14px;background:var(--paper);border:1px solid var(--line);min-width:0}
.pole input,.pole select{width:0;flex-grow:1;min-width:0;border:0;outline:0;background:transparent;font-family:var(--m);font-size:18px;color:var(--ink);font-variant-numeric:tabular-nums;-webkit-appearance:none;appearance:none}
.pole select{cursor:pointer}
.pole .jedn{font-family:var(--m);font-size:14px;color:var(--muted)}
.pole .wej:focus-within{border-color:var(--ink);box-shadow:0 0 0 3px rgba(15,17,21,0.12)}
.ciemne .pole{color:var(--muted-ink)}
.ciemne .pole .wej{background:var(--ink2);border-color:#323846}
.ciemne .pole input,.ciemne .pole select{color:var(--paper)}
.ciemne .pole .jedn{color:var(--muted-ink)}
.ciemne .pole select option{color:var(--ink)}
.chipy{display:flex;flex-wrap:wrap;gap:8px}
.chipy label{position:relative}
.chipy input{position:absolute;opacity:0;pointer-events:none}
.chipy span{display:inline-flex;align-items:center;height:44px;padding:0 16px;border-radius:999px;font-size:14.5px;font-weight:500;cursor:pointer;background:var(--paper);color:var(--ink);border:1px solid var(--line)}
.chipy input:checked+span{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chipy input:focus-visible+span{outline:3px solid var(--heat);outline-offset:2px}
.ciemne .chipy span{background:transparent;color:var(--paper);border-color:#3A4150}
.ciemne .chipy input:checked+span{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.etyk{font-size:13px;color:var(--muted)}
.ciemne .etyk{color:var(--muted-ink)}
.wiersz-pol{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}

/* hero */
.hero{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:center;padding-top:64px;padding-bottom:72px}
.odznaka{display:inline-flex;align-items:center;gap:8px;width:fit-content;padding:7px 14px;border-radius:999px;background:var(--mist);font-family:var(--m);font-size:12.5px}
.odznaka svg{width:16px;height:16px}
.h-hero{font-size:clamp(44px,6.2vw,84px);line-height:0.98;font-weight:800;letter-spacing:-0.035em}
.h-hero em,.h-wynik em{font-style:normal;color:var(--heat)}
.lead{font-size:20px;line-height:1.5;color:var(--muted);max-width:620px}
.stos{display:flex;flex-direction:column;gap:26px}
.przyciski{display:flex;gap:12px;flex-wrap:wrap}

/* kalkulator w ciemnej karcie */
.kalk{background:var(--ink);color:var(--paper);border-radius:var(--r);padding:30px;display:flex;flex-direction:column;gap:20px}
.kalk-g{display:flex;justify-content:space-between;align-items:center;gap:12px}
.kalk-g h2{font-size:26px;font-weight:700}
.kalk-g .mono{font-size:12px;color:var(--muted-ink)}
.kalk-wynik{border-top:1px solid var(--line-d);padding-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.kalk-wynik .etyk{color:var(--muted-ink)}
.liczba{font-family:var(--d);font-size:40px;font-weight:700;letter-spacing:-1px;margin-top:4px;line-height:1.05}
.liczba.strata{color:var(--heat)}

/* słupki */
.slupki{display:flex;gap:8px;align-items:flex-end}
.slupek{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.sl-et,.sl-rok{font-family:var(--m);font-size:11.5px;white-space:nowrap}
.sl-pole{width:100%;display:flex;align-items:flex-end}
.sl-b{width:100%;border-radius:8px 8px 3px 3px;background:var(--ink)}
.slupki.ciemne .sl-b{background:var(--paper)}
.slupki.ciemne .sl-et{color:var(--paper)}
.slupki.ciemne .sl-rok{color:var(--muted-ink)}
.slupki.jasne .sl-rok{color:var(--muted)}
.sl-b.ost{background:var(--heat)!important}

/* pasy */
.pas{padding:72px 0}
.pas-heat{background:var(--heat);color:var(--ink)}
.pas-ink{background:var(--ink);color:var(--paper)}
.pas-mist{background:var(--mist)}
.pas-g{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:40px;flex-wrap:wrap}
.h-pas{font-size:clamp(34px,4.2vw,56px);line-height:1;font-weight:800;letter-spacing:-0.035em;max-width:780px}
.h-sek{font-size:clamp(28px,3.2vw,44px);font-weight:800;letter-spacing:-0.03em}
.pas-g p{font-size:15px;line-height:1.55;max-width:400px}
.pas-ink .pas-g p,.pas-ink .zrodlo{color:var(--muted-ink)}
.zrodlo{font-family:var(--m);font-size:12px;color:var(--muted);line-height:1.5}

/* instrumenty vs inflacja */
.instrumenty{position:relative;overflow-x:auto;padding-bottom:4px}
.ins-wiersz{display:flex;gap:20px;align-items:flex-start;min-width:760px}
.ins{flex:1;display:flex;flex-direction:column;gap:9px;min-width:84px}
.ins-pole{display:flex;align-items:flex-end}
.ins-b{width:100%;border-radius:10px 10px 4px 4px;background:var(--ink)}
.ins-b.nad{background:var(--lime)}
.ins-n{font-weight:700;font-size:16px}
.ins-o{font-family:var(--m);font-size:12.5px;line-height:1.45}
.ins-w{font-family:var(--m);font-size:12.5px;font-weight:500}
.ins-linia{position:absolute;left:0;right:0;border-top:2px solid var(--ink);min-width:760px}
.ins-etyk{position:absolute;left:0;font-family:var(--m);font-size:12.5px;background:var(--ink);color:var(--paper);padding:4px 10px;border-radius:999px}

/* bento */
.bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(210px,auto);gap:16px}
.kafel{border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:12px;text-decoration:none;color:var(--ink);position:relative}
.kafel:hover{color:var(--ink)}
.kafel .k-et{font-family:var(--m);font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:0.04em}
.kafel h3{font-size:26px;font-weight:700;line-height:1.12}
.kafel p{font-size:15px;color:var(--muted);line-height:1.5}
.k-duzy{grid-column:span 2;grid-row:span 2;background:var(--mist)}
.k-duzy h3{font-size:38px;line-height:1.05;letter-spacing:-0.03em}
.k-szer{grid-column:span 2}
.k-ink{background:var(--ink);color:var(--paper)}
.k-ink:hover{color:var(--paper)}
.k-ink .k-et,.k-ink p{color:var(--muted-ink)}
.k-lime{background:var(--lime)}
.k-lime .k-et,.k-lime p{color:var(--ink)}
.k-jasny{background:var(--paper);border:1px solid var(--line)}
.k-dalej{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14.5px;margin-top:auto}
.k-dalej svg{width:16px;height:16px}
.wkrotce-et{position:absolute;top:22px;right:22px;font-family:var(--m);font-size:11px;padding:3px 9px;border-radius:999px;background:rgba(15,17,21,0.08)}
.k-ink .wkrotce-et{background:rgba(255,255,255,0.12)}
.legenda{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.legenda i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.koszyk{display:grid;grid-template-columns:2fr 1.2fr 1fr;grid-template-rows:54px 40px;gap:6px;margin-top:6px}
.koszyk div{border-radius:12px;padding:10px;font-size:13px}

/* wykres */
.wykres{width:100%;height:auto;display:block}
.wykres .os{font-family:var(--m);font-size:11px}
.wykres.ciemny .os{fill:var(--muted-ink)}
.wykres.jasny .os{fill:var(--muted)}
.wykres .ann{font-family:var(--m);font-size:13px}
.wykres.ciemny .ann{fill:var(--paper)}
.wykres.jasny .ann{fill:var(--ink)}
.dwie{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end}

/* zasady */
.zasady{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;padding-top:80px;padding-bottom:80px}
.zasada{display:flex;flex-direction:column;gap:12px}
.zasada .ik{width:46px;height:46px;border-radius:14px;background:var(--mist);display:flex;align-items:center;justify-content:center}
.zasada .ik svg{width:22px;height:22px}
.zasada h3{font-size:22px;font-weight:700}
.zasada p{font-size:15px;line-height:1.6;color:var(--muted)}

/* tabele */
.tabela{width:100%;border-collapse:collapse;font-size:15px}
.tabela th{text-align:left;padding:0 0 10px;font-family:var(--m);font-size:12px;color:var(--muted);font-weight:500;border-bottom:2px solid var(--ink)}
.tabela td{padding:13px 0;border-bottom:1px solid var(--line)}
.tabela .p{text-align:right;font-family:var(--m);font-variant-numeric:tabular-nums}
.tabela th.p{text-align:right}
.tabela td.str{color:var(--heat-deep)}
.tabela td.zys{color:#2F6B1A}
.tabela tr.wyr td{font-weight:700}
.pas-ink .tabela th{color:var(--muted-ink);border-bottom-color:var(--paper)}
.pas-ink .tabela td{border-bottom-color:var(--line-d)}
.tabela-przew{overflow-x:auto}

/* wynik */
.h-wynik{font-size:clamp(38px,5.4vw,76px);line-height:1;font-weight:800;letter-spacing:-0.035em;max-width:1100px}
.wynik-lead{font-size:19px;line-height:1.55;color:var(--muted-ink);max-width:800px}
.siatka-2{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:start}
.panel{background:var(--mist);border-radius:var(--r);padding:30px;display:flex;flex-direction:column;gap:16px}
.panel .k-et{font-family:var(--m);font-size:12.5px;color:var(--muted)}
.scen{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.karta{border-radius:24px;padding:24px;display:flex;flex-direction:column;gap:8px;background:var(--paper);border:1px solid var(--line)}
.karta.k-ink{border:0}
.karta.k-lime{border:0}
.karta h3{font-size:24px;font-weight:700}
.karta .male{font-size:13px;color:var(--muted)}
.karta.k-ink .male{color:var(--muted-ink)}
.karta .kw{font-family:var(--d);font-size:34px;font-weight:700;letter-spacing:-1px;line-height:1.1}
.karta .re{font-family:var(--m);font-size:19px}
.karta.k-ink .re{color:var(--heat)}
.ostrz{font-size:13px;color:var(--muted);line-height:1.55}
.formularz{display:flex;flex-direction:column;gap:22px}
.pole-oproc[hidden]{display:none}

/* obligacje */
.oferta-wiersz{display:grid;grid-template-columns:1.15fr 0.7fr 0.7fr 2fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline;font-size:14.5px}
.oferta-wiersz .mono{font-size:16px}
.oferta-wiersz .op{color:var(--muted);font-size:13.5px}
.wynik-ob{background:var(--ink);color:var(--paper);border-radius:var(--r);padding:30px;display:flex;flex-direction:column;gap:18px}
.wynik-ob .etyk{color:var(--muted-ink)}
.wynik-ob .liczba{font-size:46px}
.wynik-ob .tabela th{color:var(--muted-ink);border-bottom-color:var(--paper)}
.wynik-ob .tabela td{border-bottom-color:var(--line-d)}
.wynik-ob .tabela td.zys{color:var(--lime)}
.uklad-ob{display:grid;grid-template-columns:5fr 7fr;gap:40px;align-items:start}
.formularz-jasny{background:var(--mist);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:20px}
.pasek-wyb{display:flex;gap:8px;flex-wrap:wrap}
.znacznik{display:inline-block;font-family:var(--m);font-size:11.5px;padding:2px 8px;border-radius:999px;background:var(--mist);color:var(--ink);vertical-align:2px}
.znacznik.lime{background:var(--lime)}
.znacznik.heat{background:var(--heat)}

/* proza */
.proza{max-width:780px;padding-top:56px;padding-bottom:80px}
.proza h1{font-size:clamp(36px,4.6vw,60px);font-weight:800;line-height:1.02;letter-spacing:-0.035em;margin-bottom:22px}
.proza h2{font-size:28px;font-weight:700;margin:40px 0 12px}
.proza p,.proza li{font-size:17px;line-height:1.7;color:#2B303B}
.proza p{margin:0 0 14px}
.proza ul{padding-left:22px}
.proza code{font-family:var(--m);font-size:14px;background:var(--mist);padding:2px 6px;border-radius:6px}

/* stopka */
.stopka{background:var(--ink);color:var(--paper)}
.stopka-g{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px;padding-top:56px;padding-bottom:28px}
.stopka-g p{font-size:14.5px;line-height:1.6;color:var(--muted-ink);max-width:360px}
.st-kol{display:flex;flex-direction:column;gap:9px}
.st-kol .st-t{font-family:var(--m);font-size:12px;color:var(--muted-ink);text-transform:uppercase;letter-spacing:0.08em}
.st-kol a,.st-kol span{color:var(--paper);text-decoration:none;font-size:14.5px}
.st-kol span{color:#6D7584}
.stopka-d{border-top:1px solid var(--line-d);padding-top:18px;padding-bottom:28px;font-size:12.5px;line-height:1.6;color:var(--muted-ink)}

/* telefon i tablet */
@media (max-width:1100px){
  .scen{grid-template-columns:repeat(2,minmax(0,1fr))}
  .uklad-ob{grid-template-columns:1fr}
}
@media (max-width:980px){
  :root{--pad:24px;--r:24px}
  .hero{grid-template-columns:1fr;gap:36px;padding-top:40px;padding-bottom:48px}
  .bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dwie,.siatka-2{grid-template-columns:1fr;gap:28px}
  .zasady{grid-template-columns:1fr;gap:28px;padding-top:56px;padding-bottom:56px}
  .stopka-g{grid-template-columns:1fr 1fr}
  .naglowek .btn{display:none}
  .pas{padding:56px 0}
}
@media (max-width:640px){
  :root{--pad:16px}
  .naglowek .wrap{flex-wrap:wrap;gap:10px;padding-top:12px;padding-bottom:8px}
  .nav{order:3;width:100%;margin:0 -4px}
  .nav a,.nav span{font-size:14px;padding:7px 11px}
  .lead{font-size:17px}
  .kalk,.panel,.wynik-ob,.formularz-jasny{padding:22px}
  .kalk-wynik{grid-template-columns:1fr}
  .liczba{font-size:34px}
  .bento{grid-template-columns:1fr}
  .k-duzy,.k-szer{grid-column:span 1;grid-row:span 1}
  .k-duzy h3{font-size:30px}
  .scen{grid-template-columns:1fr}
  .stopka-g{grid-template-columns:1fr;gap:28px}
  .oferta-wiersz{grid-template-columns:1fr 1fr;gap:4px 12px}
  .oferta-wiersz .op{grid-column:span 2}
  .sl-et{font-size:10px}
  .slupki{gap:5px}
  .btn{padding:14px 18px;font-size:15px}
  .tabela{font-size:14px}
}

/* elementy siatek nie mogą rozpychać strony (tabele i pola mają własne przewijanie) */
.hero>*,.dwie>*,.siatka-2>*,.uklad-ob>*,.bento>*,.scen>*,.zasady>*,.stopka-g>*,.wiersz-pol>*{min-width:0}
.dwa-wyniki{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dwa-wyniki>*{min-width:0}
@media (max-width:640px){.dwa-wyniki{grid-template-columns:1fr}.wynik-ob .liczba{font-size:38px}}

/* poprawki po przeglądzie na telefonie */
.pole{flex:none}
.wiersz-pol>.pole{flex:1 1 160px}
.karta.k-ink{background:var(--ink);color:var(--paper);border:0}
.karta.k-lime{background:var(--lime);border:0}
.naglowek .btn{white-space:nowrap}
.kalk-g{flex-wrap:wrap}
.kalk-g h2{white-space:nowrap}
.slupki-box{display:flex;flex-direction:column;gap:8px}
.sl-jedn{font-family:var(--m);font-size:11.5px;color:var(--muted)}
.ciemne .sl-jedn,.kalk .sl-jedn{color:var(--muted-ink)}
.tylko-m{display:none}
.wykres.tel .os{font-size:19px}
.wykres.tel .ann{font-size:21px}
.ins-lista{display:none;flex-direction:column;gap:14px}
.il-leg{font-family:var(--m);font-size:12px;display:flex;align-items:center;gap:8px}
.il-kreska{display:inline-block;width:2px;height:14px;background:var(--ink)}
.il-w{display:flex;flex-direction:column;gap:6px}
.il-g{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.il-g b{font-size:16px}
.il-g span{font-family:var(--m);font-size:12.5px}
.il-pas{position:relative;height:16px;border-radius:999px;background:rgba(15,17,21,0.12)}
.il-b{height:100%;border-radius:999px;background:var(--ink)}
.il-b.nad{background:var(--lime)}
.il-inf{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--ink)}
.il-d{font-family:var(--m);font-size:12px}
@media (max-width:1200px){.naglowek .btn{display:none}}
@media (max-width:640px){
  .tylko-d{display:none!important}
  .tylko-m{display:block}
  .ins-lista.tylko-m{display:flex}
  .tabela.szeroka{min-width:600px}
}