/* wspólny system landingu — index.html + cennik.html.
   Swiss / International Typographic Style: siatka, hierarchia, powietrze,
   hairline zamiast pudełek. Skala Fibonacciego (spacing + typografia).
   NIE duplikuj tego w <style>. Style specyficzne dla strony zostają inline. */

:root {
  /* kolor — czerń + jeden akcent (zasada szwajcarska) */
  --ink:#141414; --paper:#fff; --mut:#6b6b6b; --line:#e6e4df; --line2:#111;
  --acc:#0f5f57; --acc2:#0b4a44; --warn:#b3261e;
  /* wstecznie zgodne aliasy */
  --fg:var(--ink); --bg:var(--paper);
  /* spacing — Fibonacci px */
  --s0:8px; --s1:13px; --s2:21px; --s3:34px; --s4:55px; --s5:89px; --s6:144px;
  /* typografia */
  --sans:"Helvetica Neue",Helvetica,Arial,system-ui,sans-serif;
  --r:4px;
}

* { box-sizing:border-box; margin:0; }
html { scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html { scroll-behavior:auto; } }
body { font:17px/1.6 var(--sans); color:var(--ink); background:var(--paper); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
.wrap { max-width:660px; margin-inline:auto; padding:0 var(--s2); }
.wrap.wide { max-width:1020px; }

/* ---- header ---- */
header { border-bottom:1px solid var(--line); padding:var(--s1) 0; position:sticky; top:0; background:var(--paper); z-index:5; }
header .wrap { display:flex; justify-content:space-between; align-items:center; gap:var(--s1); }
.brand { font-weight:700; font-size:14px; line-height:1.15; letter-spacing:-.01em; text-transform:uppercase; }
.brand a { color:var(--ink); text-decoration:none; }
header nav { display:flex; gap:var(--s0); align-items:center; }
header a.btn { color:var(--ink); text-decoration:none; font-size:13px; letter-spacing:.01em; border:1px solid var(--line2); padding:8px 15px; border-radius:var(--r); white-space:nowrap; transition:background .15s,color .15s; }
header a.btn:hover { background:var(--ink); color:var(--paper); }
header a.btn.plain { border-color:transparent; padding-inline:6px; }
header a.btn.plain:hover { background:none; color:var(--acc); }
header a.btn.app { background:var(--acc); color:#fff; border-color:var(--acc); }
header a.btn.app:hover { background:var(--acc2); border-color:var(--acc2); }
.ico { width:16px; height:16px; vertical-align:-3px; }
.app-ico { display:none; }
@media (max-width:560px){
  .app-txt { display:none; }
  .app-ico { display:inline; }
  .app-ico .ico { width:19px; height:19px; vertical-align:-4px; }
  header a.btn.app { padding:7px 11px; }
}

/* ---- typografia ---- */
h1 { font-weight:700; letter-spacing:-.03em; line-height:1.03; }
h1 em { font-style:normal; color:var(--acc); }
h2 { font-weight:600; font-size:clamp(23px,4.6vw,30px); letter-spacing:-.02em; line-height:1.15; }
p { max-width:60ch; }
.lead { font-size:clamp(19px,3.2vw,22px); line-height:1.45; color:var(--mut); max-width:40ch; }
strong { font-weight:700; color:var(--ink); }

/* numer sekcji — "01 ————" (Swiss marker) */
.num { display:flex; align-items:center; gap:var(--s1); font-size:12px; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--acc); margin-bottom:var(--s2); }
.num::after { content:""; flex:1; height:1px; background:var(--line); }

/* sekcja — hairline u góry, rytm Fibonacciego, zero szarych pudełek */
.sec { border-top:1px solid var(--line); padding-block:var(--s4); scroll-margin-top:70px; }
.sec:first-of-type { border-top:0; }
@media (min-width:560px){ .sec { padding-block:var(--s5); } }
.sec > .wrap > p { margin-top:var(--s2); }

/* ---- CTA ---- */
a.big { display:inline-flex; align-items:center; gap:8px; background:var(--acc); color:#fff; text-decoration:none;
  padding:16px 30px; border-radius:var(--r); font-weight:600; letter-spacing:.01em; transition:background .15s; }
a.big::after { content:"→"; font-weight:400; }
a.big:hover { background:var(--acc2); }
.cta { text-align:center; padding-block:var(--s5) var(--s5); }
.cta p { margin:var(--s2) auto 0; color:var(--mut); font-size:15px; max-width:44ch; }
.cta a.link { color:var(--acc); text-decoration:none; border-bottom:1px solid currentColor; }

/* ---- footer ---- */
footer { border-top:1px solid var(--line); padding-block:var(--s3); color:var(--mut); font-size:12px; letter-spacing:.02em; text-transform:uppercase; }
.foot { display:flex; flex-wrap:wrap; gap:var(--s1) var(--s3); align-items:center; justify-content:space-between; }
.foot-nav { display:flex; flex-wrap:wrap; gap:var(--s1) var(--s2); }
.foot-nav a { color:var(--mut); text-decoration:none; border-bottom:1px solid transparent; transition:color .15s, border-color .15s; }
.foot-nav a:hover { color:var(--acc); border-bottom-color:currentColor; }
.foot-nav a[aria-current] { color:var(--ink); }

/* ---- dokumenty prawne (regulamin, prywatność) ---- */
.doc-hero { padding-block:var(--s4) var(--s3); }
@media (min-width:560px){ .doc-hero { padding-block:var(--s5) var(--s3); } }
.doc-hero h1 { font-size:clamp(34px,7vw,52px); margin-bottom:var(--s2); }
.doc-hero .meta { margin-top:var(--s2); font-size:12px; text-transform:uppercase; letter-spacing:.1em; color:var(--mut); }

/* szerokość zostaje z .wrap (660px) — inaczej kolumna rozjedzie się z headerem i stopką */
.doc { padding-bottom:var(--s5); }
.doc section { border-top:1px solid var(--line); padding-block:var(--s3); }
.doc h2 { font-size:clamp(20px,4vw,25px); margin-bottom:var(--s2); }
.doc h3 { font-size:16px; margin-top:var(--s2); margin-bottom:8px; color:var(--acc); }
.doc p { font-size:15px; line-height:1.65; }
.doc p + p, .doc ul + p, .doc table + p, .doc .box + p { margin-top:var(--s2); }
.doc .note { font-size:14px; color:var(--mut); border-left:2px solid var(--line); padding-left:var(--s2); }
.doc ul.co { list-style:none; padding:0; margin-top:var(--s2); }
.doc ul.co li { padding:9px 0 9px 25px; position:relative; font-size:15px; line-height:1.55; border-top:1px solid var(--line); }
.doc ul.co li:first-child { border-top:0; }
.doc ul.co li::before { content:"→"; position:absolute; left:0; top:9px; color:var(--acc); }
.doc .warn-box ul.co li { border-top-color:rgba(179,38,30,.18); }
.doc .warn-box ul.co li::before { color:var(--warn); }
.doc .big-answer { font-size:clamp(19px,3.6vw,23px); font-weight:700; color:var(--acc); letter-spacing:-.01em; }
.doc .doc-nav { margin-top:var(--s3); }
.doc a.link { color:var(--acc); text-decoration:none; border-bottom:1px solid currentColor; }

.doc .box { border:1px solid var(--line); border-left:3px solid var(--acc); border-radius:var(--r);
  padding:var(--s2); margin-top:var(--s2); font-size:15px; line-height:1.7; background:#fff; }

.doc .tbl { width:100%; border-collapse:collapse; margin-top:var(--s2); font-size:15px; }
.doc .tbl th { text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.1em;
  color:var(--mut); font-weight:700; padding:0 var(--s1) 8px 0; border-bottom:1px solid var(--line2); }
.doc .tbl td { padding:11px var(--s1) 11px 0; border-bottom:1px solid var(--line); vertical-align:top; line-height:1.5; }
.doc .tbl tr:last-child td { border-bottom:0; }

.doc .warn-box { border:1px solid var(--warn); border-radius:var(--r); padding:var(--s3) var(--s2);
  margin-block:var(--s3); background:#fffbf5; }
.doc .warn-box h2 { color:var(--warn); }