/* Wolf's Rock — Adrian Prościak
   Układ: siatka w złotym podziale (1,618 : 1), odstępy z ciągu Fibonacciego.
   Czerń i srebro; złoto wyłącznie w akcentach: linie, punkty aktywne, jeden przycisk.
   W tle płótno z helisą, która rośnie i obraca się wraz z przewijaniem. */

@font-face{font-family:"Marcellus";src:url("../fonts/marcellus-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url("../fonts/hanken-grotesk-var.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url("../fonts/hanken-grotesk-italic-var.woff2") format("woff2");font-weight:100 900;font-style:italic;font-display:swap}

:root{
  color-scheme:dark;
  /* kolor */
  --ink:#000000;          /* czerń */
  --coal:#0d0d0f;         /* panel na czerni */
  --white:#eef0f3;        /* srebrzysta biel — tylko tekst */
  --mist:#121316;         /* stal — panele */
  --silver:#c5c9cf;       /* srebro */
  --silver-dim:#9096a0;   /* srebro przygaszone */
  --steel:#5a5e66;        /* stal — tekst pomocniczy na bieli */
  --gold:#d4af37;         /* złoto */
  --gold-pale:#f2e2a8;    /* złoto jasne */
  --gold-deep:#86661a;    /* złoto ciemne — tekst na bieli */
  --metal-gold:linear-gradient(180deg,#f6e9b6 0%,#d4af37 46%,#9a7a1f 100%);
  --metal-silver:linear-gradient(180deg,#ffffff 0%,#c5c9cf 52%,#7f858e 100%);
  /* pismo */
  --f-display:"Marcellus","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --f-text:"Hanken Grotesk","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --t-xs:.8125rem; --t-sm:.9375rem; --t-base:1.0625rem;
  --t-lead:clamp(1.15rem,1.05rem + .5vw,1.375rem);
  --t-h4:1.3rem;
  --t-h3:clamp(1.45rem,1.25rem + .9vw,1.9rem);
  --t-h2:clamp(1.95rem,1.3rem + 2.9vw,3.4rem);
  --t-h1:clamp(2.3rem,1.3rem + 4.2vw,4.5rem);
  --t-mega:clamp(3.2rem,1rem + 9.5vw,9.5rem);
  /* odstępy: 8 13 21 34 55 89 144 */
  --s1:8px; --s2:13px; --s3:21px; --s4:34px; --s5:55px; --s6:89px; --s7:144px;
  --wrap:1240px;
  --gutter:clamp(20px,4.4vw,55px);
  --header-h:72px;
  --ease:cubic-bezier(.2,.7,.1,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 13px)}
body{margin:0;background:var(--ink);color:var(--white);font-family:var(--f-text);font-size:var(--t-base);line-height:1.62;font-weight:400;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
h1,h2,h3{font-family:var(--f-display);font-weight:400;text-wrap:balance;letter-spacing:-.005em}
h1{font-size:var(--t-h1);line-height:1.07}
h2{font-size:var(--t-h2);line-height:1.1}
h3{font-size:var(--t-h3);line-height:1.18}
h4{font-family:var(--f-text);font-size:var(--t-h4);line-height:1.3;font-weight:600;letter-spacing:-.01em}
p{text-wrap:pretty}
strong{font-weight:650}
::selection{background:var(--gold);color:var(--ink)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-9999px;top:0;background:var(--gold);color:var(--ink);padding:13px 21px;z-index:200;font-weight:600}
.skip:focus{left:13px;top:13px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ───────── pasma ───────── */
.band{--bg:var(--ink);--fg:var(--white);--muted:var(--silver);--faint:var(--silver-dim);--rule:rgba(197,201,207,.2);--accent:var(--gold);
  background:var(--band-bg,transparent);color:var(--fg);padding-block:clamp(55px,9vw,144px);position:relative}
.band--coal{--bg:#09090b;--band-bg:rgba(9,9,11,.78)}
.band--steel{--bg:#121316;--band-bg:linear-gradient(180deg,rgba(24,25,28,.92),rgba(11,11,13,.92));border-block:1px solid rgba(197,201,207,.1)}
.band--tight{padding-block:clamp(34px,5vw,89px)}
.wrap{width:100%;max-width:calc(var(--wrap) + 2*var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.618fr);gap:clamp(34px,6vw,89px);align-items:start}
.split--rev{grid-template-columns:minmax(0,1.618fr) minmax(0,1fr)}
.split > *{min-width:0}
.sticky{position:sticky;top:calc(var(--header-h) + 34px)}
.lead{font-size:var(--t-lead);line-height:1.5;color:var(--muted);max-width:38em}
.muted{color:var(--muted)}
.measure{max-width:41em}
.stack{display:flex;flex-direction:column;gap:var(--s3)}
.stack--lg{gap:var(--s4)}
.sec-head{display:flex;flex-direction:column;gap:var(--s3);margin-bottom:clamp(34px,5vw,55px);max-width:52rem}
.kicker{font-size:var(--t-sm);color:var(--accent);font-weight:550;letter-spacing:.01em}
.gold-text{background:var(--metal-silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.textlink{color:var(--fg);text-decoration:none;background:linear-gradient(var(--accent),var(--accent)) 0 100%/100% 1px no-repeat;padding-bottom:3px;font-weight:550;transition:background-size .35s var(--ease),color .2s}
.textlink:hover{background-size:100% 100%;color:var(--bg)}
.prose p + p{margin-top:1.05em}
.prose{color:var(--muted)}
.prose strong{color:var(--fg)}

/* ───────── nagłówek ───────── */
.site-header{position:fixed;inset:0 0 auto 0;z-index:100;padding-top:env(safe-area-inset-top,0px);color:var(--white)}
/* tło paska leży na osobnej warstwie: rozmycie na samym pasku zamykałoby w nim pełnoekranowe menu */
.site-header::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(0,0,0,.82);-webkit-backdrop-filter:saturate(140%) blur(14px);backdrop-filter:saturate(140%) blur(14px);opacity:0;pointer-events:none;transition:opacity .3s}
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(197,201,207,.16);opacity:0;transition:opacity .3s}
.site-header.is-stuck::before{opacity:1}
.site-header.is-stuck::after{opacity:1}
.site-header__in{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}
.brand{display:flex;align-items:baseline;gap:10px;text-decoration:none;white-space:nowrap}
.brand__name{font-family:var(--f-display);font-size:1.4rem;letter-spacing:.02em}
.brand__by{font-size:var(--t-xs);color:var(--silver-dim);letter-spacing:.02em}
.nav{display:flex;align-items:center;gap:clamp(13px,1.7vw,26px)}
.nav a{font-size:var(--t-sm);text-decoration:none;color:var(--silver);padding:8px 0;position:relative;white-space:nowrap;transition:color .2s}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--white)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.nav .nav__tel{color:var(--gold);font-weight:600;font-variant-numeric:tabular-nums;padding-left:clamp(13px,1.7vw,26px);border-left:1px solid rgba(197,201,207,.25)}
.nav .nav__tel::after{display:none}
.burger{display:none;width:44px;height:44px;background:none;border:0;padding:0;color:var(--white);cursor:pointer;position:relative}
.burger span{position:absolute;left:10px;right:10px;height:1.5px;background:currentColor;transition:transform .3s var(--ease),opacity .2s}
.burger span:nth-child(1){top:16px}.burger span:nth-child(2){top:22px}.burger span:nth-child(3){top:28px}
.nav-open .burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-open .burger span:nth-child(2){opacity:0}
.nav-open .burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--metal-gold);background:linear-gradient(90deg,#9a7a1f,#f2e2a8 50%,#d4af37);transform:scaleX(var(--page-p,0));transform-origin:left;z-index:2}

@media (max-width:1080px){
  .burger{display:block;z-index:3}
  .nav{position:fixed;inset:0;background:var(--ink);flex-direction:column;align-items:flex-start;justify-content:center;gap:0;padding:calc(var(--header-h) + 21px) var(--gutter) 34px;transform:translateY(-102%);transition:transform .5s var(--ease);visibility:hidden;overflow-y:auto}
  .nav-open .nav{transform:none;visibility:visible}
  .nav a{font-family:var(--f-display);font-size:clamp(1.7rem,7vw,2.4rem);color:var(--white);padding:9px 0;width:100%;border-bottom:1px solid rgba(197,201,207,.16)}
  .nav a::after{display:none}
  .nav a[aria-current="page"]{color:var(--gold)}
  .nav .nav__tel{font-family:var(--f-text);font-size:1.35rem;border:0;padding:21px 0 0}
  .brand{z-index:3;position:relative}
  body.nav-open{overflow:hidden}
}

/* ───────── przyciski ───────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:13px 26px;font:600 var(--t-sm)/1.2 var(--f-text);letter-spacing:.01em;text-decoration:none;border-radius:2px;border:1px solid transparent;cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s,background-color .25s,color .25s,border-color .25s;font-variant-numeric:tabular-nums}
.btn--gold{background:linear-gradient(180deg,#f2e2a8,#d4af37 55%,#b28f27);color:var(--ink);box-shadow:0 0 0 0 rgba(212,175,55,0)}
.btn--gold:hover{transform:translateY(-2px);box-shadow:0 13px 34px -13px rgba(212,175,55,.65)}
.btn--line{border-color:rgba(197,201,207,.5);color:var(--white)}
.btn--line:hover{background:var(--white);color:var(--ink);border-color:var(--white)}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s2)}

/* ───────── hero ───────── */
.hero{padding-top:calc(var(--header-h) + env(safe-area-inset-top,0px) + clamp(34px,6vw,89px));padding-bottom:clamp(34px,5vw,89px);overflow:hidden}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.618fr) minmax(0,1fr);gap:clamp(34px,5vw,89px);align-items:center;position:relative;z-index:1}
.hero__who{font-size:var(--t-sm);color:var(--silver);margin-bottom:var(--s3);display:flex;align-items:center;gap:13px}
.hero__who::before{content:"";width:34px;height:1px;background:var(--gold);flex:none}
.hero h1{margin-bottom:var(--s4)}
.hero .lead{margin-bottom:var(--s4)}
.hero__spiral{position:absolute;right:-6%;top:50%;width:min(1180px,96vw);transform:translateY(-50%);opacity:.5;pointer-events:none;z-index:0}
.hero__spiral .sq{fill:none;stroke:rgba(197,201,207,.16);stroke-width:1;vector-effect:non-scaling-stroke}
.hero__spiral .sp{fill:none;stroke:var(--gold);stroke-width:1.25;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0}
.portrait{position:relative;justify-self:end;width:100%;max-width:420px}
.portrait__frame{position:relative;aspect-ratio:1/1.5;overflow:hidden;background:var(--coal)}
.portrait__frame img{width:100%;height:112%;object-fit:cover;object-position:50% 12%;transform:translateY(calc(var(--p,.5) * -9%));will-change:transform}
.portrait__frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 62%,rgba(0,0,0,.55) 100%);pointer-events:none}
.portrait::before{content:"";position:absolute;inset:21px -21px -21px 21px;border:1px solid var(--gold);opacity:.75;pointer-events:none}
.dim{position:absolute;left:-34px;top:0;bottom:0;width:21px;display:flex;align-items:center;justify-content:center}
.dim::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(197,201,207,.45)}
.dim::after{content:"";position:absolute;left:4px;right:4px;top:0;bottom:0;border-block:1px solid rgba(197,201,207,.7)}
.dim span{position:relative;writing-mode:vertical-rl;transform:rotate(180deg);background:var(--ink);padding:13px 0;font-size:var(--t-xs);color:var(--silver);letter-spacing:.06em;white-space:nowrap}

/* liczby na linii wymiarowej */
.figures{margin-top:clamp(55px,7vw,89px);position:relative;z-index:1}
.figures__row{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1.15fr) minmax(0,.8fr) minmax(0,.7fr) minmax(0,.95fr);border-top:1px solid rgba(197,201,207,.35);position:relative}
.figure{padding:var(--s3) var(--s3) 0 0;position:relative}
.figure::before{content:"";position:absolute;left:0;top:-6px;width:1px;height:11px;background:var(--silver)}
.figure:last-child::after{content:"";position:absolute;right:0;top:-6px;width:1px;height:11px;background:var(--silver)}
.figure__n{font-family:var(--f-display);font-size:clamp(1.9rem,1rem + 2.3vw,3.1rem);line-height:1;white-space:nowrap;background:var(--metal-silver);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:lining-nums}
.figure__l{font-size:var(--t-sm);color:var(--silver);margin-top:10px;line-height:1.35;max-width:15em}

/* hero podstron */
.page-hero{padding-top:calc(var(--header-h) + env(safe-area-inset-top,0px) + clamp(55px,8vw,110px));padding-bottom:clamp(44px,6vw,89px);overflow:hidden}
.page-hero .wrap{position:relative;z-index:1}
.page-hero h1{max-width:17em;margin-bottom:var(--s3)}
.page-hero .lead{max-width:36em}
.page-hero .hero__spiral{width:min(900px,90vw);right:-10%;opacity:.42}
.crumbs{font-size:var(--t-sm);color:var(--silver-dim);margin-bottom:var(--s4);display:flex;gap:10px;align-items:center}
.crumbs a{color:var(--silver);text-decoration:none}
.crumbs a:hover{color:var(--gold)}
.crumbs i{width:21px;height:1px;background:var(--gold);display:block}

/* ───────── bolączki ───────── */
.pains{border-top:1px solid var(--rule)}
.pain{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding-block:var(--s4);border-bottom:1px solid var(--rule)}
.pain h3{font-size:var(--t-h3)}
.pain p{color:var(--muted);max-width:36em}
.closing{font-family:var(--f-display);font-size:var(--t-h3);line-height:1.25;margin-top:var(--s5);max-width:26em}

/* ───────── przewijany napis ───────── */
.marquee{padding-block:clamp(34px,6vw,89px);overflow:hidden;border-block:1px solid rgba(197,201,207,.14)}
.marquee__track{display:flex;gap:.6em;white-space:nowrap;font-family:var(--f-display);font-size:var(--t-mega);line-height:1;transform:translate3d(calc(var(--p,.35) * -38%),0,0);will-change:transform}
.marquee__track span{flex:none}
.marquee__track .o{color:transparent;-webkit-text-stroke:1px rgba(197,201,207,.8)}
.marquee__track .g{background:var(--metal-silver);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ───────── złoty prostokąt: trzy kompetencje ───────── */
.phi{position:relative;display:grid;grid-template-columns:61.8034% 38.1966%;aspect-ratio:1.618034/1;border:1px solid rgba(197,201,207,.28)}
.phi__a{background:var(--coal);color:var(--white);--muted:var(--silver);border-right:1px solid rgba(197,201,207,.28)}
.phi__r{display:grid;grid-template-rows:61.8034% 38.1966%;min-height:0}
.phi__b{background:linear-gradient(150deg,#4a4d53,#1d1e22 75%);color:var(--white);--muted:var(--silver)}
.phi__r2{display:grid;grid-template-columns:38.1966% 61.8034%;min-height:0}
.phi__d{background:linear-gradient(160deg,#eef0f3,#aab0b8 55%,#7f858e);color:var(--ink);display:flex;align-items:center;justify-content:center;text-align:center}
.phi__c{background:#060607;color:var(--white);--muted:var(--silver);box-shadow:inset 0 0 0 1px var(--gold)}
.phi__c h3{color:var(--gold)}
.phi__cell{padding:clamp(18px,2.6vw,42px);display:flex;flex-direction:column;justify-content:space-between;gap:var(--s3);min-width:0;min-height:0;position:relative;overflow:hidden}
.phi__cell h3{font-size:clamp(1.5rem,1rem + 2vw,2.9rem)}
.phi__b h3{font-size:clamp(1.4rem,.9rem + 1.6vw,2.3rem)}
.phi__c h3{font-size:clamp(1.3rem,.9rem + 1.1vw,1.9rem)}
.phi__cell p{color:var(--muted);max-width:30em}
.phi__c p{font-size:var(--t-sm);line-height:1.45}
.phi__d p{font-family:var(--f-display);font-size:clamp(1rem,.7rem + .8vw,1.35rem);line-height:1.15;color:var(--ink);writing-mode:vertical-rl;transform:rotate(180deg)}
.tools{display:flex;flex-wrap:wrap;gap:6px 8px;margin-top:var(--s3)}
.tools li{font-size:var(--t-xs);padding:5px 11px;border:1px solid currentColor;border-radius:99px;opacity:.82;white-space:nowrap}
.phi__spiral{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.phi__spiral path{fill:none;stroke:#8a8f97;stroke-width:1.25;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--p,1))}
.after-phi{display:grid;grid-template-columns:minmax(0,1.618fr) minmax(0,1fr);gap:clamp(21px,4vw,55px);margin-top:clamp(34px,4vw,55px);align-items:end}
.after-phi > p{font-family:var(--f-display);font-size:var(--t-h3);line-height:1.25}

@media (max-width:900px){
  .phi{display:block;aspect-ratio:auto}
  .phi__a{border-right:0}
  .phi__r,.phi__r2{display:block}
  .phi__cell{padding:34px 21px}
  .phi__d{padding:21px}
  .phi__d p{writing-mode:horizontal-tb;transform:none}
  .phi__spiral{display:none}
  .after-phi{grid-template-columns:1fr}
}

/* ───────── Wolf's Way ───────── */
.way{position:relative;padding-left:clamp(44px,6vw,76px)}
.way::before{content:"";position:absolute;left:13px;top:8px;bottom:8px;width:1px;background:var(--rule)}
.way__fill{position:absolute;left:12px;top:8px;bottom:8px;width:3px;background:linear-gradient(180deg,#b28f27,#d4af37);transform:scaleY(var(--p,1));transform-origin:top}
.step{position:relative;padding-bottom:var(--s5)}
.step:last-child{padding-bottom:0}
.step::before{content:"";position:absolute;left:calc(-1 * clamp(44px,6vw,76px) + 7px);top:10px;width:13px;height:13px;border-radius:50%;background:var(--bg);border:1px solid var(--faint);transition:background-color .4s,border-color .4s,box-shadow .4s}
.step.is-on::before{background:var(--gold);border-color:var(--gold);box-shadow:0 0 0 6px rgba(212,175,55,.18)}
.step__n{font-family:var(--f-display);font-size:var(--t-sm);color:var(--accent);letter-spacing:.08em;display:block;margin-bottom:5px}
.step h3{margin-bottom:8px}
.step p{color:var(--muted);max-width:34em}
.step__out{margin-top:10px;font-size:var(--t-sm);color:var(--fg);display:flex;gap:10px;align-items:baseline}
.step__out::before{content:"";width:21px;height:1px;background:var(--accent);flex:none;transform:translateY(-4px)}

/* ───────── drogi (lista odnośników) ───────── */
.doors{border-top:1px solid var(--rule)}
.door{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.618fr) auto;gap:clamp(13px,3vw,55px);align-items:center;padding:clamp(21px,3vw,40px) clamp(0px,1.5vw,21px);border-bottom:1px solid var(--rule);text-decoration:none;color:var(--fg);position:relative;isolation:isolate;transition:color .35s var(--ease),padding .35s var(--ease)}
.door::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,#eef0f3,#b9bec5 60%,#8e939b);transform:scaleY(0);transform-origin:bottom;transition:transform .45s var(--ease);z-index:-1}
.door:hover,.door:focus-visible{color:var(--ink);padding-inline:clamp(13px,2.5vw,34px)}
.door:hover::before,.door:focus-visible::before{transform:scaleY(1)}
.door h3{font-size:clamp(1.6rem,1.1rem + 2vw,2.7rem)}
.door__for{display:block;font-family:var(--f-text);font-size:var(--t-sm);color:var(--faint);margin-bottom:6px;letter-spacing:0;transition:color .35s}
.door p{color:var(--muted);transition:color .35s;max-width:36em}
.door:hover p,.door:hover .door__for,.door:focus-visible p,.door:focus-visible .door__for{color:#1d1e22}
.door__go{width:55px;height:55px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;transition:background-color .35s,color .35s,border-color .35s,transform .45s var(--ease)}
.door__go svg{width:21px;height:21px}
.door:hover .door__go,.door:focus-visible .door__go{background:var(--ink);border-color:var(--ink);color:var(--gold);transform:rotate(-45deg)}

@media (max-width:760px){.door{grid-template-columns:minmax(0,1fr) auto}.door > div:nth-child(2){grid-column:1/-1;grid-row:2}.door__go{width:44px;height:44px;grid-row:1;grid-column:2}}

/* ───────── wykres słupkowy oszczędności ───────── */
.bars{display:grid;gap:var(--s3)}
.bar{display:grid;grid-template-columns:minmax(0,13.5rem) minmax(0,1fr);gap:var(--s3);align-items:center}
.bar__who{font-size:var(--t-sm);line-height:1.3;color:var(--muted)}
.bar__who b{display:block;font-family:var(--f-display);font-weight:400;font-size:1.3rem;color:var(--fg);letter-spacing:.005em}
.bar__track{position:relative;height:44px;display:flex;align-items:center}
.bar__fill{height:100%;width:calc(var(--v) / 4.7 * 78%);background:linear-gradient(90deg,#1b1c1f,#6f747c 55%,#e3e6ea);box-shadow:inset -3px 0 0 var(--gold);transform:scaleX(var(--g,1));transform-origin:left;transition:transform 1.4s var(--ease)}
.bar__val{font-family:var(--f-display);font-size:clamp(1.25rem,.9rem + 1.2vw,1.9rem);padding-left:13px;white-space:nowrap;font-variant-numeric:lining-nums}
.axis{display:grid;grid-template-columns:minmax(0,13.5rem) minmax(0,1fr);gap:var(--s3);margin-top:var(--s2);font-size:var(--t-xs);color:var(--faint);font-variant-numeric:tabular-nums}
.axis__scale{position:relative;height:26px;border-top:1px solid var(--rule)}
.axis__scale span{position:absolute;top:8px;transform:translateX(-50%)}
.axis__scale span::before{content:"";position:absolute;left:50%;top:-12px;width:1px;height:7px;background:var(--faint)}
.axis__scale span:first-child{transform:none}
.axis__scale span:first-child::before{left:0}
.chart-note{margin-top:var(--s4);font-size:var(--t-sm);color:var(--faint);max-width:46em}
@media (max-width:700px){.bar{grid-template-columns:1fr;gap:6px}.axis{grid-template-columns:1fr}.axis > :first-child{display:none}.bar__track{height:34px}}

/* ───────── cytat ───────── */
.quote{font-family:var(--f-display);font-size:clamp(1.6rem,1rem + 2.6vw,3.1rem);line-height:1.2;text-wrap:balance;max-width:21em}
.quote__by{margin-top:var(--s4);font-size:var(--t-sm);color:var(--faint);display:flex;align-items:center;gap:13px}
.quote__by::before{content:"";width:34px;height:1px;background:var(--accent)}

/* ───────── karty / siatki treści ───────── */
.grid{display:grid;gap:clamp(21px,3vw,34px)}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.item{border-top:1px solid var(--rule);padding-top:var(--s3);display:flex;flex-direction:column;gap:10px;min-width:0}
.item h3{font-size:clamp(1.3rem,1.1rem + .8vw,1.7rem)}
.item p{color:var(--muted)}
.item--gold{border-top-color:var(--accent)}
.item p.figure__n{color:transparent}
.panel{background:var(--coal);border:1px solid rgba(197,201,207,.2);padding:clamp(21px,3.2vw,44px)}
.ticks li{position:relative;padding-left:28px;color:var(--muted)}
.ticks li + li{margin-top:8px}
.ticks li::before{content:"";position:absolute;left:0;top:.82em;width:16px;height:1px;background:var(--accent)}
.dl{display:grid;grid-template-columns:minmax(0,9.5rem) minmax(0,1fr);gap:8px 21px;font-size:var(--t-sm)}
.dl dt{color:var(--faint)}
.dl dd{color:var(--fg)}
@media (max-width:520px){.dl{grid-template-columns:1fr;gap:2px 0}.dl dd{margin-bottom:10px}}

/* usługi: wiersze */
.svc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.618fr);gap:clamp(21px,5vw,89px);padding-block:clamp(34px,4.5vw,55px);border-top:1px solid var(--rule)}
.svc:last-child{border-bottom:1px solid var(--rule)}
.svc h3{font-size:clamp(1.6rem,1.1rem + 1.8vw,2.4rem)}
.svc__when{margin-top:10px;font-size:var(--t-sm);color:var(--faint);max-width:22em}
.svc__body{display:flex;flex-direction:column;gap:var(--s3)}
.svc__body > p{color:var(--muted);max-width:38em}

/* szkolenia */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:var(--s4)}
.chip{font:550 var(--t-sm)/1 var(--f-text);padding:12px 18px;border-radius:99px;border:1px solid var(--rule);background:transparent;color:var(--fg);cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.chip:hover{border-color:var(--fg)}
.chip[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.course{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.618fr);gap:clamp(21px,5vw,89px);padding-block:clamp(34px,4.5vw,55px);border-top:1px solid var(--rule)}
.course:last-of-type{border-bottom:1px solid var(--rule)}
.course__cat{font-size:var(--t-sm);color:var(--accent);font-weight:600;margin-bottom:8px;display:block}
.course h3{font-size:clamp(1.5rem,1.1rem + 1.6vw,2.2rem)}
.course__meta{margin-top:var(--s3)}
.course__body{display:flex;flex-direction:column;gap:var(--s3)}
.course__body > p{color:var(--muted);max-width:38em}
.course[hidden]{display:none}
.sub{font-size:var(--t-sm);font-weight:650;color:var(--fg);letter-spacing:.01em;margin-bottom:8px}

/* projekty */
.case{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.618fr);gap:clamp(21px,5vw,89px);padding-block:clamp(34px,5vw,72px);border-top:1px solid var(--rule)}
.case__n{font-family:var(--f-display);font-size:clamp(2.6rem,1.4rem + 5vw,5.6rem);line-height:.95;white-space:nowrap;font-variant-numeric:lining-nums}
.case__n small{font-size:.42em;letter-spacing:.01em}
.case__where{margin-top:13px;font-size:var(--t-sm);color:var(--faint)}
.case h3{margin-bottom:13px}
.case p{color:var(--muted);max-width:38em}
.log{border-top:1px solid var(--rule)}
.log li{display:grid;grid-template-columns:minmax(0,7rem) minmax(0,1fr);gap:var(--s3);padding-block:var(--s3);border-bottom:1px solid var(--rule)}
.log time,.log .when{font-size:var(--t-sm);color:var(--accent);font-variant-numeric:tabular-nums;font-weight:600;padding-top:3px}
.log b{display:block;font-weight:650;margin-bottom:3px}
.log span{color:var(--muted)}
@media (max-width:520px){.log li{grid-template-columns:1fr;gap:3px}}

/* o mnie: oś czasu */
.tl{border-top:1px solid var(--rule)}
.tl li{display:grid;grid-template-columns:minmax(0,8.5rem) minmax(0,1fr);gap:var(--s3);padding-block:var(--s3);border-bottom:1px solid var(--rule)}
.tl .yr{font-family:var(--f-display);font-size:1.15rem;color:var(--accent);font-variant-numeric:lining-nums}
.tl b{font-weight:650;display:block}
.tl span{color:var(--muted);font-size:var(--t-sm)}
@media (max-width:520px){.tl li{grid-template-columns:1fr;gap:2px}}
.books li{padding-block:13px;border-bottom:1px solid var(--rule);display:flex;justify-content:space-between;gap:var(--s3);align-items:baseline}
.books li:first-child{border-top:1px solid var(--rule)}
.books b{font-family:var(--f-display);font-weight:400;font-size:1.25rem}
.books span{font-size:var(--t-sm);color:var(--faint);text-align:right;flex:none}

/* opinie */
.rating{display:flex;align-items:baseline;gap:var(--s3);flex-wrap:wrap}
.rating__n{font-family:var(--f-display);font-size:clamp(4rem,2rem + 9vw,9rem);line-height:.9;font-variant-numeric:lining-nums}
.rating__of{font-family:var(--f-display);font-size:clamp(1.5rem,1rem + 2vw,2.6rem);color:var(--faint)}
.refs{border-top:1px solid var(--rule)}
.ref{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.618fr);gap:clamp(13px,4vw,72px);padding-block:var(--s4);border-bottom:1px solid var(--rule)}
.ref h3{font-size:clamp(1.25rem,1.05rem + .8vw,1.6rem)}
.ref p{color:var(--muted)}
.ref__tag{display:block;font-family:var(--f-text);font-size:var(--t-sm);color:var(--accent);font-weight:600;margin-bottom:5px}
.opinion{border-top:1px solid var(--accent);padding-top:var(--s3)}
.opinion blockquote{font-family:var(--f-display);font-size:clamp(1.25rem,1.05rem + .9vw,1.7rem);line-height:1.3}
.opinion figcaption{margin-top:var(--s3);font-size:var(--t-sm);color:var(--faint)}
.opinion figcaption b{color:var(--fg);font-weight:650;display:block}

/* kontakt */
.contact{text-align:left}
.tel-big{display:inline-block;font-family:var(--f-display);font-size:clamp(2.6rem,1rem + 8.4vw,8rem);line-height:1;text-decoration:none;white-space:nowrap;background:var(--metal-silver);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:lining-nums;letter-spacing:-.01em}
.tel-big--full{font-size:clamp(1.9rem,10.4vw,8rem)}
.mail-big{display:inline-block;font-family:var(--f-display);font-size:clamp(1.5rem,.9rem + 3vw,3.1rem);line-height:1.1;text-decoration:none;color:var(--white);background:linear-gradient(var(--gold),var(--gold)) 0 100%/100% 1px no-repeat;padding-bottom:5px;overflow-wrap:anywhere}
.mail-big:hover{color:var(--gold)}
.contact__rows{display:grid;gap:clamp(34px,5vw,55px);margin-top:clamp(34px,5vw,55px)}
.contact__lbl{font-size:var(--t-sm);color:var(--silver);margin-bottom:10px;display:flex;gap:13px;align-items:center}
.copy{font:550 var(--t-xs)/1 var(--f-text);color:var(--silver);background:none;border:1px solid rgba(197,201,207,.35);border-radius:99px;padding:6px 12px;cursor:pointer;transition:color .2s,border-color .2s,background-color .2s}
.copy:hover{color:var(--ink);background:var(--white);border-color:var(--white)}
.copy.is-done{color:var(--ink);background:var(--gold);border-color:var(--gold)}

/* ───────── stopka ───────── */
.footer{background:var(--ink);color:var(--silver);border-top:1px solid rgba(197,201,207,.16);padding-block:var(--s5) calc(var(--s4) + env(safe-area-inset-bottom,0px));font-size:var(--t-sm)}
.footer__grid{display:grid;grid-template-columns:minmax(0,1.618fr) minmax(0,1fr) minmax(0,1fr);gap:var(--s4)}
.footer__brand{font-family:var(--f-display);font-size:1.9rem;color:var(--white);line-height:1.1}
.footer__motto{margin-top:10px;font-style:italic;color:var(--silver-dim);max-width:24em}
.footer h4{font-size:var(--t-sm);color:var(--white);margin-bottom:10px;font-weight:650}
.footer a{text-decoration:none;color:var(--silver)}
.footer a:hover{color:var(--gold)}
.footer li + li{margin-top:5px}
.footer__legal{margin-top:var(--s5);padding-top:var(--s3);border-top:1px solid rgba(197,201,207,.16);display:flex;flex-wrap:wrap;gap:8px 34px;justify-content:space-between;color:var(--silver-dim);font-size:var(--t-xs)}

/* ───────── ruch ───────── */
html.anim [data-reveal]{opacity:0;transform:translate3d(0,30px,0);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0) * 90ms)}
html.anim [data-reveal="clip"]{opacity:1;transform:none;clip-path:inset(0 0 100% 0);transition:clip-path 1.2s var(--ease);transition-delay:calc(var(--i,0) * 90ms)}
html.anim [data-reveal="line"]{opacity:1;transform:scaleX(0);transform-origin:left;transition:transform 1.3s var(--ease)}
html.anim [data-reveal].in{opacity:1;transform:none;clip-path:inset(0)}
html.anim .bar__fill{--g:0}
html.anim .bars.in .bar__fill{--g:1}
html.anim .bars.in .bar:nth-child(2) .bar__fill{transition-delay:.12s}
html.anim .bars.in .bar:nth-child(3) .bar__fill{transition-delay:.24s}
html.anim .bars.in .bar:nth-child(4) .bar__fill{transition-delay:.36s}
html.anim .bars.in .bar:nth-child(5) .bar__fill{transition-delay:.48s}

@keyframes rise{from{opacity:0;transform:translate3d(0,34px,0)}to{opacity:1;transform:none}}
@keyframes unveil{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0)}}
@keyframes draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes fadein{from{opacity:0}to{opacity:1}}
html.anim .load > *{animation:rise 1s var(--ease) both;animation-delay:calc(var(--i,0) * 110ms + 620ms)}
html.anim .load-unveil{animation:unveil 1.5s var(--ease) both .75s}
html.anim .load-fade{animation:fadein 1.2s ease both 1.5s}
html.anim .hero__spiral .sp{animation:draw 2.8s cubic-bezier(.5,0,.1,1) both .3s}
html.anim .hero__spiral .sq{animation:fadein 1.6s ease both .2s}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .marquee__track,.portrait__frame img{transform:none!important}
}

/* ───────── responsywność ───────── */
@media (max-width:980px){
  .hero__grid{grid-template-columns:1fr}
  .portrait{justify-self:start;max-width:340px;margin-left:34px}
  .figures__row{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:var(--s4)}
  .figure:nth-child(3)::after{content:"";position:absolute;right:0;top:-6px;width:1px;height:11px;background:var(--silver)}
  .figure:nth-child(n+4){border-top:1px solid rgba(197,201,207,.35);margin-top:0}
  .grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer__grid{grid-template-columns:1fr 1fr}
  .footer__grid > :first-child{grid-column:1/-1}
}
@media (max-width:820px){
  .split,.split--rev,.svc,.course,.case,.ref{grid-template-columns:1fr}
  .sticky{position:static}
}
@media (max-width:620px){
  :root{--header-h:64px}
  .figures__row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .figure:nth-child(3)::after{display:none}
  .figure:nth-child(n+3){border-top:1px solid rgba(197,201,207,.35)}
  .figure:nth-child(2)::after,.figure:nth-child(4)::after{content:"";position:absolute;right:0;top:-6px;width:1px;height:11px;background:var(--silver)}
  .grid--2,.grid--3,.grid--4{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr}
  .brand__by{display:none}
  .btn{width:100%}
  .portrait{margin-left:34px;max-width:min(300px,calc(100% - 55px))}
  .books li{flex-direction:column;gap:2px}
  .books span{text-align:left}
}

/* ═════════ warstwa efektów ═════════ */

/* tło: poświata, płótno helisy, ziarno */
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(70vw 55vh at 85% -12%,rgba(197,201,207,.13),transparent 62%),
  radial-gradient(60vw 50vh at -10% 108%,rgba(197,201,207,.07),transparent 60%)}
body::after{content:"";position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E")}
#dna{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block}
main,.footer{position:relative;z-index:1}
.footer{background:rgba(0,0,0,.86)}

/* nagłówki: srebro o metalicznym połysku, słowo po słowie */
h1,h2,.quote,.closing{color:var(--white)}
.is-split .w{display:inline-block;background:linear-gradient(180deg,#ffffff 8%,#d5d8dd 48%,#8a9099 100%);-webkit-background-clip:text;background-clip:text;color:transparent;padding-bottom:.12em;margin-bottom:-.12em}
html.anim .is-split .w{opacity:0;filter:blur(10px);transform:translate3d(0,.4em,0);transition:opacity .9s var(--ease),filter .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--w,0) * 46ms + var(--d,0ms))}
html.anim .is-split.words-in .w{opacity:1;filter:none;transform:none}

/* kurtyna przejścia między stronami: sześć klocków */
.curtain{display:none}
html.anim .curtain{display:grid;grid-template-columns:repeat(6,1fr);position:fixed;inset:0;z-index:300;pointer-events:none}
.curtain i{display:block;background:linear-gradient(180deg,#0e0e10,#040405);border-right:1px solid rgba(197,201,207,.14);transform:scaleY(1);transform-origin:top;transition:transform .75s cubic-bezier(.7,0,.2,1);transition-delay:calc(var(--k) * 60ms)}
.curtain i:last-of-type{border-right:0}
.curtain span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--f-display);font-size:clamp(1.6rem,4vw,2.6rem);letter-spacing:.04em;color:var(--white);white-space:nowrap;transition:opacity .35s;padding-bottom:13px;background:linear-gradient(var(--gold),var(--gold)) 50% 100%/55px 1px no-repeat}
html.is-open .curtain i{transform:scaleY(0)}
html.is-open .curtain span{opacity:0}
html.is-leaving .curtain i{transform:scaleY(1);transform-origin:bottom;transition-duration:.5s;transition-delay:calc(var(--k) * 45ms)}
html.is-leaving .curtain span{opacity:1;transition-delay:.3s}

/* hero */
.hero,.page-hero{overflow:visible}
.hero__grid{perspective:1400px}
.portrait__frame{transform:perspective(900px) rotateX(calc(var(--rx,0) * 1deg)) rotateY(calc(var(--ry,0) * 1deg));transition:transform .5s var(--ease);box-shadow:0 34px 89px -34px rgba(0,0,0,.9),0 0 0 1px rgba(197,201,207,.16)}
.portrait::before{transform:translate3d(calc(var(--ry,0) * -1.6px),calc(var(--rx,0) * 1.6px),0);transition:transform .5s var(--ease)}
.portrait__frame::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.16) 48%,transparent 60%);transform:translateX(-120%);transition:transform 1.1s var(--ease)}
.portrait:hover .portrait__frame::before{transform:translateX(120%)}
.page-hero{min-height:min(62vh,560px);display:flex;align-items:flex-end}
.page-hero > .wrap{width:100%}
.figure::before,.figure:last-child::after{background:var(--gold)}

/* przycisk: połysk */
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn::after{content:"";position:absolute;inset:-2px;z-index:-1;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-130%);transition:transform .8s var(--ease)}
.btn:hover::after{transform:translateX(130%)}
.btn--line{border-color:rgba(197,201,207,.45);background:rgba(197,201,207,.04)}
.btn--line::after{background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.2) 50%,transparent 70%)}
.btn--line:hover{background:linear-gradient(100deg,#eef0f3,#b9bec5);color:var(--ink);border-color:#eef0f3}

/* pas z hasłem: helisa na środku */
.marquee{min-height:min(86vh,760px);display:flex;align-items:center;border-block:1px solid rgba(197,201,207,.1)}
.marquee__track .o{-webkit-text-stroke:1px rgba(238,240,243,.75)}

/* złoty prostokąt: klocki układają się przy przewijaniu */
.phi{border-color:rgba(197,201,207,.22);box-shadow:0 55px 144px -55px rgba(0,0,0,.95)}
.phi__a{background:linear-gradient(160deg,#101113,#050506)}
.phi__cell{will-change:transform}
@media (min-width:901px){
  html.anim .phi{--q:calc(1 - var(--p,1))}
  html.anim .phi__a{transform:translate3d(calc(var(--q) * -9%),calc(var(--q) * 7%),0) rotate(calc(var(--q) * -4deg));opacity:calc(.2 + var(--p,1) * .8)}
  html.anim .phi__b{transform:translate3d(calc(var(--q) * 16%),calc(var(--q) * -22%),0) rotate(calc(var(--q) * 6deg));opacity:calc(.2 + var(--p,1) * .8)}
  html.anim .phi__d{transform:translate3d(calc(var(--q) * -60%),calc(var(--q) * 70%),0) rotate(calc(var(--q) * -14deg));opacity:calc(.2 + var(--p,1) * .8)}
  html.anim .phi__c{transform:translate3d(calc(var(--q) * 40%),calc(var(--q) * 55%),0) rotate(calc(var(--q) * 9deg));opacity:calc(.2 + var(--p,1) * .8)}
  html.anim .phi[data-reveal]{opacity:1;transform:none}
  .phi{border-color:rgba(197,201,207,calc(var(--p,1) * .22))}
}
.phi__spiral path{stroke:rgba(238,240,243,.5)}

/* połysk pod kursorem */
[data-sheen]{position:relative}
[data-sheen]::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.11),transparent 62%);opacity:0;transition:opacity .35s}
[data-sheen]:hover::after{opacity:1}
.panel{background:linear-gradient(150deg,rgba(32,34,38,.72),rgba(10,10,12,.82));border:1px solid rgba(197,201,207,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.item{position:relative;border-top-color:rgba(197,201,207,.22);transition:border-color .4s}
.item::before{content:"";position:absolute;left:0;top:-1px;width:100%;height:1px;background:linear-gradient(90deg,var(--gold),rgba(212,175,55,0));transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease) .15s}
.item.in::before,html:not(.anim) .item::before{transform:scaleX(.38)}
.item--gold{border-top-color:rgba(197,201,207,.22)}
.item:hover::before{transform:scaleX(1)}

/* wiersze list: linia, która rysuje się przy wejściu */
.pain,.svc,.course,.case,.ref,.log li,.tl li{position:relative}
.svc h3,.course h3,.case h3,.pain h3{transition:transform .5s var(--ease)}
.svc:hover h3,.course:hover h3,.pain:hover h3{transform:translateX(8px)}
.chip{border-color:rgba(197,201,207,.3)}
.chip[aria-pressed="true"]{background:linear-gradient(100deg,#eef0f3,#b9bec5);color:var(--ink);border-color:#eef0f3}

/* Wolf's Way: wieża z klocków */
.tower{display:block;width:clamp(130px,calc((100vh - 580px) * .7),230px);height:auto;margin-top:var(--s3);overflow:visible}
.slab__t{fill:url(#tw-top);stroke:rgba(238,240,243,.55);stroke-width:1;transition:stroke .4s}
.slab__l{fill:url(#tw-l);stroke:rgba(197,201,207,.28);stroke-width:1}
.slab__r{fill:url(#tw-r);stroke:rgba(197,201,207,.2);stroke-width:1}
.slab__n{font-family:var(--f-display);font-size:30px;fill:#0b0b0d;transition:fill .4s}
.slab{transition:transform .9s var(--ease),opacity .5s ease}
html.anim .slab{opacity:0;transform:translate3d(0,-89px,0)}
html.anim .slab.on{opacity:1;transform:none}
html.anim .tower.auto .slab{opacity:1;transform:none;transition-delay:calc(var(--k) * 140ms)}
.slab.cur .slab__t{stroke:var(--gold);stroke-width:1.5}
.slab.cur .slab__t{filter:drop-shadow(0 0 13px rgba(212,175,55,.45))}
.step.is-on .step__n{color:var(--gold)}
.step__n{color:var(--silver-dim);transition:color .4s}
.way::before{background:rgba(197,201,207,.2)}
.way__fill{width:1px;left:13px;background:linear-gradient(180deg,rgba(212,175,55,.2),var(--gold))}
.step::before{background:#0b0b0d;border-color:rgba(197,201,207,.5)}

/* wykres */
.bar__fill{transform-origin:left;position:relative}
.bar__val{background:var(--metal-silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.axis__scale{border-top-color:rgba(197,201,207,.25)}

/* liczby na stronach */
.rating__of,.case__n small{-webkit-text-fill-color:var(--silver-dim)}
.contact__lbl::before{content:"";width:21px;height:1px;background:var(--gold)}
.mail-big{background-image:linear-gradient(var(--gold),var(--gold))}
.opinion{border-top-color:var(--gold)}

/* odnośniki-drzwi */
.door{border-bottom-color:rgba(197,201,207,.18)}
.doors{border-top-color:rgba(197,201,207,.18)}
.door__go{border-color:rgba(197,201,207,.5)}

@media (max-width:980px){
  .page-hero{min-height:0}
  .marquee{min-height:min(60vh,460px)}
}
@media (max-width:820px){
  .tower{width:150px;margin-inline:0}
}
@media (prefers-reduced-motion:reduce){
  .phi__cell{transform:none!important;opacity:1!important}
}

/* światło podążające za kursorem */
.glow{position:fixed;left:0;top:0;width:680px;height:680px;margin:-340px 0 0 -340px;z-index:0;pointer-events:none;border-radius:50%;background:radial-gradient(circle,rgba(197,201,207,.09),rgba(197,201,207,.03) 40%,transparent 68%);transform:translate3d(var(--gx,70vw),var(--gy,30vh),0);opacity:0;transition:opacity .8s}
.glow.on{opacity:1}

/* klocki, które wpadają na miejsce */
html.anim .figure[data-reveal],html.anim .grid > .item[data-reveal],html.anim .grid > .panel[data-reveal]{transform:perspective(900px) rotateX(-62deg) translate3d(0,34px,0);transform-origin:50% 0;transition:opacity .9s var(--ease),transform 1.1s var(--ease);transition-delay:calc(var(--i,0) * 110ms)}
html.anim .figure[data-reveal].in,html.anim .grid > .item[data-reveal].in,html.anim .grid > .panel[data-reveal].in{transform:none}
html.anim .door[data-reveal]{transform:translate3d(-34px,0,0)}
html.anim .door[data-reveal].in{transform:none}
html.anim .svc[data-reveal],html.anim .case[data-reveal],html.anim .ref[data-reveal],html.anim .pain[data-reveal]{transform:translate3d(0,44px,0) scale(.985)}
html.anim .svc[data-reveal].in,html.anim .case[data-reveal].in,html.anim .ref[data-reveal].in,html.anim .pain[data-reveal].in{transform:none}

/* ═════════ strona główna: podróż wzdłuż helisy ═════════
   Bez skryptu i przy ograniczonym ruchu bloki leżą jeden pod drugim.
   Ze skryptem scena jest przypięta do ekranu, a bloki wiszą na helisie w przestrzeni 3D. */
.journey{position:relative}
.journey__stage{display:grid;gap:var(--s4);max-width:calc(700px + 2 * var(--gutter));margin-inline:auto;padding:clamp(34px,6vw,89px) var(--gutter)}
.jcard{position:relative;display:block;color:var(--white);text-decoration:none;padding:clamp(21px,2.4vw,34px);
  background:linear-gradient(150deg,rgba(40,42,47,.9),rgba(8,8,10,.94) 70%);border:1px solid rgba(197,201,207,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 30px 60px -30px #000}
.jcard > * + *{margin-top:13px}
.jcard h2{font-size:clamp(1.65rem,1.15rem + 1.4vw,2.45rem)}
.jcard h3{font-size:clamp(1.35rem,1.1rem + .8vw,1.75rem)}
.jcard p{color:var(--silver)}
.jcard .lead{font-size:clamp(1.02rem,.95rem + .3vw,1.16rem);max-width:none}
.jcard .muted{font-size:var(--t-sm)}
.jcard .closing{margin-top:0;font-size:clamp(1.35rem,1.1rem + .8vw,1.8rem);color:var(--white)}
.jcard .tools{margin-top:var(--s3)}
.jcard .tools li{color:var(--silver)}
.jcard--gold{border-color:rgba(212,175,55,.6)}
.jcard__tag{font-size:var(--t-sm);font-weight:600;letter-spacing:.02em}
p.jcard__tag{color:var(--gold)}
p.jcard__big{font-family:var(--f-display);font-size:clamp(1.3rem,1.1rem + .7vw,1.65rem);line-height:1.25;color:var(--white)}
.jcard[data-href],a.jcard{cursor:pointer}
.jcard[data-href] > h3,a.jcard > h3{padding-right:55px}
.jgo{position:absolute;right:18px;top:18px;margin:0;width:38px;height:38px;border:1px solid rgba(197,201,207,.45);border-radius:50%;display:grid;place-items:center;color:var(--silver);transition:background-color .35s,color .35s,border-color .35s,transform .45s var(--ease)}
.jgo svg{width:16px;height:16px}
.jcard:hover .jgo,.jgo:focus-visible{background:var(--gold);border-color:var(--gold);color:var(--ink);transform:rotate(-45deg)}
.jcard .step__n{margin-bottom:0;color:var(--gold)}
.jcard--step{padding-top:21px}
.jcard .door__for{color:var(--silver-dim);margin-bottom:5px}
.jcard--chart .bar{grid-template-columns:1fr;gap:5px}
.jcard--chart .bars{gap:13px}
.jcard--chart .bar__who b{font-size:1.12rem}
.jcard--chart .bar__track{height:26px}
.jcard--chart .bar__fill{width:calc(var(--v) / 4.7 * 70%)}
.jcard--chart .bar__val{font-size:1.2rem}
.jcard--chart .axis{grid-template-columns:1fr;margin-top:8px}
.jcard--chart .axis > :first-child{display:none}
.jcard--chart .chart-note{margin-top:var(--s3);font-size:var(--t-xs)}
.jcard--quote .quote{font-size:clamp(1.4rem,1.1rem + 1vw,1.95rem)}
.jcard--quote .quote__by{margin-top:var(--s3)}
.jcard--wide{background:none;border:0;box-shadow:none;padding:0;min-height:0;border-block:0;display:block;margin-inline:calc(-1 * var(--gutter));overflow:hidden}
.jcard--wide .marquee__track{font-size:clamp(3rem,1rem + 8vw,8rem)}
.rail{display:none}

/* scena 3D */
.j3d .journey__stage{position:fixed;inset:0;z-index:2;display:block;max-width:none;margin:0;padding:0;overflow:hidden;pointer-events:none;
  perspective:1100px;perspective-origin:var(--axis,50%) 50%}
.j3d .jcard{position:absolute;top:50%;left:var(--axis,50%);width:var(--cw,460px);margin:0;visibility:hidden;opacity:0;
  transform-origin:0 50%;will-change:transform,opacity;backface-visibility:hidden;transition:border-color .4s,box-shadow .4s,background-color .4s}
.j3d .jcard--l{left:auto;right:calc(100% - var(--axis,50%));transform-origin:100% 50%}
.j3d .jcard--wide{left:0;width:100%;margin:0;transform-origin:var(--axis,50%) 50%;overflow:visible}
.j3d .jcard.is-near{visibility:visible;pointer-events:auto}
.j3d .jcard.is-focus{border-color:rgba(238,240,243,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 34px 70px -30px #000,0 0 55px -24px rgba(197,201,207,.4)}
.j3d .jcard--gold.is-focus,.j3d .jcard--step.is-focus{border-color:var(--gold);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 34px 70px -30px #000,0 0 55px -22px rgba(212,175,55,.55)}
.j3d .jcard:not(.is-focus):not(.jcard--wide){cursor:pointer}
.j3d .jcard--wide.is-focus{box-shadow:none}
/* krawędź bloku od strony helisy: złoty zaczep */
.j3d .jcard:not(.jcard--wide)::before{content:"";display:block;position:absolute;top:50%;left:-1px;width:3px;height:34px;margin-top:-17px;background:var(--gold);opacity:0;transform:none;transition:opacity .4s}
.j3d .jcard--l:not(.jcard--wide)::before{left:auto;right:-1px}
.j3d .jcard.is-focus::before{opacity:1}
html.anim .j3d .is-split .w{opacity:1;filter:none;transform:none}
html.anim .j3d .bar__fill{--g:1}

.spine .contact:not(.page-hero){text-align:center;padding-top:clamp(178px,24vw,300px)}
.spine .contact:not(.page-hero) .sec-head{align-items:center;margin-inline:auto;max-width:44rem}
.spine .contact:not(.page-hero) .contact__lbl{justify-content:center}
.spine .contact:not(.page-hero) .contact__lbl::before{display:none}
.spine .contact:not(.page-hero) .contact__rows{justify-items:center}

@media (min-width:1000px){
  .rail{display:flex;flex-direction:column;gap:13px;position:fixed;right:clamp(13px,1.6vw,26px);top:50%;transform:translateY(-50%);z-index:60}
  .rail button{width:9px;height:9px;padding:0;border-radius:50%;border:1px solid rgba(197,201,207,.5);background:transparent;cursor:pointer;position:relative;transition:background-color .3s,border-color .3s,transform .3s}
  .rail button::before{content:"";position:absolute;inset:-8px}
  .rail button.past{background:rgba(197,201,207,.5)}
  .rail button.on{background:var(--gold);border-color:var(--gold);transform:scale(1.5);box-shadow:0 0 0 5px rgba(212,175,55,.16)}
  .rail button:hover{border-color:var(--white);background:var(--white)}
  .home .figures{background:rgba(0,0,0,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:0 var(--s3) var(--s3);margin-inline:calc(-1 * var(--s3));border-bottom:1px solid rgba(197,201,207,.12)}
}
@media (max-width:999px){
  .j3d .jcard{padding:18px 18px 21px;background:linear-gradient(150deg,#292b30,#09090b 72%)}
  .j3d .jcard--wide{background:none}
  .j3d .jcard h2{font-size:1.5rem}
  .j3d .jcard h3{font-size:1.25rem}
  .j3d .jcard p{font-size:var(--t-sm);line-height:1.5}
  .j3d .jcard .lead{font-size:1rem}
  .j3d .jcard .closing{font-size:1.25rem}
  .j3d .jcard--quote .quote{font-size:1.25rem}
  .j3d .jcard .btn{min-height:44px;padding:10px 16px}
  .j3d .jcard--chart .bar__track{height:20px}
  .j3d .jcard--chart .bars{gap:8px}
  .j3d .jcard--chart .bar__who{font-size:var(--t-xs)}
  .j3d .jcard--chart .bar__who b{font-size:1rem}
}


/* ═════════ bloki na podstronach: ta sama scena, gęstsza treść ═════════ */
.jcard[hidden]{display:none}
.jcard.svc,.jcard.course,.jcard.case,.jcard.ref,.jcard.item{display:block;padding:clamp(21px,2.4vw,34px);border:1px solid rgba(197,201,207,.2);gap:0}
.jcard.item::before{display:none}
.jcard.item--gold{border-color:rgba(197,201,207,.2)}
.jcard > div + div,.jcard > div > * + *{margin-top:13px}
.jcard .svc__body,.jcard .course__body{display:block}
.jcard .svc__body > * + *,.jcard .course__body > * + *{margin-top:13px}
.jcard.svc h3,.jcard.course h3,.jcard.case h3{font-size:clamp(1.35rem,1.1rem + .8vw,1.75rem);transform:none!important}
.jcard .svc__when{margin-top:6px;max-width:none;color:var(--silver-dim)}
.jcard .ticks li{font-size:var(--t-sm);line-height:1.45;padding-left:24px}
.jcard .ticks li + li{margin-top:5px}
.jcard .ticks li::before{width:13px}
.jcard .sub{margin-bottom:6px;color:var(--white)}
.jcard p{font-size:var(--t-sm);line-height:1.55}
.jcard p.lead{font-size:clamp(1.02rem,.95rem + .3vw,1.16rem);line-height:1.5}
.jcard .dl{grid-template-columns:minmax(0,6.5rem) minmax(0,1fr);gap:4px 13px;font-size:var(--t-xs)}
.jcard .course__cat{margin-bottom:5px}
.jcard .course__meta{margin-top:13px}
.jcard .step__out{margin-top:10px;color:var(--white)}
.jcard .case__n{font-size:clamp(2.3rem,1.6rem + 2.2vw,3.5rem)}
.jcard .case__where{margin-top:6px;color:var(--silver-dim)}
.jcard.ref h3{font-size:clamp(1.2rem,1.05rem + .5vw,1.45rem)}
.jcard--row .when,.jcard--row .yr{display:block;font-size:var(--t-sm);color:var(--gold);font-weight:600;font-family:var(--f-text)}
.jcard--row .yr{font-family:var(--f-display);font-weight:400;font-size:1.1rem}
.jcard--row b{display:block;font-weight:650;font-size:1.05rem;color:var(--white)}
.jcard--row span span,.jcard--row div span{color:var(--silver);font-size:var(--t-sm)}
.jcard--row > div{margin-top:5px}
.jcard--rating .rating{margin-bottom:8px}
.jcard--rating .rating__n{font-size:clamp(3.6rem,2.4rem + 4vw,5.6rem)}
.jcard--rating .rating__of{font-size:clamp(1.3rem,1rem + 1vw,1.9rem)}
.jcard--rating h2{font-size:clamp(1.3rem,1.1rem + .7vw,1.6rem)!important}
.jcard--fig .figure__n{font-size:clamp(2.2rem,1.6rem + 2vw,3.2rem)}
.jcard .books li{padding-block:9px}
.jcard .books b{font-size:1.05rem}
.jcard .filters{margin:var(--s3) 0 0}
.jcard .chip{padding:9px 14px}
.jcard .prose p + p,.jcard p + p{margin-top:.8em}
.jcard.opinion blockquote{font-size:clamp(1.15rem,1rem + .6vw,1.45rem)}
.rail{display:none}
@media (min-width:1000px){
  .rail{display:flex}
  /* tekst nagłówka podstrony po lewej, helisa pośrodku */
  .spine .page-hero:not(.contact) h1{max-width:calc(50% - 170px);font-size:clamp(2.2rem,1.2rem + 2.6vw,3.6rem)}
  .spine .page-hero:not(.contact) .lead{max-width:calc(50% - 170px)}
  .spine .page-hero{min-height:min(70vh,640px)}
}