/* ---------- NARZĘDZIA (podstrona) ---------- */
.tools-hero{position:relative;padding:clamp(8rem,18vh,11rem) 0 5rem;overflow:clip}
.tools-hero h1{max-width:17ch;text-wrap:balance}
.belt-count{font:800 .9rem/1 var(--font-display);letter-spacing:.16em;text-transform:uppercase;color:rgba(var(--warm),.9);margin:0 0 .9rem}
.tools-hero .lede{max-width:54ch}

.tool-belt{position:relative;padding-bottom:0;overflow-x:clip}
.belt-head{margin:0 0 3rem}
.belt-head h2{margin-top:0}
.belt-head .sec-intro{max-width:60ch}
.belt-head .sec-intro{margin-bottom:0}
.belt-sec{margin-top:clamp(3.5rem,8vh,6rem);padding-top:clamp(3rem,6vh,4.5rem);border-top:1px solid rgba(255,255,255,.1)}

.tool{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(2.2rem,6vw,4.8rem);align-items:center;padding:3rem 0;position:relative}
.tool + .tool{border-top:1px solid rgba(255,255,255,.07)}
.tool.flip{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
.tool.flip .tool-media{order:2}

.tool-media{position:relative}
.tool-media::before{content:"";position:absolute;inset:-16% -20%;background:radial-gradient(closest-side,rgba(var(--warm),.13),transparent 72%);filter:blur(8px);pointer-events:none}
.tool-media figure{position:relative;margin:0;aspect-ratio:1/1;border-radius:var(--radius-lg);overflow:hidden;border:1px solid rgba(255,255,255,.1);box-shadow:0 34px 70px -24px rgba(0,0,0,.65)}
.tool-media img{display:block;width:100%;height:100%;object-fit:cover}
#flashcards .tool-media img{object-position:10% 50%}
.tool-facts{margin:1rem 0 0;font:700 .78rem/1.6 var(--font-body);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2)}
.tool-facts .fct,.belt-next .fct{white-space:nowrap}
.tool-facts.tf-m{display:none}
.tool-facts .dot,.belt-next .dot{color:rgba(var(--warm),.9);padding:0 .4em;font-weight:700}

.tool-body p.tool-no{font:800 .9rem/1 var(--font-display);letter-spacing:.16em;color:var(--ink-3);text-transform:uppercase;margin:0}
.tool-name{font:800 clamp(1.5rem,2.9vw,2.15rem)/1.06 var(--font-display);letter-spacing:-.02em;color:var(--ink);margin:.55rem 0 .15rem}
.tool-body p.tool-gloss{font:500 1.125rem/1.5 var(--font-body);color:var(--ink-3);margin:0 0 1.25rem}
.tool-body p{font-size:1rem;color:var(--ink-2);line-height:1.65;max-width:58ch;margin:0 0 1.05rem}
.tool-body .tool-gloss + p{font-size:1.125rem;color:var(--ink);max-width:51ch}
.tool-body p:last-child{margin-bottom:0}
.tool-body strong{color:var(--ink);font-weight:700}
.tool-body em{font-style:normal;color:var(--ink);font-weight:700}
.belt-next{font-size:1rem;color:var(--ink-2);line-height:1.6;margin:0;padding:3rem 0 0;border-top:1px solid rgba(255,255,255,.07)}
.next-label{font:800 .9rem/1 var(--font-display);letter-spacing:.16em;text-transform:uppercase;color:rgba(var(--warm),.9);margin-right:1.1em}
.nav-links a[aria-current="page"]{color:var(--ink);text-decoration:underline;text-decoration-color:rgba(var(--warm),.7);text-decoration-thickness:2px;text-underline-offset:6px}

.tools-pack{position:relative;text-align:center;padding:clamp(4rem,9vh,7rem) 0 clamp(3rem,6vh,4.5rem);overflow:clip;border-top:1px solid rgba(255,255,255,.07)}
.tools-pack .kicker{margin-bottom:.4rem}
.tools-pack h2{margin:0 auto;max-width:20ch}
.tools-pack .pack-lede{color:var(--ink-2);max-width:54ch;margin:1.1rem auto 0}
.pack-fan{margin:clamp(2.2rem,5vh,3.6rem) 0 0}
.pack-fan img{display:block;width:100%;max-width:920px;height:auto;margin:0 auto}
.tools-cta{position:relative;text-align:center;padding:6rem 0;overflow:clip}
.tools-hero .hero-light{top:-12%;background:
  radial-gradient(1040px 780px at 46% 30%, rgba(var(--key),.6) 0%, rgba(var(--key),0) 70%),
  radial-gradient(420px 360px at 70% 45%, rgba(var(--warm),.1) 0%, rgba(var(--warm),0) 70%),
  radial-gradient(130% 118% at 44% 34%, rgba(0,0,0,0) 42%, var(--vignette) 100%);
  -webkit-mask-image:linear-gradient(#000 calc(100% - 120px),transparent);
  mask-image:linear-gradient(#000 calc(100% - 120px),transparent)}
.tools-cta::before{content:"";position:absolute;inset:auto 0 -25% 0;height:90%;background:radial-gradient(closest-side,rgba(var(--key),.38),transparent 70%);pointer-events:none}
.tools-cta h2{margin-bottom:.6rem}
.tools-cta p{color:var(--ink-2);max-width:46ch;margin:0 auto 1.4rem}

@media (max-width:880px){
  .tool,.tool.flip{grid-template-columns:1fr;gap:2.4rem;padding:clamp(2.4rem,7vh,3.5rem) 0}
  .tool.flip .tool-media{order:0}
  .tools-hero{padding-top:7rem}
  .belt-next{padding-top:3.4rem}
  .next-label{display:block;margin:0 0 .5rem}
  .tool-facts.tf-d{display:none}
  .tool-facts.tf-m{display:block;margin-top:1.1rem;color:var(--ink-3)}
  .tool + .tool{border-top-color:rgba(255,255,255,.12)}
  .tool-facts{font-size:.8rem}
  #flashcards .tool-media img{object-position:18% 38%}
  .tf-m .fct{display:block}
  .tf-m .dot{display:none}
  .belt-next .fct{display:block}
  .belt-next .dot{display:none}
}