:root{
  --ink:#161d19;--ink-2:#3a4a40;--sage:#5a7a66;
  --forest:#2e6645;--forest-deep:#1c4630;
  --lime:#cfdf58;--lime-dark:#b2c526;--paper:#ffffff;
  --rule:rgba(22,29,25,0.12);
  --serif:"Fraunces",Georgia,serif;--sans:"DM Sans",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,monospace;
  --gut:clamp(1.25rem,4vw,4rem);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{color:var(--ink-2);font-family:var(--sans);font-weight:300;font-size:1.0625rem;line-height:1.7;background:#f5f8f1;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--forest);outline-offset:3px}
.wrap{max-width:1360px;margin:0 auto;padding:0 var(--gut)}

/* nagłówek strony */
.top{background:var(--ink);color:rgba(255,255,255,0.78)}
.nav__in{display:flex;align-items:center;gap:2rem;height:84px;border-bottom:1px solid rgba(255,255,255,0.15)}
.wordmark{display:inline-flex;align-items:center;gap:0.65rem;font-family:var(--serif);font-size:1.5rem;font-weight:700;letter-spacing:-0.04em;color:#618453;text-decoration:none}
.logo{height:32px;width:auto;display:block}
.nav__links{display:flex;gap:1.9rem;margin-left:auto}
.nav__links a{font-size:0.9rem;text-decoration:none;color:rgba(255,255,255,0.75);border-bottom:1px solid transparent;padding-bottom:2px;transition:color .16s,border-color .16s}
.nav__links a:hover{color:var(--paper);border-color:var(--paper)}
.nav__cta{margin-left:1.25rem;padding:0.7rem 1.2rem;font-size:0.875rem;white-space:nowrap}
.btn{display:inline-flex;align-items:center;gap:0.75rem;font-family:var(--sans);font-size:0.9375rem;font-weight:500;padding:1rem 1.75rem;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background .16s,color .16s}
.btn--lime{background:var(--lime);color:var(--ink)}
.btn--lime:hover{background:var(--lime-dark)}
.top__in{padding-block:clamp(3.5rem,6vw,5.5rem)}
.top .label{font-family:var(--mono);font-size:0.6875rem;font-weight:500;letter-spacing:0.16em;text-transform:uppercase;color:var(--lime);display:block}
.top h1{font-family:var(--serif);font-size:clamp(2.1rem,4.4vw,3.6rem);font-weight:700;letter-spacing:-0.04em;line-height:1.05;color:var(--paper);margin-top:1.25rem;max-width:20ch}
.top__meta{font-family:var(--mono);font-size:0.75rem;letter-spacing:0.08em;color:rgba(255,255,255,0.55);margin-top:1.5rem}

/* układ: spis treści + treść */
.doc{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);padding-block:clamp(3.5rem,6vw,5.5rem);align-items:start}
.toc{position:sticky;top:2rem}
.toc h2{font-family:var(--mono);font-size:0.625rem;font-weight:500;letter-spacing:0.14em;text-transform:uppercase;color:var(--sage);margin-bottom:1rem}
.toc ol{list-style:none;counter-reset:none}
.toc li{border-top:1px solid var(--rule)}
.toc li:last-child{border-bottom:1px solid var(--rule)}
.toc a{display:block;padding:0.65rem 0;font-size:0.875rem;text-decoration:none;color:var(--ink-2);transition:color .16s,padding-left .16s}
.toc a:hover{color:var(--ink);padding-left:0.35rem}

.doc__body{background:var(--paper);padding:clamp(2rem,4vw,4rem);max-width:80ch;border-top:3px solid var(--ink)}
.doc__body > p:first-of-type{font-size:1.0625rem;color:var(--ink-2);padding-bottom:2rem;border-bottom:1px solid var(--rule)}
.doc__body h2{
  font-family:var(--serif);font-size:clamp(1.35rem,2.2vw,1.75rem);font-weight:700;
  letter-spacing:-0.03em;line-height:1.2;color:var(--ink);
  margin-top:3.25rem;padding-top:1.5rem;border-top:1px solid var(--rule);
  scroll-margin-top:2rem;
}
.doc__body h2:first-of-type{margin-top:2rem}
.doc__body p{margin-top:1.1rem}
.doc__body ol{margin-top:1.1rem;padding-left:1.4rem}
.doc__body ul{margin-top:1.1rem;padding-left:1.4rem}
.doc__body li{margin-top:0.6rem;padding-left:0.35rem}
.doc__body li::marker{color:var(--sage);font-family:var(--mono);font-size:0.85em}
.doc__body strong{font-weight:500;color:var(--ink)}
.doc__body hr{display:none}
.doc__body a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule)}
.doc__body a:hover{border-color:var(--ink)}
.doc__body table{width:100%;border-collapse:collapse;margin-top:1.5rem;font-size:0.9rem}
.doc__body th{
  text-align:left;font-family:var(--mono);font-size:0.625rem;font-weight:500;
  letter-spacing:0.12em;text-transform:uppercase;color:var(--sage);
  padding:0.75rem 1rem 0.75rem 0;border-bottom:1px solid var(--ink);vertical-align:bottom;
}
.doc__body td{padding:1rem 1rem 1rem 0;border-bottom:1px solid var(--rule);vertical-align:top;line-height:1.55}
.doc__body td:last-child,.doc__body th:last-child{padding-right:0}

/* stopka */
.foot{background:var(--ink);color:rgba(255,255,255,0.7);padding:clamp(3rem,5vw,4.5rem) 0 2rem}
.foot__grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:2rem}
.foot h4{font-family:var(--mono);font-size:0.625rem;font-weight:500;letter-spacing:0.13em;text-transform:uppercase;color:rgba(255,255,255,0.45);margin-bottom:1.1rem}
.foot ul{list-style:none}
.foot li{margin-bottom:0.65rem}
.foot a{text-decoration:none;font-size:0.9rem;transition:color .16s}
.foot a:hover{color:var(--lime)}
.foot__mark{display:flex;align-items:center;gap:0.65rem;font-family:var(--serif);font-size:1.5rem;font-weight:700;color:#618453;letter-spacing:-0.04em;margin-bottom:1rem}
.foot__addr{font-size:0.875rem;line-height:1.65;color:rgba(255,255,255,0.5)}
.foot__bar{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:clamp(2.5rem,4vw,3.5rem);padding-top:1.5rem;border-top:1px solid rgba(255,255,255,0.12);font-family:var(--mono);font-size:0.6875rem;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.42)}

@media(max-width:1000px){
  .nav__links{display:none}
  .doc{grid-template-columns:1fr}
  .toc{position:static;border-bottom:1px solid var(--rule);padding-bottom:1.5rem}
  .toc ol{display:flex;flex-wrap:wrap;gap:0 1.25rem}
  .toc li{border:none}
  .toc li:last-child{border:none}
  .toc a{padding:0.3rem 0;font-size:0.8125rem}
  .foot__grid{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .foot__grid{grid-template-columns:1fr}
  .doc__body table,.doc__body thead,.doc__body tbody,.doc__body tr,.doc__body td{display:block;width:100%}
  .doc__body thead{display:none}
  .doc__body tr{border-bottom:1px solid var(--ink);padding-bottom:1rem;margin-bottom:1rem}
  .doc__body td{border:none;padding:0.35rem 0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none !important}}
