/* =====================================================================
   STYL STRONY – Michał Rzekiecki
   KOLORY: edytuj bloki :root (zaraz pod sekcją CZCIONKI; opis w docs/KOLORY.md).
   Paleta domyślna = limonka. Warianty: data-acc="magenta" i "cyan".
   ===================================================================== */
/* ===== CZCIONKI (lokalne, licencja SIL OFL; pliki w public/fonts/) ===== */
@font-face{font-family:'Barlow Condensed';font-style:italic;font-weight:800;font-display:swap;src:url(../fonts/barlow-condensed-latin-ext-800-italic.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow Condensed';font-style:italic;font-weight:800;font-display:swap;src:url(../fonts/barlow-condensed-latin-800-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:italic;font-weight:900;font-display:swap;src:url(../fonts/barlow-condensed-latin-ext-900-italic.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Barlow Condensed';font-style:italic;font-weight:900;font-display:swap;src:url(../fonts/barlow-condensed-latin-900-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--bg:#05070a;--ink:#e9edf2;--mut:#98a2ad;--line:rgba(255,255,255,.1);--glass:rgba(255,255,255,.045);--a:#c6ff3d;--b:#6dff9a;--on:#0a1200;color-scheme:dark;background:var(--bg);box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
:root[data-acc=magenta]{--a:#ff3cac;--b:#7b5cff;--on:#1a0010}
:root[data-acc=cyan]{--a:#19e3ff;--b:#3a7bff;--on:#00141a}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
body{margin:0;color:var(--ink);font:400 17px/1.65 Inter,system-ui,sans-serif;overflow-x:hidden;background:radial-gradient(60% 35% at 85% 0,color-mix(in srgb,var(--a) 15%,transparent),transparent),radial-gradient(50% 30% at 0 45%,color-mix(in srgb,var(--b) 12%,transparent),transparent),var(--bg)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--bg);z-index:40}
p{margin:0}
h1,h2,h3{font-family:"Barlow Condensed","Arial Narrow",Impact,sans-serif;font-style:italic;font-weight:900;text-transform:uppercase;line-height:.95;margin:0;letter-spacing:.005em}
h1{font-size:clamp(44px,7.4vw,92px)}
h2{font-size:clamp(36px,5.4vw,64px);margin-bottom:40px}
em{font-style:inherit;background:linear-gradient(100deg,var(--a),var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}
.w{max-width:1140px;margin:0 auto;padding:0 24px}
section{padding:100px 0;position:relative}
:focus-visible{outline:3px solid var(--a);outline-offset:3px}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:rgba(5,7,10,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--a),var(--b));transform:scaleX(var(--sp,0));transform-origin:left}
nav{display:flex;justify-content:space-between;align-items:center;height:68px}
.logo{font:italic 900 26px "Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.02em}
.logo b{color:var(--a)}
.nl{display:flex;gap:28px;align-items:center;font-size:14px;color:var(--mut)}

.btn{display:inline-block;background:linear-gradient(110deg,var(--a),var(--b));color:var(--on);border:0;border-radius:999px;padding:17px 34px;font:600 17px Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 0 0 1px rgba(255,255,255,.2) inset,0 12px 40px -8px color-mix(in srgb,var(--a) 65%,transparent);transition:box-shadow .3s,transform .15s}
.btn:hover{box-shadow:0 0 0 1px rgba(255,255,255,.3) inset,0 16px 56px -6px color-mix(in srgb,var(--a) 85%,transparent)}
.btn.s{padding:10px 22px;font-size:14px}
.ghost{background:none;border:1px solid var(--line);color:var(--ink);box-shadow:none}
.ghost:hover{border-color:var(--a);box-shadow:none}
.pill{display:inline-block;border:1px solid color-mix(in srgb,var(--a) 50%,transparent);color:var(--a);border-radius:999px;padding:5px 16px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:26px}
.hero{padding:72px 0 80px;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(var(--line) 1px,transparent 1px) 0 0/56px 56px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/56px 56px;-webkit-mask:radial-gradient(60% 70% at 70% 40%,#000,transparent);mask:radial-gradient(60% 70% at 70% 40%,#000,transparent);opacity:.7}
.g2{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;position:relative}
.ln{display:block;opacity:0;transform:translateY(40px);animation:up .9s cubic-bezier(.2,.8,.2,1) forwards}
.ln:nth-child(2){animation-delay:.18s}
@keyframes up{to{opacity:1;transform:none}}
.sub{font-size:19px;color:var(--mut);max-width:520px;margin:26px 0 34px}
.row{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.sm{font-size:14px;color:var(--mut);margin-top:16px}
.vis{position:relative;max-width:420px;margin:0 auto;width:100%}
.tilt{transition:transform .25s ease-out}
.vis svg.f{width:100%;height:auto;filter:drop-shadow(0 0 12px color-mix(in srgb,var(--a) 55%,transparent))}
.j{fill:var(--bg);stroke:var(--a);stroke-width:2;animation:pl 2.4s ease-in-out infinite}
@keyframes pl{50%{r:7;opacity:.6}}
.scan{animation:sc 4.2s linear infinite}
@keyframes sc{from{transform:translateY(-50px)}to{transform:translateY(450px)}}
.gl{position:relative;background:var(--glass);border:1px solid var(--line);border-radius:22px;padding:26px;overflow:hidden;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.gl::before{content:"";position:absolute;inset:0;background:radial-gradient(260px circle at var(--x,50%) var(--y,0),color-mix(in srgb,var(--a) 22%,transparent),transparent 70%);opacity:0;transition:opacity .3s;pointer-events:none}
.gl:hover::before{opacity:1}
.hud{position:absolute;padding:14px 18px;border-radius:16px;font-size:13px;color:var(--mut);display:flex;gap:14px;align-items:center;z-index:2;animation:fl 6s ease-in-out infinite}
.hud b{display:block;font:italic 900 34px/1 "Barlow Condensed",Impact,sans-serif;color:var(--ink)}
.hud i{display:block;height:4px;border-radius:4px;background:var(--line);margin-top:8px;overflow:hidden}
.hud i::after{content:"";display:block;height:100%;width:0;background:linear-gradient(90deg,var(--a),var(--b));transition:width 1.6s .3s}
.in .hud i::after{width:82%}
.c1{left:-8%;top:12%}.c2{right:-6%;bottom:10%;animation-delay:-3s}
@keyframes fl{50%{transform:translateY(-10px)}}
.rg{transition:stroke-dashoffset 1.8s .3s}
.in .rg{stroke-dashoffset:46}
.ex{position:absolute;bottom:-4px;left:0;right:0;text-align:center;font-size:11px;color:var(--mut);letter-spacing:.08em}
.mq{overflow:hidden;border-block:1px solid var(--line);background:rgba(255,255,255,.02);padding:18px 0}
.mq div{display:flex;width:max-content;gap:48px;animation:mq 28s linear infinite;font:italic 900 34px "Barlow Condensed",Impact,sans-serif;text-transform:uppercase;white-space:nowrap}
.mq span:nth-child(even){color:var(--a)}
@keyframes mq{to{transform:translateX(-50%)}}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cards svg{width:34px;height:34px;stroke:var(--a);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-bottom:18px}
.q{font:italic 800 clamp(26px,3.6vw,42px)/1.1 "Barlow Condensed",Impact,sans-serif;text-transform:uppercase;max-width:820px;margin:64px auto 0;text-align:center}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;position:relative;padding-top:8px}
.steps::before,.steps::after{content:"";position:absolute;left:0;right:0;top:58px;height:2px;background:var(--line)}
.steps::after{background:linear-gradient(90deg,var(--a),var(--b));transform:scaleX(var(--p,0));transform-origin:left;box-shadow:0 0 14px var(--a)}
.num{display:block;font:italic 900 84px/1 "Barlow Condensed",Impact,sans-serif;color:transparent;-webkit-text-stroke:1.5px var(--a);margin-bottom:34px}
.step h3{font-size:34px;margin-bottom:10px}
.step p{color:var(--mut)}
.pn{font:italic 800 clamp(24px,3vw,34px) "Barlow Condensed",Impact,sans-serif;text-transform:uppercase;text-align:center;margin-top:56px}
ul.chk{list-style:none;padding:0;margin:0}
ul.chk li{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
ul.chk li:last-child{border:0}
ul.chk li::before{content:"✓";flex:none;width:26px;height:26px;border-radius:50%;background:linear-gradient(110deg,var(--a),var(--b));color:var(--on);display:grid;place-items:center;font-size:14px;font-weight:700;margin-top:2px}
.g3{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.g3 h3{font-size:38px;margin-bottom:20px}
.photo{aspect-ratio:16/10;border-radius:16px;margin-bottom:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--a) 22%,#0b1014),#0b1014 70%);border:1px solid var(--line);display:grid;place-items:center;color:var(--mut);font-size:13px}
.bd{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}
.bd span{border:1px solid var(--line);border-radius:999px;padding:5px 14px;font-size:13px}
.note{font-size:13px;color:var(--mut)}
details{border-bottom:1px solid var(--line);max-width:780px;margin:0 auto}
summary{cursor:pointer;padding:22px 0;font:italic 800 26px "Barlow Condensed",Impact,sans-serif;text-transform:uppercase;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::after{content:"+";color:var(--a);font-size:30px;line-height:1;transition:transform .3s}
details[open] summary::after{transform:rotate(45deg)}
details p{padding-bottom:22px;color:var(--mut)}
.cta{text-align:center;padding:90px 0 110px}
.cb{padding:80px 28px;border-radius:32px;background:radial-gradient(70% 90% at 50% 100%,color-mix(in srgb,var(--a) 28%,transparent),transparent),var(--glass);border:1px solid color-mix(in srgb,var(--a) 40%,transparent);box-shadow:0 0 90px -30px var(--a)}
.cb h2{max-width:860px;margin:0 auto 22px}
.cb .sub{margin:0 auto 34px;max-width:560px}
footer{border-top:1px solid var(--line);padding:34px 0;font-size:14px;color:var(--mut)}
footer .w{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px}
dialog{border:1px solid var(--line);border-radius:26px;padding:32px;max-width:480px;width:calc(100% - 32px);background:#0b1014;color:var(--ink);box-shadow:0 0 80px -20px var(--a)}
dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(4px)}
dialog h3{font-size:36px;margin-bottom:12px}
.x{position:absolute;top:14px;right:18px;background:none;border:0;font-size:28px;color:var(--mut);cursor:pointer}
label{display:block;font-size:13px;color:var(--mut);margin:14px 0 6px}
input[type=text],textarea{width:100%;background:rgba(255,255,255,.05);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:12px 14px;font:inherit;font-size:16px}
textarea{min-height:88px;resize:vertical}
.tm{display:flex;gap:8px;flex-wrap:wrap}
.tm label{margin:0;display:inline-flex;gap:6px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:6px 14px;color:var(--ink);cursor:pointer}
.cons{display:flex;gap:10px;align-items:flex-start;font-size:13px;margin:18px 0}
.cons input{margin-top:4px}
dialog .btn{width:100%;margin-top:4px}
.dock{position:fixed;left:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:25;display:flex;gap:8px;padding:8px 10px;background:rgba(5,7,10,.8);backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:999px}
.dock button{width:22px;height:22px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}
.dock button[aria-pressed=true]{border-color:#fff}
#fl{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:25;display:flex;align-items:center;background:#0b1014;border:1px solid color-mix(in srgb,var(--a) 50%,transparent);border-radius:999px;opacity:0;pointer-events:none;transform:translateY(12px);transition:.3s;box-shadow:0 0 30px -8px var(--a)}
#fl.on{opacity:1;pointer-events:auto;transform:none}
#fl button{background:none;border:0;color:var(--ink);cursor:pointer;font:500 15px Inter,system-ui,sans-serif}
#fl .fo{padding:12px 8px 12px 20px}#fl .fx{padding:12px 16px 12px 6px;font-size:18px}
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease;transition-delay:var(--d,0s)}
.js .rv.in{opacity:1;transform:none}
.map{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:center}
.map svg{width:100%;max-width:300px;margin:0 auto;display:block;overflow:visible}
.hs{cursor:pointer;outline:none}
.hs .c{fill:var(--a);transform-box:fill-box;transform-origin:center;transition:transform .25s}
.hs .r{fill:none;stroke:var(--a);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:ping 2.4s ease-out infinite}
@keyframes ping{from{transform:scale(.6);opacity:.9}to{transform:scale(2.4);opacity:0}}
.hs:hover .c,.hs:focus-visible .c,.hs.on .c{transform:scale(1.7);filter:drop-shadow(0 0 8px var(--a))}
.hs.on .c{fill:#fff}
.mp{min-height:270px}.mp h3{font-size:46px;margin-bottom:14px}.mp p{color:var(--mut);margin-bottom:10px}.mp b{color:var(--ink);font-weight:600}.mp .btn{margin:12px 0 6px}.mp small{display:block;color:var(--mut);font-size:12px;margin-top:14px}
.sp{position:fixed;left:14px;top:50%;transform:translateY(-50%);z-index:5;display:flex;flex-direction:column;gap:7px;pointer-events:none}
.sp i{display:block;width:10px;height:14px;border-radius:5px;background:var(--line);transition:background .3s,box-shadow .3s}
.sp i.on{background:var(--a);box-shadow:0 0 10px var(--a)}
@media (max-width:1100px){.sp{display:none}}
.view[hidden]{display:none}
.lnk{background:none;border:0;color:var(--a);font:500 15px Inter,system-ui,sans-serif;cursor:pointer;padding:6px 0;text-decoration:underline;text-underline-offset:4px}
.cards.two{grid-template-columns:repeat(2,1fr)}
.card2{text-align:left;color:var(--ink);font:inherit;cursor:pointer;padding:34px;display:block;width:100%}
.card2 .tag{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--a)}
.card2 h3{font-size:46px;margin:12px 0}.card2 p{color:var(--mut)}.card2 .arr{display:inline-block;margin-top:18px;color:var(--a);font-weight:600}
.chip{border:1px solid var(--line);border-radius:999px;padding:11px 22px;background:var(--glass);color:var(--ink);cursor:pointer;font:500 16px Inter,system-ui,sans-serif;transition:.2s}
.chip:hover{border-color:var(--a)}.chip[aria-pressed=true]{background:linear-gradient(110deg,var(--a),var(--b));color:var(--on);border-color:transparent}
.btn:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}
.fnd{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center;margin-top:40px}.fnd svg{width:100%;max-width:440px;margin:0 auto;display:block}
.fq{min-height:360px}.fq h3{font-size:42px;margin:6px 0 18px}.fq p{color:var(--mut);margin-bottom:16px}.opts{display:flex;flex-wrap:wrap;gap:10px}.fq .opts{flex-direction:column}.fq .chip{text-align:left;padding:14px 20px;font-size:17px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}.ln,.js .rv{opacity:1;transform:none}}
@media (max-width:860px){section{padding:68px 0}.g2,.g3,.cards,.cards.two,.steps,.map,.fnd{grid-template-columns:1fr}.steps::before,.steps::after{display:none}.burger{display:block}.nl{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:4px;padding:16px 24px 24px;background:rgba(5,7,10,.97);border-bottom:1px solid var(--line)}.nl.open{display:flex}.mega{position:static;grid-template-columns:1fr;padding:12px 0 0;border:0;background:none}.c1{left:0}.c2{right:0}.cb{padding:56px 20px}.hero{padding-top:44px}}

/* ===== NAWIGACJA ===== */
.nl a,.nl .ddb{color:inherit;text-decoration:none;font:inherit;padding:6px;background:none;border:0;cursor:pointer}
.nl a:hover,.nl .ddb:hover,.nl .ddb[aria-expanded=true]{color:var(--ink)}
.burger{display:none;background:none;border:1px solid var(--line);border-radius:10px;color:var(--ink);font-size:20px;padding:6px 12px;cursor:pointer}
.mega{position:absolute;left:0;right:0;top:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:24px max(24px,calc((100% - 1092px)/2));background:rgba(5,7,10,.96);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.mega[hidden]{display:none}
.mega a{display:block;padding:20px;border:1px solid var(--line);border-radius:16px;color:var(--ink)!important;transition:border-color .2s,background .2s}
.mega a:hover{border-color:var(--a);background:var(--glass)}
.mega b{display:block;font:italic 900 26px/1 "Barlow Condensed",Impact,sans-serif;text-transform:uppercase;margin-bottom:8px}
.mega span{display:block;font-size:14px;color:var(--mut);line-height:1.5}
.bc{font-size:13px;color:var(--mut);margin-bottom:22px}.bc a{color:var(--mut)}
.page h1{font-size:clamp(44px,7vw,84px)}
footer a{color:var(--a);text-decoration:underline;text-underline-offset:4px}
.card2{text-decoration:none}
nav.bc{display:block;height:auto;justify-content:flex-start}
.page{padding-top:56px}
.logo{display:inline-flex;flex-direction:column;align-items:flex-start;line-height:1}
.logo span{width:max-content}
.logo small{display:block;width:max-content;font:italic 800 10px/1 "Barlow Condensed","Arial Narrow",sans-serif;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap;text-align:justify;text-align-last:justify;color:var(--mut);margin-top:6px}
header{background:none;backdrop-filter:none;-webkit-backdrop-filter:none}
header::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(5,7,10,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.mega{background:rgba(5,7,10,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:none}
@media (max-width:860px){.burger{display:block}.nl{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:4px;padding:16px 24px 24px;background:rgba(5,7,10,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.nl.open{display:flex}.mega{position:static;grid-template-columns:1fr;padding:12px 0 0;border:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}.page{padding-top:32px}}

/* ===== PASEK TV, PIERWSZY TRENING ===== */
.tv .w{display:flex;gap:10px 24px;align-items:center;justify-content:center;flex-wrap:wrap;padding-top:20px;padding-bottom:20px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.tv b{font:italic 900 28px/1 "Barlow Condensed",Impact,sans-serif;letter-spacing:.02em;color:var(--ink)}
.tv i{font-style:normal;color:var(--a)}
.ft{max-width:760px;margin:44px auto 0;text-align:center;color:var(--mut)}

/* ===== FAQ (ostatnia pozycja menu, wyszarzona) ===== */
.nl a.faq{color:var(--mut);opacity:.6}
.nl a.faq:hover{opacity:1;color:var(--ink)}
.faqlist details{margin:0;max-width:860px}

/* ===== ZDJĘCIA WTOPIONE W TŁO (gotowe pod zdjęcia Michała; na razie nieużywane) =====
   Użycie: <section class="ph-s"><img class="ph ph-r" src="../img/nazwa.webp" alt="" loading="lazy">…treść w .w…</section>
   .ph-r = zdjęcie przy prawej krawędzi, .ph-l = przy lewej. Brzegi zdjęcia płynnie przechodzą w tło strony. */
.ph-s{position:relative;overflow:hidden}
.ph-s>.w{position:relative;z-index:1}
.ph{position:absolute;top:0;bottom:0;height:100%;width:min(62%,760px);object-fit:cover;pointer-events:none;z-index:0;opacity:.6;filter:saturate(.9) contrast(1.05);
-webkit-mask-composite:source-in;mask-composite:intersect}
.ph-r{right:0;-webkit-mask-image:linear-gradient(to right,transparent,#000 45%),linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(to right,transparent,#000 45%),linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent)}
.ph-l{left:0;-webkit-mask-image:linear-gradient(to left,transparent,#000 45%),linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(to left,transparent,#000 45%),linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent)}
@media(max-width:760px){.ph{width:100%;opacity:.32}}

/* ===== OFERTA (0.01.1): cennik, ścieżki, okno z pytaniami ===== */
dialog{max-height:calc(100dvh - 24px);overflow:auto}
.chip[aria-selected=true],.chip[aria-checked=true]{background:linear-gradient(110deg,var(--a),var(--b));color:var(--on);border-color:transparent}
.ofh{display:flex;flex-wrap:wrap;align-items:flex-end;gap:6px 18px;margin:80px 0 30px;scroll-margin-top:96px}
.ofh h2{margin:0;font-size:clamp(30px,5vw,60px);min-width:0;overflow-wrap:anywhere}
.ofn{font:italic 900 clamp(54px,8vw,84px)/.85 "Barlow Condensed",Impact,sans-serif;color:transparent;-webkit-text-stroke:1.5px var(--a)}
.ofsub{color:var(--mut);max-width:640px;margin:-10px 0 28px}
.tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.tp[hidden]{display:none}
.ofi{color:var(--mut);max-width:680px;margin:14px 0 26px}
.pc{display:flex;flex-direction:column;gap:14px;padding:28px}
.pc .tag{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--a)}
.pc h3{font-size:30px;margin:0}
.pc p{color:var(--mut)}
.pc b.for{font-size:14px;color:var(--ink);font-weight:600}
.pc ul.chk li{padding:10px 0;font-size:16px}
.pc .btn{margin-top:auto;width:100%;text-align:center}
.pc.sel{border-color:var(--a);box-shadow:0 0 50px -24px var(--a)}
.seg{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 34px}
.selinfo{color:var(--mut);font-size:15px;margin:-10px 0 22px}
.selinfo b{color:var(--ink);font-weight:600}
.selinfo .lnk{font-size:15px;margin-left:6px}
.pk{position:relative;display:flex;flex-direction:column;gap:12px;padding:30px 28px;overflow:visible}
.pk.feat{border-color:color-mix(in srgb,var(--a) 70%,transparent);box-shadow:0 0 70px -28px var(--a)}
.rib{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(110deg,var(--a),var(--b));color:var(--on);font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:6px 16px;border-radius:999px;white-space:nowrap}
.pk h3{font-size:36px}
.pk .cnt{color:var(--mut)}
.pk .pr{display:flex;align-items:baseline;gap:8px}
.pk .pr b{font:italic 900 64px/1 "Barlow Condensed",Impact,sans-serif;letter-spacing:.005em}
.pk .pr span{color:var(--mut);font-size:15px}
.per{display:inline-block;align-self:flex-start;border:1px solid color-mix(in srgb,var(--a) 50%,transparent);color:var(--a);border-radius:999px;padding:6px 14px;font-size:14px;font-weight:600}
.per s{color:var(--mut);font-weight:400;margin-left:4px}
.sv{font-weight:600}
.tot{font-size:13px;color:var(--mut)}
.pk ul.chk li{padding:9px 0;font-size:15px}
.pk .btn{width:100%;text-align:center;margin-top:auto}
.ben{padding:26px}
.ben .bn{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid var(--a);color:var(--a);font:600 13px Inter,system-ui,sans-serif;margin-bottom:14px}
.ben h3{font-size:26px;margin-bottom:10px}
.ben p{color:var(--mut)}
.ben:last-child{grid-column:1/-1;border-color:color-mix(in srgb,var(--a) 45%,transparent)}
.ben:last-child p{color:var(--ink);max-width:70ch}
.qc{display:flex;flex-direction:column;gap:12px;padding:28px}
.qc h3{font-size:30px}
.qc p.d{color:var(--mut)}
.qc .btn{width:100%;text-align:center;margin-top:auto}
.rows{display:grid;margin:4px 0 8px}
.rowb{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;background:none;border:0;border-bottom:1px solid var(--line);color:var(--ink);font:inherit;padding:13px 0;cursor:pointer;text-align:left}
.rowb:last-child{border-bottom:0}
.rowb:hover b{color:var(--a)}
.rowb small{display:block;color:var(--mut);font-size:13px}
.rowb b{font-weight:600;white-space:nowrap}
.bigp{font:italic 900 52px/1 "Barlow Condensed",Impact,sans-serif}
.bigp small{font:400 15px Inter,system-ui,sans-serif;color:var(--mut);margin-left:6px}
.old{color:var(--mut);text-decoration:line-through;font-size:32px;margin-right:12px}
.promo{align-self:flex-start;background:linear-gradient(110deg,var(--a),var(--b));color:var(--on);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px}
.fine{font-size:12px;color:var(--mut)}
.lbl{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin:48px 0 18px}
.ofnote{font-size:13px;color:var(--mut);margin-top:22px}
#xsel{font-size:14px;color:var(--mut);border:1px solid color-mix(in srgb,var(--a) 40%,transparent);border-radius:14px;padding:10px 14px;margin:0 0 4px}
#xsel b{color:var(--ink);font-weight:600}
.xh{font:italic 800 24px/1 "Barlow Condensed",Impact,sans-serif;text-transform:uppercase;margin:24px 0 4px}
.xn{font-size:12px;color:var(--mut);margin-bottom:6px}
.xq{margin:14px 0 0}
.xq>span{display:block;font-size:13px;color:var(--mut);margin-bottom:6px}
.xq .opts{gap:8px}
.xq .chip{padding:8px 14px;font-size:14px}
select{width:100%;background:rgba(255,255,255,.05);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:12px 14px;font:inherit;font-size:16px}
select option{background:#0b1014;color:var(--ink)}
a.btn{text-decoration:none}

/* ===== 0.02.1: karty częstotliwości (wyraźniejsza hierarchia), stopka ===== */
.pk h3{font-size:34px}
.pk h3 small{font:500 15px Inter,system-ui,sans-serif;text-transform:none;letter-spacing:0;color:var(--mut);margin-left:4px}
.pk .cnt{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--a);margin:-4px 0 2px}
.pk .sv{font-weight:500;font-size:14px;color:color-mix(in srgb,var(--a) 42%,var(--mut))}
.pk .tot{font-size:12px}
.pk ul.chk li{color:var(--mut)}
.soc{margin-left:6px}
.soc a{display:inline-flex;vertical-align:middle;margin-left:12px;text-decoration:none;color:var(--mut)}
.soc a:hover{color:var(--a)}
.soc[hidden],.soc a[hidden],footer .fx[hidden]{display:none}
footer .fx{justify-content:center;margin-top:18px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;text-align:center}
footer .fx a{white-space:nowrap}

/* ===== 0.02.1: polityka prywatności ===== */
.pp h2{font-size:clamp(24px,3.4vw,34px);margin:46px 0 12px}
.pp p,.pp li{color:var(--mut);max-width:72ch}
.pp ul{padding-left:20px;margin:8px 0}
.pp li{margin:10px 0}
.pp b{color:var(--ink);font-weight:600}
.pp a{color:var(--a)}
.cons a{color:var(--a);text-underline-offset:3px}
@media (max-width:700px){footer{padding-bottom:92px}}
.pp p{margin:12px 0}

/* ===== TEST KIERUNKU: pytania o kontuzje (0.04.1) ===== */
.fq .h3s{font-size:clamp(30px,7vw,42px)}
.fq .chip[aria-checked=true]{background:linear-gradient(110deg,var(--a),var(--b));color:var(--on);border-color:transparent}
#fnote{margin-top:6px}#fnote .btn{margin-top:14px}
.fq a.lnk{color:var(--a)}

/* ===== ZŁOTE PROPORCJE (0.05.1) =====
   Ten blok nadpisuje wcześniejsze reguły. Wyłączenie: usuń go albo wróć do gałęzi backup/przed-0.05.1.
   φ = 1,618.
   1) Skala czcionek: 17 px × φ^(k/2) = 17 · 21,6 · 27,5 · 35 · 44,5 · 56,6 · 72 · 91,6  (H1 : H2 = φ).
   2) Interlinia tekstu = φ.
   3) Odstępy z ciągu Fibonacciego: 8 · 13 · 21 · 34 · 55 · 89.
   4) Kolumny „tekst : grafika" = 1,618 : 1 (hero, „dla Ciebie / o mnie”, mapa ciała, test kierunku).
   5) Wyjątki celowe: karty cenowe, ścieżki i kroki mają równe kolumny (uczciwe porównanie opcji);
      mikro-teksty 10–15 px (etykiety, przypisy) zostają bez zmian. */
:root{--phi:1.618;--f0:17px;--f1:21.6px;--f2:27.5px;--f3:35px;--f4:44.5px;--f5:56.6px;--f6:72px;--f7:91.6px;--s1:8px;--s2:13px;--s3:21px;--s4:34px;--s5:55px;--s6:89px}
body{line-height:1.618}
/* skala czcionek */
h1{font-size:clamp(var(--f4),7.4vw,var(--f7))}
h2{font-size:clamp(var(--f3),5.4vw,var(--f5));margin-bottom:var(--s4)}
.page h1{font-size:clamp(var(--f4),7vw,var(--f6))}
.sub{font-size:clamp(var(--f0),1.6vw,var(--f1))}
.card2 h3,.mp h3{font-size:var(--f4)}
.fq h3,.fq .h3s{font-size:clamp(var(--f3),4vw,var(--f4))}
.g3 h3,.step h3,dialog h3,.hud b,.mq div,.pk h3,.old{font-size:var(--f3)}
.mega b,.tv b,.pc h3,.qc h3,.ben h3,summary{font-size:var(--f2)}
.pn{font-size:clamp(var(--f1),3vw,var(--f3))}
.q{font-size:clamp(var(--f2),3.6vw,var(--f4))}
.num{font-size:var(--f6)}
.pk .pr b,.bigp{font-size:var(--f5)}
.xh{font-size:var(--f1)}
.ofh h2{font-size:clamp(var(--f2),5vw,var(--f5))}
.ofn{font-size:clamp(var(--f5),8vw,var(--f6))}
.pp h2{font-size:clamp(var(--f1),3.4vw,var(--f3))}
/* odstępy (Fibonacci) */
section{padding:var(--s6) 0}
.hero{padding:var(--s5) 0 var(--s6)}
.cta{padding:var(--s6) 0}
.page{padding-top:var(--s5)}
.ofh{margin:var(--s6) 0 var(--s4)}
.cards{gap:var(--s3)}
.steps{gap:var(--s4)}
.q{margin-top:var(--s5)}
.pn{margin-top:var(--s5)}
/* kolumny w proporcji φ : 1 */
.g2{grid-template-columns:1.618fr 1fr;gap:var(--s5)}
.g3{grid-template-columns:1fr 1.618fr;gap:var(--s3)}
.map{grid-template-columns:1fr 1.618fr;gap:var(--s4)}
.fnd{grid-template-columns:1fr 1.618fr;gap:var(--s4)}
/* pudełka: padding pionowy : poziomy = 1 : φ, zdjęcie 1,618 : 1 */
.cards>.gl.rv:not(.ben):not(.pc):not(.pk):not(.qc){padding:var(--s3) var(--s4)}
.hud{padding:var(--s2) var(--s3)}
.photo{aspect-ratio:1.618}
.btn{padding:var(--s3) var(--s4)}
.btn.s{padding:var(--s2) var(--s3)}
@media (max-width:860px){
  section{padding:var(--s5) 0}
  .hero{padding-top:var(--s4)}
  .page{padding-top:var(--s4)}
  .g2,.g3,.map,.fnd{grid-template-columns:1fr;gap:var(--s4)}
}
@media (max-width:560px){
  .cards>.gl.rv:not(.ben):not(.pc):not(.pk):not(.qc){padding:var(--s3)}
}

/* ===== MENU „TRENINGI”: szkło (0.05.3; 0.05.2 dotyczyło też paska, a od 0.05.3 pasek menu jest jak wcześniej) =====
   Szkło ma tylko rozwijane menu „Treningi” (na telefonie: trzy karty w otwartym menu). Pasek u góry zostaje bez zmian.
   Siła: --menu-tint = ile koloru akcentu dodać (10%; w 0.05.2 było 20%, za mocno zlewało się z paskiem), --menu-alpha = krycie (62%; było 72%).
   Wyróżnione słowa w opisach menu to zwykłe <em> (kolor akcentu, jak w nagłówkach). */
:root{--menu-tint:10%;--menu-alpha:62%;--glass-menu:color-mix(in srgb,color-mix(in srgb,var(--a) var(--menu-tint),#05070a) var(--menu-alpha),transparent)}
@media (min-width:861px){.mega{background:var(--glass-menu)}}
@media (max-width:860px){.mega a{background:var(--glass-menu)}}
.mega span em{font-weight:600}

/* ===== PRZYCISK WYSYŁANIA: pół-kolorowy, aż do potwierdzenia (0.05.4) =====
   Domyślnie (i podczas "Wysyłam…"): połowa w kolorze akcentu, połowa szara — sygnał "jeszcze nie gotowe".
   Po potwierdzonym zapisie w bazie: cały zielony/w kolorze akcentu + "Wysłano :)", chwilę widoczny, potem formularz chowa się jak dotąd. */
.btn.send{background:linear-gradient(90deg,var(--a) 0%,var(--a) 50%,var(--mut) 50%,var(--mut) 100%);color:var(--on);transition:background .35s ease}
.btn.send.ok{background:var(--a);box-shadow:0 0 0 1px rgba(255,255,255,.25) inset,0 16px 56px -6px color-mix(in srgb,var(--a) 85%,transparent)}
.btn.send.ok:disabled{opacity:1}