/* =============================================================
   FONTY — hostowane lokalnie (bez zależności od Google Fonts)
   ============================================================= */
@font-face{
  font-family:'DM Sans';font-style:normal;font-weight:700;font-display:swap;
  src:url('../fonts/dm-sans-latin-ext-700-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:'DM Sans';font-style:normal;font-weight:700;font-display:swap;
  src:url('../fonts/dm-sans-latin-700-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:300;font-display:swap;
  src:url('../fonts/inter-latin-ext-300-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:300;font-display:swap;
  src:url('../fonts/inter-latin-300-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: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;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;
  src:url('../fonts/inter-latin-ext-700-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:700;font-display:swap;
  src:url('../fonts/inter-latin-700-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;
}

/* =============================================================
   DOBRY TRENER — system wizualny
   Mateusz Dobrakowski · przygotowanie motoryczne
   ============================================================= */

:root{
  /* czerń warstwowa — nie jedno płaskie tło, tylko kilka poziomów */
  --ink:#0A0A0B;
  --ink2:#111114;
  --ink3:#191A1E;
  --ink4:#24252B;
  --line:rgba(255,255,255,.09);
  --line2:rgba(255,255,255,.16);
  --line-l:rgba(21,21,26,.14);   /* kreski na jasnym tle */
  --line2-l:rgba(21,21,26,.24);
  /* szklane warstwy na tle bazowym — sterują też motywami */
  --veil1:rgba(255,255,255,.03);
  --veil2:rgba(255,255,255,.05);
  --veil3:rgba(255,255,255,.07);
  --veil4:rgba(255,255,255,.28);
  --shadow:rgba(0,0,0,.45);
  --blur:8px;
  /* skladowe RGB — potrzebne do przezroczystych nakladek na zdjeciach */
  --scrim:10,10,11;       /* przyciemnienie zdjec */
  --o-rgb:232,97,42;
  --o-deep-rgb:140,53,18;
  --card:#fff;      /* karta wewnątrz jasnej sekcji */
  --on-o:#fff;      /* tekst na wypełnieniu akcentem */
  --o-fill:#E8612A; /* tło przycisków i plakietek wypełnionych akcentem */
  --veil-l:rgba(0,0,0,.04);   /* subtelne przyciemnienie na jasnym */

  /* jasna warstwa — sekcje, w których się dużo czyta */
  --bone:#F3F0EB;
  --bone2:#E6E1D8;
  --bone3:#D6D0C4;

  /* akcent */
  --o:#E8612A;
  --o2:#FF7B44;
  --o3:#FFA07A;
  --o-deep:#8C3512;
  --o-wash:rgba(var(--o-rgb),.12);

  /* tekst na ciemnym */
  --tx:#F1EEEA;
  --tx2:var(--tx2);
  --tx3:var(--tx3);
  /* tekst na jasnym */
  --lx:#15151A;
  --lx2:rgba(21,21,26,.74);
  --lx3:rgba(21,21,26,.66);

  --display:'DM Sans','Inter',system-ui,sans-serif;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;

  --pad:clamp(20px,5vw,72px);
  --gap:clamp(20px,3vw,40px);
  --max:1500px;
  --r:2px;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--ink);color:var(--tx);
  font-family:var(--sans);font-size:1.0625rem;line-height:1.75;font-weight:400;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--o);color:var(--on-o)}
:focus-visible{outline:2px solid var(--o2);outline-offset:3px}
section{position:relative}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--pad)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── TYPOGRAFIA ─────────────────────────────────────────── */
.d1,.d2,.d3{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:-.01em}
.d1{font-size:clamp(1.95rem,3.9vw,3.5rem);line-height:1.1}
.d2{font-size:clamp(1.6rem,2.8vw,2.5rem);line-height:1.14}
.d3{font-size:clamp(1.3rem,2vw,1.8rem);line-height:1.18}
.d1 em,.d2 em,.d3 em{font-style:normal;color:var(--o)}
.d1 .out,.d2 .out{
  color:transparent;-webkit-text-stroke:1.4px var(--tx);
}
.lede{font-size:clamp(1.05rem,1.45vw,1.3rem);line-height:1.62;color:var(--tx2);max-width:56ch;font-weight:300}
.body{color:var(--tx2);max-width:64ch}
.body strong{color:var(--tx);font-weight:600}
.tag{
  display:inline-flex;align-items:center;gap:9px;
  font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--o);
}
.tag::before{content:'';width:26px;height:1px;background:var(--o);flex-shrink:0}
.tag.plain::before{display:none}
.num{font-family:var(--display);font-weight:700;letter-spacing:0}

/* jasna sekcja */
.light{
  background:var(--bone);color:var(--lx);
  --tx:var(--lx);
  --tx2:var(--lx2);
  --tx3:var(--lx3);
  --line:var(--line-l);
  --line2:var(--line2-l);
  --veil1:rgba(21,21,26,.03);
  --veil2:rgba(21,21,26,.05);
  --veil3:rgba(21,21,26,.08);
  --veil4:rgba(21,21,26,.26);
  --ink:var(--bone);
  --ink2:var(--bone2);
  --ink3:var(--bone2);
  --ink4:var(--bone3);
  --o:var(--o-deep);
}
/* ciemne karty wewnatrz jasnej sekcji wracaja do jasnej typografii */
.light .prog.feat,
.light .steps.proc .step:first-child{
  --tx:var(--bone);
  --tx2:var(--bone2);
  --tx3:var(--bone3);
  --line:rgba(255,255,255,.14);
  --line2:rgba(255,255,255,.24);
  --o:var(--o2);
}
.light .lede,.light .body{color:var(--lx2)}
.light .body strong{color:var(--lx)}
.light .d1 .out,.light .d2 .out{-webkit-text-stroke-color:var(--lx)}
.light .tag{color:var(--o-deep)}
.light .tag::before{background:var(--o-deep)}

/* ── PRZYCISKI ──────────────────────────────────────────── */
.btn{
  appearance:none;-webkit-appearance:none;background:transparent;color:inherit;
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  font-family:var(--sans);font-size:.9rem;font-weight:600;letter-spacing:.02em;
  padding:17px 30px;border:1px solid transparent;border-radius:var(--r);
  text-decoration:none;cursor:pointer;transition:.22s cubic-bezier(.4,0,.2,1);
  position:relative;overflow:hidden;line-height:1.2;text-align:center;
}
.btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .22s}
.btn:hover svg{transform:translateX(4px)}
.btn-1{background:var(--o-fill);color:var(--on-o)}
.btn-1:hover{background:var(--o2)}
.btn-2{border-color:var(--line2);color:var(--tx)}
.btn-2:hover{border-color:var(--tx);background:var(--veil2)}
.light .btn-2{border-color:rgba(21,21,26,.24);color:var(--lx)}
.light .btn-2:hover{border-color:var(--lx);background:var(--veil-l)}
.btn-3{background:var(--lx);color:var(--bone)}
.btn-3:hover{background:#000}
.btn-lg{padding:20px 38px;font-size:.98rem}
.btn-full{width:100%}
.note{font-size:.86rem;line-height:1.6;color:var(--tx3);max-width:46ch}
.light .note{color:var(--lx3)}

.lnk{
  display:inline-flex;align-items:center;gap:8px;text-decoration:none;
  font-weight:600;font-size:.92rem;color:var(--o);
  border-bottom:1px solid transparent;transition:.2s;padding-bottom:2px;
}
.lnk:hover{border-bottom-color:var(--o)}
.lnk svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .2s}
.lnk:hover svg{transform:translateX(4px)}
.light .lnk{color:var(--o-deep)}
.light .lnk:hover{border-bottom-color:var(--o-deep)}

/* ── REVEAL ─────────────────────────────────────────────── */
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.rv.in{opacity:1;transform:none}
.rv-2{transition-delay:.08s}.rv-3{transition-delay:.16s}.rv-4{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1!important;transform:none!important;transition:none}
  html{scroll-behavior:auto}
  .mq-track{animation:none!important}
}

/* ── NAWIGACJA ──────────────────────────────────────────── */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:900;
  display:flex;align-items:center;justify-content:space-between;
  gap:24px;padding:18px var(--pad);
  transition:background .3s,border-color .3s,padding .3s;
  border-bottom:1px solid transparent;
}
.nav.stuck{background:rgba(var(--scrim),.86);backdrop-filter:blur(14px) saturate(1.2);border-bottom-color:var(--line);padding-top:12px;padding-bottom:12px}
/* delikatny akcent u dolu paska po przewinieciu strony */
.nav::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,var(--o) 0%,rgba(var(--o-rgb),.55) 26%,rgba(var(--o-rgb),.12) 58%,transparent 88%);
  opacity:0;transform:scaleX(.35);transform-origin:left center;
  transition:opacity .45s ease,transform .55s cubic-bezier(.16,1,.3,1);
  pointer-events:none;
}
.nav.stuck::after{opacity:1;transform:scaleX(1)}
@media (prefers-reduced-motion:reduce){.nav::after{transition:opacity .2s;transform:none}}
.logo{font-family:var(--display);font-weight:700;font-size:1.1rem;letter-spacing:.02em;text-transform:uppercase;text-decoration:none;color:var(--tx);white-space:nowrap}
.logo i{color:var(--o);font-style:normal}
.nav-mid{display:flex;gap:30px;align-items:center}
.nav-mid a{font-size:.9rem;font-weight:500;text-decoration:none;color:var(--tx2);transition:color .2s}
.nav-mid a:hover,.nav-mid a[aria-current]{color:var(--tx)}
.nav-end{display:flex;align-items:center;gap:14px}
.burger{
  display:none;width:44px;height:44px;border:1px solid var(--line2);background:none;
  cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:5px;border-radius:var(--r);
}
.burger span{display:block;width:18px;height:1.5px;background:var(--tx);transition:.25s}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

.sheet{
  position:fixed;inset:0;z-index:890;background:var(--ink);
  padding:100px var(--pad) 40px;
  display:flex;flex-direction:column;justify-content:space-between;
  opacity:0;pointer-events:none;transform:translateY(-12px);
  transition:opacity .3s,transform .3s;overflow-y:auto;
}
.sheet.open{opacity:1;pointer-events:auto;transform:none}
.sheet-nav{display:flex;flex-direction:column}
.sheet-nav a{
  position:relative;
  font-family:var(--display);font-weight:700;font-size:clamp(1.05rem,3.4vw,1.35rem);
  text-transform:uppercase;letter-spacing:-.004em;line-height:1.3;
  text-decoration:none;color:var(--tx);padding:13px 0 13px 18px;border-bottom:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:center;
  transition:color .2s,padding-left .2s,background .2s;
}
/* akcent motywu — pionowa kreska przy kazdej pozycji, pelna dopiero po najechaniu */
.sheet-nav a::before{
  content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:2px;height:14px;background:var(--o);opacity:.34;
  transition:height .25s cubic-bezier(.16,1,.3,1),opacity .2s;
}
.sheet-nav a:hover,.sheet-nav a:focus-visible,.sheet-nav a:active{color:var(--o);padding-left:24px}
.sheet-nav a:hover::before,.sheet-nav a:focus-visible::before,.sheet-nav a:active::before{height:70%;opacity:1}
.sheet-nav a span{font-family:var(--sans);font-size:.72rem;font-weight:600;color:var(--o);opacity:.8;letter-spacing:.14em}
.sheet-foot{display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center;padding-top:28px;font-size:.9rem;color:var(--tx3)}
.sheet-foot a{color:var(--tx2);text-decoration:none}
.sheet-foot a:hover{color:var(--o)}

/* ── HERO ───────────────────────────────────────────────── */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:-2}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.hero-bg::after{
  content:'';position:absolute;inset:0;
  background:
    linear-gradient(to top,var(--ink) 1%,rgba(var(--scrim),.8) 30%,rgba(var(--scrim),.4) 62%,rgba(var(--scrim),.7) 100%),
    linear-gradient(to right,rgba(var(--scrim),.92) 0%,rgba(var(--scrim),.66) 38%,rgba(var(--scrim),.15) 74%,transparent 100%);
}
.hero-in{padding-bottom:clamp(30px,5vh,64px);padding-top:clamp(104px,14vh,132px);width:100%}
.hero h1{max-width:16ch;margin:18px 0 22px}
.hero .lede{max-width:46ch;color:var(--tx2);font-size:clamp(1rem,1.15vw,1.15rem)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;align-items:center}
.hero-note{margin-top:16px}
.hero-strip{
  border-top:1px solid var(--line);margin-top:clamp(26px,4vh,44px);
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,3vw,48px);
}
.hero-strip div{background:transparent;padding:18px 0 2px}
.hero-strip .k{font-family:var(--display);font-weight:700;font-size:clamp(1rem,1.35vw,1.25rem);line-height:1;color:var(--o);text-transform:uppercase}
.hero-strip .v{font-size:.86rem;color:var(--tx3);margin-top:7px;line-height:1.45;max-width:26ch}
.scrollcue{
  position:absolute;right:var(--pad);bottom:clamp(38px,6vh,80px);z-index:2;
  writing-mode:vertical-rl;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;
  text-shadow:0 1px 6px rgba(0,0,0,.55);
  color:var(--tx2);display:flex;align-items:center;gap:12px;
}
.scrollcue::after{content:'';width:1px;height:52px;background:linear-gradient(var(--o),transparent);animation:cue 2.2s ease-in-out infinite}
@keyframes cue{0%,100%{opacity:.25;transform:scaleY(.5);transform-origin:top}50%{opacity:1;transform:scaleY(1)}}

/* ── PASEK PRZEWIJANY ───────────────────────────────────── */
.mq{border-block:1px solid var(--line);overflow:hidden;padding:16px 0;background:var(--ink2)}
.mq-track{display:flex;gap:52px;width:max-content;animation:mq 34s linear infinite}
.mq:hover .mq-track{animation-play-state:paused}
  .mq span{
  font-family:var(--display);font-weight:700;font-size:.92rem;text-transform:uppercase;letter-spacing:.03em;
  color:var(--tx3);display:flex;align-items:center;gap:52px;white-space:nowrap;
}
.mq span::after{content:'';width:5px;height:5px;background:var(--o);transform:rotate(45deg)}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── SEKCJE ─────────────────────────────────────────────── */
.sec{padding-block:clamp(72px,10vh,140px)}
.sec-sm{padding-block:clamp(54px,7vh,96px)}
.head{max-width:74ch;margin-bottom:clamp(38px,5vh,66px)}
.head .d2{margin-top:18px}
.head .lede{margin-top:22px}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:clamp(34px,5vh,60px)}

/* ── KARTY DYSCYPLIN ────────────────────────────────────── */
.disc{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.dcard{
  position:relative;isolation:isolate;overflow:hidden;min-height:clamp(400px,52vh,560px);
  display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(26px,3vw,44px);
  text-decoration:none;color:var(--tx);border-radius:var(--r);
}
.dcard img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.dcard::after{
  content:'';position:absolute;inset:0;z-index:-1;transition:background .4s;
  background:linear-gradient(to top,rgba(var(--scrim),.94) 8%,rgba(var(--scrim),.55) 48%,rgba(var(--scrim),.18) 100%);
}
.dcard:hover img{transform:scale(1.045)}
.dcard:hover::after{background:linear-gradient(to top,rgba(var(--scrim),.95) 8%,rgba(var(--o-deep-rgb),.42) 60%,rgba(var(--scrim),.2) 100%)}
.dcard h3{font-family:var(--display);font-weight:700;font-size:clamp(1.45rem,2.5vw,2.2rem);text-transform:uppercase;line-height:1.18;letter-spacing:-.006em;margin-bottom:14px}
.dcard p{color:var(--tx2);font-size:1rem;line-height:1.6;max-width:42ch}
.dcard .pills{display:flex;flex-wrap:wrap;gap:7px;margin:20px 0 22px}
.pill{
  font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  padding:6px 12px;border:1px solid var(--veil4);border-radius:100px;color:var(--tx);
}
.dcard .go{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:.94rem;color:var(--o2)}
.dcard .go svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .25s}
.dcard:hover .go svg{transform:translateX(5px)}
.dcard.wide{grid-column:1/-1;min-height:0;flex-direction:row;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;background:var(--ink3);padding:32px clamp(26px,3vw,44px)}
.dcard.wide::after,.dcard.wide img{display:none}
.dcard.wide h3{font-size:clamp(1.3rem,2vw,1.8rem);margin:0}

/* ── PROCES ─────────────────────────────────────────────── */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-block:1px solid var(--line)}
.step{background:var(--ink);padding:clamp(26px,3vw,40px) clamp(20px,2vw,32px);position:relative;transition:background .3s}
.step:hover{background:var(--ink2)}
.step .n{font-family:var(--display);font-weight:700;font-size:.9rem;color:var(--o);letter-spacing:.1em;margin-bottom:clamp(24px,4vw,52px);display:block}
.step h3{font-family:var(--display);font-weight:700;font-size:clamp(1rem,1.35vw,1.2rem);text-transform:uppercase;line-height:1.3;letter-spacing:-.004em;margin-bottom:12px}
.step p{font-size:.95rem;line-height:1.65;color:var(--tx2)}

/* ── PROGRAMY (sekcja jasna) ────────────────────────────── */
.progs{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.prog{
  background:var(--card);border:1px solid var(--bone3);border-radius:var(--r);
  padding:clamp(28px,3vw,46px);display:flex;flex-direction:column;position:relative;overflow:hidden;
}
.prog.feat{background:var(--lx);border-color:var(--lx);color:var(--bone)}
.prog.feat .prog-price,.prog.feat h3{color:var(--bone)}
.prog.feat .prog-desc,.prog.feat li{color:rgba(243,240,235,.78)}
.prog.feat li strong{color:var(--bone)}
.prog.feat .prog-per{color:rgba(243,240,235,.55)}
.prog.feat hr{border-color:var(--line2)}
.prog-flag{position:absolute;top:0;right:0;background:var(--o-fill);color:var(--on-o);font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:8px 16px}
.prog .kicker{font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--o-deep);margin-bottom:12px}
.prog.feat .kicker{color:var(--o3)}
.prog h3{font-family:var(--display);font-weight:700;font-size:clamp(1.25rem,1.85vw,1.65rem);text-transform:uppercase;line-height:1.2;letter-spacing:-.004em;margin-bottom:20px;color:var(--lx)}
.prog-price{font-family:var(--display);font-weight:700;font-size:clamp(2.2rem,3.6vw,3rem);line-height:.9;color:var(--lx)}
.prog-price sup{font-family:var(--sans);font-size:.9rem;font-weight:600;vertical-align:super;margin-left:6px;letter-spacing:.02em}
.prog-per{font-size:.88rem;color:var(--lx3);margin:10px 0 22px}
.prog-desc{font-size:1rem;line-height:1.65;color:var(--lx2)}
.prog hr{border:none;border-top:1px solid var(--bone3);margin:24px 0}
.prog ul{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:30px;flex:1}
.prog li{position:relative;padding-left:26px;font-size:.96rem;line-height:1.55;color:var(--lx2)}
.prog li::before{
  content:'';position:absolute;left:0;top:.52em;width:12px;height:7px;
  border-left:1.8px solid var(--o);border-bottom:1.8px solid var(--o);transform:rotate(-45deg);
}
.prog li strong{color:var(--lx);font-weight:600}
.helper{
  grid-column:1/-1;background:var(--bone2);border-radius:var(--r);padding:clamp(24px,2.6vw,36px);
  display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;
}
.helper h3{font-family:var(--display);font-weight:700;font-size:clamp(1.08rem,1.5vw,1.35rem);text-transform:uppercase;color:var(--lx);line-height:1.3;letter-spacing:-.004em}
.helper p{font-size:.98rem;color:var(--lx2);max-width:60ch;margin-top:8px}

/* ── DWA WARIANTY OBOK (remote / plan) ──────────────────── */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.tile{
  border:1px solid var(--line);border-radius:var(--r);padding:clamp(26px,3vw,42px);
  display:flex;flex-direction:column;background:var(--ink2);position:relative;overflow:hidden;
}
.tile h3{font-family:var(--display);font-weight:700;font-size:clamp(1.2rem,1.7vw,1.55rem);text-transform:uppercase;line-height:1.24;letter-spacing:-.006em;margin:14px 0 16px}
.tile p{color:var(--tx2);font-size:1rem;line-height:1.65;margin-bottom:24px}
.tile .rows{display:flex;flex-direction:column;gap:1px;background:var(--line);margin-bottom:26px}
.tile .row{background:var(--ink3);padding:16px 20px;display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.tile .row b{font-weight:600;font-size:.98rem}
.tile .row i{font-style:normal;font-family:var(--display);font-weight:700;font-size:1.2rem;color:var(--o);white-space:nowrap}
.tile .row i small{font-family:var(--sans);font-size:.72rem;font-weight:500;color:var(--tx3);margin-right:6px}
.tile ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:26px;flex:1}
.tile ul li{position:relative;padding-left:24px;font-size:.95rem;color:var(--tx2);line-height:1.55}
.tile ul li::before{content:'';position:absolute;left:0;top:.55em;width:11px;height:6px;border-left:1.6px solid var(--o);border-bottom:1.6px solid var(--o);transform:rotate(-45deg)}
.tile ul li.no{color:var(--tx3)}
.tile ul li.no::before{border-color:var(--tx3);transform:none;height:0;border-left:none;border-bottom:1.6px solid var(--tx3);width:11px;top:.85em}
.tile .price{font-family:var(--display);font-weight:700;font-size:clamp(1.7rem,2.4vw,2.2rem);line-height:1;color:var(--o);margin-bottom:6px}
.tile .price small{font-family:var(--sans);font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);display:block;margin-bottom:8px}

/* ── ZAWODNICY ──────────────────────────────────────────── */
.ath{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.acard{
  position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r);
  aspect-ratio:3/4;display:flex;flex-direction:column;justify-content:flex-end;
  padding:24px;cursor:pointer;border:none;background:var(--ink3);text-align:left;color:var(--tx);
  font-family:inherit;width:100%;
}
.acard img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 18%;transition:transform .8s cubic-bezier(.16,1,.3,1),filter .4s;filter:saturate(.92)}
.acard::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(var(--scrim),.95) 6%,rgba(var(--scrim),.35) 52%,transparent 88%);transition:background .4s}
.acard:hover img{transform:scale(1.05);filter:saturate(1.05)}
.acard:hover::after{background:linear-gradient(to top,rgba(var(--scrim),.96) 6%,rgba(var(--o-deep-rgb),.36) 60%,transparent 92%)}
.acard .badge{
  position:absolute;top:16px;left:16px;z-index:1;background:rgba(var(--scrim),.72);
  backdrop-filter:blur(6px);border:1px solid var(--line2);
  font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:6px 11px;border-radius:100px;
}
.acard h3{font-family:var(--display);font-weight:700;font-size:clamp(1rem,1.3vw,1.18rem);text-transform:uppercase;line-height:1.28;letter-spacing:-.004em;margin-bottom:5px}
.acard .sport{font-size:.78rem;font-weight:500;color:var(--o2);letter-spacing:.04em}
.acard .more{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--tx2);margin-top:14px;opacity:0;transform:translateY(6px);transition:.3s}
.acard:hover .more,.acard:focus-visible .more{opacity:1;transform:none}
.acard .more svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}

/* panel zawodnika */
.panel{position:fixed;inset:0;z-index:1000;display:grid;grid-template-columns:minmax(0,42%) minmax(0,58%);opacity:0;pointer-events:none;transition:opacity .3s}
.panel.open{opacity:1;pointer-events:auto}
.panel-bg{position:fixed;inset:0;background:rgba(5,5,6,.9);backdrop-filter:blur(6px);z-index:-1}
.panel-img{position:relative;overflow:hidden;background:var(--ink3)}
.panel-img img{width:100%;height:100%;object-fit:cover;object-position:center 15%}
.panel-body{background:var(--ink2);padding:clamp(30px,4vw,64px);overflow-y:auto;display:flex;flex-direction:column;justify-content:center}
.panel-close{position:absolute;top:20px;right:20px;z-index:3;width:46px;height:46px;border:1px solid var(--line2);background:rgba(var(--scrim),.6);backdrop-filter:blur(6px);color:var(--tx);cursor:pointer;font-size:1.1rem;border-radius:100px;transition:.2s}
.panel-close:hover{background:var(--o-fill);border-color:var(--o-fill);color:var(--on-o)}
.panel-body h3{font-family:var(--display);font-weight:700;font-size:clamp(1.6rem,2.6vw,2.3rem);text-transform:uppercase;line-height:1.16;letter-spacing:-.008em;margin:14px 0 6px}
.panel-body .sport{font-size:.86rem;font-weight:600;color:var(--o2);letter-spacing:.08em;text-transform:uppercase;margin-bottom:26px}
.panel-body p{color:var(--tx2);line-height:1.75;margin-bottom:28px;max-width:56ch}
.panel-body p strong{color:var(--tx);font-weight:600}
.achs{display:flex;flex-direction:column;gap:1px;background:var(--line);margin-bottom:30px}
.ach{background:var(--ink3);padding:15px 18px 15px 36px;position:relative;font-size:.94rem;color:var(--tx2);line-height:1.6}
.ach b{color:var(--tx);font-weight:600}
.ach::before{content:'';position:absolute;left:17px;top:1.05em;width:6px;height:6px;background:var(--o);transform:rotate(45deg)}
.panel-tabs{display:flex;gap:8px;flex-wrap:wrap}
.panel-tabs button{
  padding:10px 16px;border:1px solid var(--line);background:none;color:var(--tx3);
  font-family:inherit;font-size:.84rem;font-weight:500;cursor:pointer;border-radius:100px;transition:.2s;
}
.panel-tabs button:hover{border-color:var(--o);color:var(--o)}
.panel-tabs button.on{background:var(--o-fill);border-color:var(--o-fill);color:var(--on-o)}

/* ── DOWÓD / LICZBY ─────────────────────────────────────── */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.kpi{background:var(--ink);padding:clamp(24px,3vw,38px)}
.kpi .k{font-family:var(--display);font-weight:700;font-size:clamp(1.7rem,2.8vw,2.5rem);line-height:.95;color:var(--o)}
.kpi .v{font-size:.94rem;color:var(--tx2);margin-top:12px;line-height:1.5}
.kpi .s{font-size:.8rem;color:var(--tx3);margin-top:8px}
.demo{
  display:inline-flex;align-items:center;gap:10px;border:1px dashed var(--o);color:var(--o);
  font-size:.76rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  padding:9px 16px;margin-bottom:26px;border-radius:100px;
}

/* karty efektów */
.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.case{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--ink2);display:flex;flex-direction:column}
.case-img{position:relative;aspect-ratio:4/3;overflow:hidden}
.case-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.16,1,.3,1)}
.case:hover .case-img img{transform:scale(1.05)}
.case-img .badge{position:absolute;top:14px;left:14px;background:var(--o-fill);color:var(--on-o);font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:100px}
.case-b{padding:26px;display:flex;flex-direction:column;flex:1}
.case-b h3{font-family:var(--display);font-weight:700;font-size:1.12rem;text-transform:uppercase;line-height:1.3;letter-spacing:-.004em}
.case-b .sport{font-size:.8rem;color:var(--o2);font-weight:500;margin:6px 0 16px}
.case-b p{font-size:.94rem;color:var(--tx2);line-height:1.6;margin-bottom:22px;flex:1}
.ba{display:grid;grid-template-columns:1.5fr .8fr .8fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.ba>div{background:var(--ink2);padding:10px 12px;font-size:.85rem;color:var(--tx2)}
.ba .h{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3);background:var(--ink3)}
.ba .now{color:var(--o);font-weight:600}

/* cytaty */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.quote{border-top:2px solid var(--o);padding-top:26px}
.quote p{font-size:1.05rem;line-height:1.7;color:var(--tx);margin-bottom:22px}
.quote .who{font-size:.86rem;font-weight:600}
.quote .role{font-size:.82rem;color:var(--tx3);margin-top:3px}

/* ── SPLIT (obraz + tekst) ──────────────────────────────── */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.split.rev .split-img{order:2}
.split-img{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:4/5}
.split-img img{width:100%;height:100%;object-fit:cover}
.split-img .cap{position:absolute;left:0;bottom:0;background:var(--ink);padding:14px 20px;font-size:.8rem;color:var(--tx3);max-width:80%}
.facts{display:flex;flex-direction:column;gap:1px;background:var(--line);border-block:1px solid var(--line);margin-top:32px}
.fact{background:var(--ink);padding:18px 0;display:flex;align-items:baseline;gap:20px}
.fact b{font-family:var(--display);font-weight:700;font-size:1.1rem;color:var(--o);min-width:150px}
.fact span{font-size:.95rem;color:var(--tx2);line-height:1.5}
.light .fact{background:var(--bone)}
.light .facts{background:var(--bone3);border-color:var(--bone3)}
.light .fact span{color:var(--lx2)}
.light .fact b{color:var(--o-deep)}

/* ── GALERIA ────────────────────────────────────────────── */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.gal figure{position:relative;overflow:hidden;border-radius:var(--r);aspect-ratio:1}
.gal figure:nth-child(1){grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.16,1,.3,1)}
.gal figure:hover img{transform:scale(1.06)}

/* ── FAQ ────────────────────────────────────────────────── */
.faq{max-width:900px;border-top:1px solid var(--line)}
.light .faq{border-color:var(--bone3)}
.faq details{border-bottom:1px solid var(--line)}
.light .faq details{border-color:var(--bone3)}
.faq summary{
  list-style:none;cursor:pointer;padding:24px 44px 24px 0;position:relative;
  font-size:1.08rem;font-weight:600;line-height:1.45;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:'';position:absolute;right:6px;top:50%;width:13px;height:13px;
  border-right:2px solid var(--o);border-bottom:2px solid var(--o);
  transform:translateY(-70%) rotate(45deg);transition:transform .25s;
}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq .a{padding:0 44px 26px 0;color:var(--tx2);line-height:1.75;max-width:70ch}
.light .faq .a{color:var(--lx2)}

/* ── TABELA ─────────────────────────────────────────────── */
.tbl{width:100%;border-collapse:collapse}
.tbl thead th{
  text-align:left;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--o);padding:0 16px 14px 0;border-bottom:2px solid var(--o);
}
.tbl thead th:last-child{text-align:right;padding-right:0}
.tbl td{padding:20px 16px 20px 0;border-bottom:1px solid var(--line);vertical-align:top;color:var(--tx2);font-size:.98rem}
.tbl td:first-child{font-weight:600;color:var(--tx);width:30%}
.tbl td:last-child{text-align:right;padding-right:0;font-family:var(--display);font-weight:700;font-size:1.05rem;color:var(--o);white-space:nowrap}
.tbl .cat td{color:var(--o)!important;font-size:.72rem!important;letter-spacing:.16em;text-transform:uppercase;font-weight:700;padding-top:38px;border-bottom:none;font-family:var(--sans)}

/* ── FORMULARZ ──────────────────────────────────────────── */
.form-wrap{max-width:820px;margin-inline:auto}
.callout{border-left:2px solid var(--o);padding:20px 26px;background:var(--ink2);margin-bottom:40px;color:var(--tx2);line-height:1.7}
.callout strong{color:var(--tx);font-weight:600}
.fbar{display:flex;gap:6px;margin-bottom:12px}
.fbar i{flex:1;height:3px;background:var(--ink4);border-radius:100px;transition:background .4s}
.fbar i.on{background:var(--o)}
.fbar-l{display:flex;justify-content:space-between;font-size:.82rem;margin-bottom:38px}
.fbar-l .now{color:var(--o);font-weight:600}
.fbar-l .cnt{color:var(--tx3)}
.fstep{display:none}
.fstep.on{display:block;animation:fadein .4s cubic-bezier(.16,1,.3,1)}
@keyframes fadein{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.fstep>h2{font-family:var(--display);font-weight:700;font-size:clamp(1.25rem,1.9vw,1.65rem);text-transform:uppercase;line-height:1.24;letter-spacing:-.006em;margin-bottom:10px}
.fstep>.sub{color:var(--tx3);margin-bottom:34px;font-size:.98rem}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.frow.one{grid-template-columns:1fr}
.fld>label,.fld>.lbl{display:block;font-size:.82rem;font-weight:600;letter-spacing:.02em;color:var(--tx2);margin-bottom:10px}
.fld .req{color:var(--o)}
.fld input[type=text],.fld input[type=tel],.fld input[type=email],.fld input[type=number],.fld select,.fld textarea{
  width:100%;background:var(--ink2);border:1px solid var(--line);color:var(--tx);
  font-family:inherit;font-size:1rem;padding:15px 17px;border-radius:var(--r);transition:.2s;
}
.fld textarea{resize:vertical;min-height:120px;line-height:1.6}
.fld select{
  appearance:none;cursor:pointer;padding-right:46px;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8612A' stroke-width='2.2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:17px;
}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--o);background:var(--ink3)}
.fld input::placeholder,.fld textarea::placeholder{color:var(--tx3)}
.fld.err input,.fld.err select,.fld.err textarea{border-color:#ff6b6b;background:rgba(255,107,107,.07)}
.fld .msg{display:none;font-size:.82rem;color:#ff8f8f;margin-top:8px}
.fld.err .msg{display:block}
.fld .hint{font-size:.84rem;color:var(--tx3);margin-top:8px}
.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:10px}
.opt input{position:absolute;opacity:0;width:0;height:0}
.opt>span{
  display:block;height:100%;background:var(--ink2);border:1px solid var(--line);
  padding:15px 17px;font-size:.94rem;color:var(--tx2);cursor:pointer;transition:.2s;border-radius:var(--r);line-height:1.4;
}
.opt>span small{display:block;color:var(--tx3);font-size:.82rem;margin-top:4px}
.opt>span:hover{border-color:var(--line2);background:var(--ink3)}
.opt input:checked+span{border-color:var(--o);background:rgba(var(--o-rgb),.1);color:var(--tx)}
.opt input:checked+span small{color:var(--o3)}
.opt input:focus-visible+span{outline:2px solid var(--o2);outline-offset:2px}
.chk{display:flex;gap:14px;align-items:flex-start}
.chk input{width:19px;height:19px;accent-color:var(--o);margin-top:.2em;flex-shrink:0;cursor:pointer}
.chk label{font-size:.9rem;color:var(--tx3);line-height:1.6;cursor:pointer}
.chk.err label{color:#ff8f8f}
.fnav{display:flex;gap:14px;justify-content:space-between;margin-top:40px;padding-top:30px;border-top:1px solid var(--line);flex-wrap:wrap}
.fnav .btn{min-width:180px}
.fnav .sp{flex:1}
.fdone{display:none;text-align:center;padding:60px 0}
.fdone.on{display:block;animation:fadein .5s cubic-bezier(.16,1,.3,1)}
.fdone .ic{width:84px;height:84px;border:2px solid var(--o);border-radius:100px;display:grid;place-items:center;margin:0 auto 30px}
.fdone .ic svg{width:36px;height:36px;stroke:var(--o);fill:none;stroke-width:2.4}
.fdone h2{font-family:var(--display);font-weight:700;font-size:clamp(1.45rem,2.3vw,2rem);text-transform:uppercase;line-height:1.24;letter-spacing:-.006em;margin-bottom:18px}
.fdone p{color:var(--tx2);max-width:52ch;margin:0 auto 12px;line-height:1.75}
.ferr{display:none;border-left:2px solid #ff6b6b;background:rgba(255,107,107,.08);padding:18px 22px;margin-top:24px;color:#ffbdbd;line-height:1.65;font-size:.95rem}
.ferr.on{display:block}
.ferr a{color:var(--tx)}

/* ── CTA KOŃCOWE ────────────────────────────────────────── */
.cta{position:relative;isolation:isolate;overflow:hidden;text-align:center;padding-block:clamp(90px,14vh,180px)}
.cta-bg{position:absolute;inset:0;z-index:-2}
.cta-bg img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.cta-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(rgba(var(--scrim),.86),rgba(var(--scrim),.94))}
.cta .d2{margin:20px auto 24px;max-width:16ch}
.cta .lede{margin-inline:auto}
.cta .btn{margin-top:34px}
.channels{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:44px}
.ch{
  display:inline-flex;align-items:center;gap:9px;padding:11px 18px;border:1px solid var(--line);
  font-size:.86rem;color:var(--tx2);text-decoration:none;transition:.2s;border-radius:100px;
}
.ch:hover{border-color:var(--o);color:var(--o);transform:translateY(-2px)}
.ch svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8}

/* ── STOPKA ─────────────────────────────────────────────── */
.foot{background:var(--ink2);border-top:1px solid var(--line);padding-block:clamp(46px,6vh,72px)}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:clamp(28px,4vw,60px);margin-bottom:44px}
.foot h4{font-size:.76rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tx3);margin-bottom:18px}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.foot a{color:var(--tx2);text-decoration:none;font-size:.95rem;transition:color .2s}
.foot a:hover{color:var(--o)}
.foot .logo{font-size:1.6rem;margin-bottom:16px;display:inline-block}
.foot .body{font-size:.95rem;max-width:38ch}
.foot-bot{border-top:1px solid var(--line);margin-top:34px;padding-top:30px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:.84rem;color:var(--tx3)}

/* ── PASEK CTA (mobile) ─────────────────────────────────── */
.bar{display:none}
.hero-page{padding-top:clamp(120px,18vh,190px);padding-bottom:clamp(50px,7vh,86px);position:relative;overflow:hidden}
.hero-page::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 12% 0%,rgba(var(--o-rgb),.13),transparent 70%);pointer-events:none}
.crumb{font-size:.8rem;color:var(--tx3);margin-bottom:20px;position:relative}
.crumb a{color:var(--tx3);text-decoration:none}
.crumb a:hover{color:var(--o)}
.hero-page h1{position:relative;max-width:17ch}
.hero-page .lede{margin-top:24px;position:relative}
.hero-page .btns{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px;position:relative}

/* ── RESPONSYWNOŚĆ ──────────────────────────────────────── */
@media (max-width:1180px){
  .ath{grid-template-columns:1fr 1fr}
  .kpis{grid-template-columns:1fr 1fr}
  .cases{grid-template-columns:1fr}
  .quotes{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .gal{grid-template-columns:repeat(2,1fr)}
  .gal figure:nth-child(1){grid-column:span 2;grid-row:auto;aspect-ratio:16/10}
}
@media (max-width:920px){
  .nav-mid{display:none}
  .burger{display:flex}
  .nav-end .btn{display:none}
  .disc,.progs,.duo,.split{grid-template-columns:1fr}
  .split.rev .split-img{order:0}
  .split-img{aspect-ratio:16/11}
  .hero-strip{grid-template-columns:1fr;background:none}
  .hero-strip div{border-bottom:1px solid var(--line);padding:16px 0}
  .hero-strip div:last-child{border-bottom:none}
  .panel{grid-template-columns:1fr;grid-template-rows:38vh 1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-grid>div:first-child{grid-column:1/-1}
  .frow{grid-template-columns:1fr}
  .scrollcue{display:none}
  .bar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:880;gap:8px;
    padding:10px 12px;background:rgba(var(--scrim),.9);backdrop-filter:blur(14px);
    border-top:1px solid var(--line);
  }
  .bar a.ico{
    width:50px;flex-shrink:0;display:grid;place-items:center;border:1px solid var(--line2);
    color:var(--o);border-radius:var(--r);
  }
  .bar a.ico svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.9}
  .bar a.main{
    flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    background:var(--o-fill);color:var(--on-o);text-decoration:none;padding:10px;border-radius:var(--r);
    font-weight:600;font-size:.95rem;line-height:1.2;
  }
  .bar a.main small{font-size:.72rem;font-weight:400;opacity:.85;margin-top:2px}
  body.has-bar{padding-bottom:80px}
}
@media (max-width:620px){
  .tbl td:nth-child(2),.tbl th:nth-child(2){display:none}
  .tbl td{padding:16px 10px 16px 0;font-size:.94rem}
  .tbl td:last-child{white-space:normal}
  .ath{grid-template-columns:1fr}
  .kpis{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .gal{grid-template-columns:1fr 1fr}
  .btn{width:100%}
  .hero-cta,.hero-page .btns{flex-direction:column;align-items:stretch}
  .fnav{flex-direction:column-reverse}
  .fnav .btn{width:100%;min-width:0}
  .fnav .sp{display:none}
  .helper,.dcard.wide{flex-direction:column;align-items:flex-start}
  .helper .btn,.dcard.wide .btn{width:100%}
  .tbl td:first-child{width:auto}
  .tbl td:last-child{font-size:1.1rem}
  .ba{grid-template-columns:1.4fr .8fr .8fr}
  .foot-grid{grid-template-columns:1fr}
}

/* =============================================================
   NAGŁÓWEK STRONY — dopracowanie
   ============================================================= */
@media (min-width:921px){
  .nav-mid{
    display:flex;align-items:center;gap:4px;
    padding:5px;border:1px solid var(--line);border-radius:100px;
    background:var(--veil1);backdrop-filter:blur(var(--blur));
  }
  .nav.stuck .nav-mid{background:var(--veil2)}
  .nav-mid a{
    position:relative;font-size:.8rem;font-weight:500;letter-spacing:.04em;
    text-decoration:none;color:var(--tx2);padding:9px 16px;border-radius:100px;
    transition:color .2s,background .2s;white-space:nowrap;
  }
  .nav-mid a:hover{color:var(--tx);background:var(--veil3)}
  .nav-mid a[aria-current]{color:var(--tx);background:rgba(var(--o-rgb),.16);box-shadow:inset 0 0 0 1px rgba(var(--o-rgb),.4)}
  .nav-end .btn{padding:12px 22px;font-size:.84rem;border-radius:100px}
}
.burger{border-radius:100px}
.logo i{display:inline-block;transform:translateY(-.06em)}

/* =============================================================
   PRZYCISK WHATSAPP (prawy dolny róg)
   ============================================================= */
.wa{
  position:fixed;right:26px;bottom:26px;z-index:870;
  display:flex;align-items:center;gap:11px;
  padding:13px 20px 13px 15px;border-radius:100px;
  background:var(--o-fill);color:var(--on-o);text-decoration:none;
  font-size:.9rem;font-weight:600;letter-spacing:.01em;
  box-shadow:0 10px 32px var(--shadow),0 0 0 1px var(--veil3);
  transition:transform .25s cubic-bezier(.16,1,.3,1),background .2s,box-shadow .25s;
}
.wa:hover{background:var(--o2);transform:translateY(-3px);box-shadow:0 16px 40px rgba(var(--o-rgb),.4)}
.wa svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.8;flex-shrink:0}
.wa::before{
  content:'';position:absolute;inset:-4px;border-radius:100px;
  border:1px solid rgba(var(--o-rgb),.55);animation:wapulse 2.8s ease-out infinite;pointer-events:none;
}
@keyframes wapulse{0%{transform:scale(1);opacity:.7}70%{transform:scale(1.14);opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.wa::before{animation:none}}
@media (max-width:920px){ .wa{display:none} }

/* =============================================================
   STOPKA — lista miast
   ============================================================= */
.foot-cities{border-top:1px solid var(--line);margin-top:44px;padding-top:36px;padding-bottom:8px}
.foot-cities h4{margin-bottom:16px}
.foot-cities .cols{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 28px}
.foot-cities a{font-size:.88rem;color:var(--tx3);text-decoration:none;transition:color .2s}
.foot-cities a:hover{color:var(--o)}
@media (max-width:920px){ .foot-cities .cols{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ .foot-cities .cols{grid-template-columns:1fr} }

/* miasto w hero */
.hero .city{
  display:inline-block;margin-top:14px;padding:7px 16px;border-radius:100px;
  border:1px solid rgba(var(--o-rgb),.45);background:rgba(var(--o-rgb),.12);
  font-size:.82rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--o2);
}


/* =============================================================
   PASEK APLIKACYJNY — przed sekcją z cenami
   ============================================================= */
.applybar{
  display:grid;grid-template-columns:1.5fr .9fr;gap:clamp(26px,4vw,64px);align-items:center;
  border:1px solid var(--line);border-left:3px solid var(--o);border-radius:var(--r);
  background:linear-gradient(120deg,rgba(var(--o-rgb),.09),transparent 58%),var(--ink2);
  padding:clamp(28px,3.6vw,52px);
}
.applybar .d2{margin:16px 0 18px}
.applybar .body{max-width:58ch}
.applybar-cta .note{margin-top:14px;text-align:center;max-width:none}
.light .applybar{background:linear-gradient(120deg,rgba(var(--o-rgb),.12),transparent 58%),var(--card);border-color:var(--bone3)}
.light .applybar .body{color:var(--lx2)}
@media (max-width:920px){ .applybar{grid-template-columns:1fr} }


/* przycisk WhatsApp nie zasłania tekstu w stopce */
@media (min-width:921px){
  .foot-bot{padding-right:270px}
}
/* odstępy między wyrazami w mniejszych nagłówkach */

/* =============================================================
   TELEFONY I TABLETY — warstwa responsywna (na końcu, żeby nic
   z wcześniejszych sekcji tego nie nadpisało)
   ============================================================= */
@media (max-width:920px){

  /* ── nagłówek + hamburger ─────────────────────────────── */
  .nav{gap:12px;padding:13px var(--pad)}
  .nav.stuck{padding-top:10px;padding-bottom:10px}
  .nav-mid{display:none}
  .nav-end .btn{display:none}
  .logo{font-size:1.02rem}
  .burger{
    display:flex;width:46px;height:46px;gap:5px;border-radius:100px;
    background:var(--veil2);border:1px solid var(--line2);
    -webkit-tap-highlight-color:transparent;
  }
  .burger span{width:19px;height:2px;border-radius:2px}
  .burger[aria-expanded=true]{background:var(--o);border-color:var(--o)}
  .burger[aria-expanded=true] span{background:var(--on-o)}

  /* ── menu pełnoekranowe ───────────────────────────────── */
  .sheet{
    padding:88px var(--pad) calc(22px + env(safe-area-inset-bottom));
    gap:26px;justify-content:flex-start;overscroll-behavior:contain;
    background:linear-gradient(180deg,var(--ink) 0%,var(--ink2) 100%);
  }
  .sheet-nav a{
    font-size:clamp(1.02rem,4.2vw,1.28rem);padding:11px 0 11px 18px;min-height:48px;
  }
  .sheet-nav a:hover{padding-left:0}
  .sheet-nav a:active{color:var(--o)}
  .sheet-cta{margin-top:auto;padding-top:20px;display:grid;gap:10px}
  .sheet-cta .btn{width:100%;justify-content:center;padding:16px 20px;font-size:.98rem}
  .sheet-quick{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .sheet-quick a{
    display:flex;align-items:center;justify-content:center;gap:9px;min-height:50px;
    border:1px solid var(--line2);border-radius:var(--r);color:var(--tx2);
    text-decoration:none;font-size:.92rem;font-weight:600;
  }
  .sheet-quick a svg{width:19px;height:19px;stroke:var(--o);fill:none;stroke-width:1.9}
  .sheet-foot{padding-top:16px;margin-top:16px;border-top:1px solid var(--line);font-size:.82rem;gap:6px 18px}
  body.sheet-open{overflow:hidden}

  /* ── odstępy sekcji ───────────────────────────────────── */
  .sec{padding-block:clamp(58px,9vh,86px)}
  .sec-sm{padding-block:clamp(46px,7vh,68px)}

  /* ── hero ─────────────────────────────────────────────── */
  .hero{min-height:auto;padding-top:0;padding-bottom:42px}
  .hero-in{padding-top:112px;padding-bottom:26px}
  .hero-bg img{object-position:64% 44%}
  .hero-bg::after{
    background:linear-gradient(180deg,rgba(var(--scrim),.86) 0%,rgba(var(--scrim),.62) 34%,rgba(var(--scrim),.9) 100%);
  }
  .hero .lede,.hero p.body{max-width:none}
  .hero-cta{gap:10px}

  /* ── cele dotykowe: minimum 44 px ─────────────────────── */
  .foot-grid a,.foot-cities a,.sheet-foot a{
    display:inline-flex;align-items:center;min-height:44px;
  }
  .foot-grid li{margin:0}
  .foot-cities .cols{gap:0 24px}
  .lnk{min-height:44px;display:inline-flex;align-items:center}
  a,button,summary{-webkit-tap-highlight-color:rgba(var(--o-rgb),.18)}

  /* ── karty i siatki ───────────────────────────────────── */
  .prog{padding:26px 20px 28px}
  .prog-price{font-size:2.4rem}
  .tile,.helper,.dcard{padding:24px 20px}
  .acard h3{font-size:1.05rem}
  .cases{gap:18px}
  .ba{grid-template-columns:1fr 1fr 1fr;font-size:.9rem}

  /* ── formularz ────────────────────────────────────────── */
  .fstep>h2{font-size:clamp(1.2rem,5.4vw,1.5rem)}
  .fld input[type=text],.fld input[type=tel],.fld input[type=email],
  .fld input[type=number],.fld select,.fld textarea{
    font-size:16px;padding:16px 16px;   /* 16px = iPhone nie przybliża pola */
  }
  .fld select{padding-right:46px}
  .frow{gap:0}

  /* ── dolny pasek CTA ──────────────────────────────────── */
  .bar{padding-bottom:calc(10px + env(safe-area-inset-bottom))}
  body.has-bar{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
}

@media (max-width:620px){
  .hero{padding-top:0}
  .hero-in{padding-top:100px}
  .sheet{padding-top:80px}
  .sheet-nav a{font-size:clamp(1rem,4.4vw,1.22rem);padding:12px 0 12px 18px;min-height:50px}
  .ba{grid-template-columns:1fr;gap:6px}
  .ba>*{border:none;padding-left:0}
  .gal{grid-template-columns:1fr}
  .kpi .k{font-size:2.1rem}
  .marq{font-size:1.5rem}
  .tbl{font-size:.92rem}
}

@media (max-width:380px){
  .logo{font-size:.94rem}
  .bar a.main{font-size:.88rem}
  .bar a.main small{font-size:.68rem}
  .bar a.ico{width:46px}
  .d1{font-size:1.78rem}
}

/* niskie ekrany — menu ma zmieścić się bez przewijania */
@media (max-width:920px) and (max-height:860px){
  .sheet-nav a{padding:10px 0 10px 18px;min-height:46px;font-size:clamp(.98rem,4.2vw,1.18rem)}
  .sheet-foot span{display:none}
  .sheet-foot{padding-top:12px;margin-top:12px}
  .sheet-cta{padding-top:16px}
}

/* =============================================================
   PRZEŁAMANIA KOLORU — rytm jasne / ciemne na długiej stronie
   ============================================================= */

/* sekcja lekko podniesiona nad czerń bazową */
.sec.raised,.sec-sm.raised{background:var(--ink2);border-block:1px solid var(--line)}

/* sekcja z ciepłą poświatą w tle (efekty / dowód) */
.wash{position:relative;isolation:isolate}
.wash::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(120% 80% at 12% 0%,rgba(var(--o-rgb),.16) 0%,rgba(var(--o-rgb),0) 58%),
    radial-gradient(90% 70% at 100% 100%,rgba(var(--o-rgb),.09) 0%,rgba(var(--o-rgb),0) 62%);
}

/* ── KROKI PROCESU NA JASNYM TLE ───────────────────────────── */
.light .steps{background:var(--bone3);border-block:1px solid var(--bone3)}
.light .step{background:var(--bone)}
.light .step:hover{background:var(--card)}
.light .step h3{color:var(--lx)}
.light .step p{color:var(--lx2)}
.light .step .n{color:var(--o-deep)}
.light .head-row{border-bottom-color:var(--bone3)}

/* numer kroku — czytelny znacznik zamiast małego napisu */
.step .n{
  display:flex;align-items:center;gap:12px;font-size:1.6rem;letter-spacing:0;
  margin-bottom:clamp(20px,3vw,34px);
}
.step .n::after{content:'';flex:1;height:1px;background:currentColor;opacity:.28}
.light .step .n::after{opacity:.34}

/* pierwszy krok wyróżniony — to jest to, co ma zrobić odwiedzający.
   Ciemna karta zamiast pomarańczowej: biały tekst na pomaranczowym
   ma kontrast 3,8:1, czyli ponizej progu WCAG AA dla tekstu ciaglego. */
.light .steps.proc .step:first-child{background:var(--lx);color:var(--bone)}
.light .steps.proc .step:first-child h3{color:var(--bone)}
.light .steps.proc .step:first-child p{color:var(--bone2)}
.light .steps.proc .step:first-child .n{color:var(--o2)}
.light .steps.proc .step:first-child .n::after{opacity:.4}
.light .steps.proc .step:first-child:hover{background:var(--ink4)}

@media (max-width:920px){
  .step .n{font-size:1.35rem;margin-bottom:16px}
  .sec.raised,.sec-sm.raised{border-block-width:1px}
}

/* =============================================================
   MOTYWY KOLORYSTYCZNE
   Zmiana odbywa się przez atrybut data-motyw na <html>.
   Domyślny (bez atrybutu) = Pomarańcz / Czerń.
   ============================================================= */

/* ── POMARAŃCZ / GRAFIT / SZKŁO ───────────────────────────── */
[data-motyw="grafit"]{
  --ink:#101319;
  --ink2:#171B23;
  --ink3:#1F242E;
  --ink4:#2A303C;
  --line:rgba(190,205,225,.12);
  --line2:rgba(190,205,225,.22);
  --line-l:rgba(17,22,33,.14);
  --line2-l:rgba(17,22,33,.24);
  --veil1:rgba(190,205,225,.05);
  --veil2:rgba(190,205,225,.09);
  --veil3:rgba(190,205,225,.13);
  --veil4:rgba(190,205,225,.3);
  --veil-l:rgba(16,19,25,.05);
  --shadow:rgba(3,6,12,.6);
  --blur:18px;
  --bone:#EAEDF2;
  --bone2:#DBE0E8;
  --bone3:#C4CCD8;
  --tx:#EEF1F6;
  --tx2:rgba(238,241,246,.78);
  --tx3:rgba(238,241,246,.68);
  --lx:#111621;
  --lx2:rgba(17,22,33,.74);
  --lx3:rgba(17,22,33,.66);
  --o:#F26A2E;
  --o2:#FF8149;
  --o3:#FFAA85;
  --o-deep:#8E3211;
  --o-wash:rgba(242,106,46,.13);
  --o-fill:#C4501B;   /* ciemniejszy odcien pod biały tekst — kontrast 4,7:1 */
  --scrim:16,19,25;
  --o-rgb:242,106,46;
  --o-deep-rgb:142,50,17;
  --card:#FFFFFF;
  --on-o:#FFFFFF;
}
/* szkło: karty przepuszczają tło zamiast być pełnym blokiem */
[data-motyw="grafit"] .step,
[data-motyw="grafit"] .tile,
[data-motyw="grafit"] .helper{
  background:linear-gradient(150deg,var(--veil2),var(--veil1));
  backdrop-filter:blur(var(--blur)) saturate(1.15);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(1.15);
}
/* siatka wskaznikow ma tlo-linie i gap 1 px — kafle musza byc nieprzezroczyste,
   inaczej linia siatki przebija przez cala plaszczyzne */
[data-motyw="grafit"] .kpis{background:var(--line2)}
[data-motyw="grafit"] .kpi{background:linear-gradient(150deg,#191E27,#141820)}
/* cytaty nie maja tla w zadnym motywie — tylko kreska u gory */
[data-motyw="grafit"] .quote{background:none;backdrop-filter:none}
[data-motyw="grafit"] .step:hover{background:linear-gradient(150deg,var(--veil3),var(--veil2))}
[data-motyw="grafit"] .light .step{background:var(--bone);backdrop-filter:none}
[data-motyw="grafit"] .light .step:hover{background:var(--card)}
[data-motyw="grafit"] .sec.raised,
[data-motyw="grafit"] .sec-sm.raised{background:linear-gradient(180deg,var(--ink2),var(--ink))}
[data-motyw="grafit"] .nav.stuck{backdrop-filter:blur(22px) saturate(1.4)}

/* ── BIEL / ZŁOTO / MARMUR ────────────────────────────────
   Zasada: strona jest jasna, ale sekcje ze zdjeciem w tle
   (hero, CTA, kafle dyscyplin i zawodnikow) zostaja ciemne
   z jasnym tekstem. Rozjasnianie zdjec pod ciemny tekst dawalo
   wyprany, mglisty efekt — dlatego zdjecia zostaja gleboke.
   ───────────────────────────────────────────────────────── */
[data-motyw="marmur"]{
  --ink:#FBFAF7;
  --ink2:#F4F1EA;
  --ink3:#ECE7DC;
  --ink4:#E0D8C7;
  --line:rgba(40,32,16,.14);
  --line2:rgba(40,32,16,.26);
  --line-l:rgba(40,32,16,.16);
  --line2-l:rgba(40,32,16,.28);
  --veil1:rgba(40,32,16,.035);
  --veil2:rgba(40,32,16,.06);
  --veil3:rgba(40,32,16,.1);
  --veil4:rgba(40,32,16,.3);
  --veil-l:rgba(40,32,16,.05);
  --shadow:rgba(60,48,22,.2);
  --blur:10px;
  --bone:#EAE3D4;          /* kamien — sekcje przelamane */
  --bone2:#DED5C0;
  --bone3:#C7BA9C;
  --tx:#1A1610;
  --tx2:rgba(26,22,16,.78);
  --tx3:rgba(26,22,16,.68);
  --lx:#1A1610;
  --lx2:rgba(26,22,16,.78);
  --lx3:rgba(26,22,16,.68);
  --o:#7A5C12;             /* zloto na jasnym — kontrast 6,0:1 */
  --o2:#93701A;
  --o3:#B8952F;
  --o-deep:#5A4310;
  --o-wash:rgba(122,92,18,.13);
  --o-fill:#7A5C12;
  --scrim:26,22,16;        /* zdjecia przyciemniamy tak jak w motywach ciemnych */
  --o-rgb:122,92,18;
  --o-deep-rgb:90,67,16;
  --card:#FFFFFF;
  --on-o:#FFFFFF;
}

/* sekcje ze zdjeciem w tle — lokalne przestawienie palety na ciemna.
   Komponenty czytaja te same zmienne, wiec wystarczy je nadpisac tutaj. */
[data-motyw="marmur"] .hero,
[data-motyw="marmur"] .cta,
[data-motyw="marmur"] .dcard,
[data-motyw="marmur"] .acard{
  /* w tej sekcji tlem jest ciemne zdjecie, wiec --ink tez musi byc ciemny:
     gradient wygaszajacy zdjecie u dolu hero uzywa wlasnie tej zmiennej
     i przy jasnej wartosci rozjasnial dol kadru pod jasnym tekstem */
  --ink:#151109;
  --ink2:#1D180F;
  --ink3:#262016;
  --tx:#F7F3EA;
  --tx2:rgba(247,243,234,.84);
  --tx3:rgba(247,243,234,.7);
  --line:rgba(247,243,234,.18);
  --line2:rgba(247,243,234,.34);
  --veil2:rgba(247,243,234,.08);
  --o:#DFB55C;             /* jasniejsze zloto — na ciemnym ma kontrast 9,3:1 */
  --o2:#E8C374;
  --o-rgb:223,181,92;
  --o-fill:#DFB55C;
  --on-o:#1A1610;          /* ciemny tekst na zlotym wypelnieniu */
  --o-wash:rgba(223,181,92,.16);
  color:var(--tx);
}
/* karta "pozostale dyscypliny" nie ma zdjecia — zostaje jasna */
[data-motyw="marmur"] .dcard.wide{
  --ink:#FBFAF7;
  --ink2:#F4F1EA;
  --ink3:#ECE7DC;
  --tx:#1A1610;
  --tx2:rgba(26,22,16,.78);
  --tx3:rgba(26,22,16,.68);
  --line:rgba(40,32,16,.14);
  --line2:rgba(40,32,16,.26);
  --o:#7A5C12;
  --o2:#93701A;
  --o-rgb:122,92,18;
  --o-fill:#7A5C12;
  --on-o:#FFFFFF;
  color:var(--tx);
  background:#ECE7DC;
}

[data-motyw="marmur"] .hero-bg img,
[data-motyw="marmur"] .cta-bg img{filter:saturate(.72) sepia(.16) contrast(1.04)}
[data-motyw="marmur"] .dcard img,
[data-motyw="marmur"] .acard img{filter:saturate(.78) sepia(.12)}

/* granica miedzy ciemnym hero a jasna reszta — cienka zlota kreska */
[data-motyw="marmur"] .hero{border-bottom:1px solid rgba(223,181,92,.38)}
[data-motyw="marmur"] .cta{border-top:1px solid rgba(223,181,92,.38)}

/* jasne elementy na jasnym tle */
[data-motyw="marmur"] .mq{background:var(--ink3);border-color:var(--line)}
[data-motyw="marmur"] .sec.raised,
[data-motyw="marmur"] .sec-sm.raised{background:var(--ink3)}
[data-motyw="marmur"] .kpis{background:var(--line2);border-color:var(--line2)}
[data-motyw="marmur"] .kpi{background:var(--ink2)}
[data-motyw="marmur"] .steps{background:var(--line2);border-color:var(--line2)}
[data-motyw="marmur"] .step{background:var(--ink2)}
[data-motyw="marmur"] .step:hover{background:var(--card)}
[data-motyw="marmur"] .light .step{background:var(--bone)}
[data-motyw="marmur"] .light .step:hover{background:#F2EDE1}
[data-motyw="marmur"] .prog.feat{background:var(--lx);border-color:var(--lx)}
[data-motyw="marmur"] .prog.feat .prog-price,
[data-motyw="marmur"] .prog.feat h3,
[data-motyw="marmur"] .prog.feat li strong{color:#F7F3EA}
[data-motyw="marmur"] .demo{border-color:var(--o);color:var(--o-deep)}
[data-motyw="marmur"] .sheet{background:linear-gradient(180deg,var(--ink) 0%,var(--ink2) 100%)}
[data-motyw="marmur"] .bar{background:rgba(251,250,247,.95)}
/* nagłówek jest zawsze na jasnym pasku — inaczej ciemne napisy
   ginęłyby na ciemnym zdjęciu w hero */
[data-motyw="marmur"] .nav{
  background:rgba(251,250,247,.92);backdrop-filter:blur(16px) saturate(1.1);
  -webkit-backdrop-filter:blur(16px) saturate(1.1);
  border-bottom:1px solid var(--line);
}
[data-motyw="marmur"] .nav.stuck{background:rgba(251,250,247,.96)}
[data-motyw="marmur"] .nav-mid{background:var(--veil1)}
[data-motyw="marmur"] .nav.stuck .nav-mid{background:var(--veil2)}
[data-motyw="marmur"] .ck{background:var(--ink2)}
[data-motyw="marmur"] .panel-body{background:var(--ink)}
[data-motyw="marmur"] .hero-page::before{background:radial-gradient(ellipse 80% 60% at 12% 0%,rgba(122,92,18,.1),transparent 70%)}

/* ── PRZEŁĄCZNIK MOTYWU W STOPCE ──────────────────────────── */
.foot-motyw{
  border-top:1px solid var(--line);margin-top:34px;padding-top:26px;
  display:flex;align-items:center;gap:16px 22px;flex-wrap:wrap;
}
.foot-motyw .lbl{
  font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--tx3);
}
.motywy{display:flex;gap:10px;flex-wrap:wrap}
.mtw{
  display:inline-flex;align-items:center;gap:10px;min-height:44px;
  padding:9px 16px 9px 11px;border:1px solid var(--line);border-radius:100px;
  background:var(--veil1);color:var(--tx2);cursor:pointer;
  font-family:inherit;font-size:.84rem;font-weight:500;white-space:nowrap;
  transition:color .2s,border-color .2s,background .2s;
}
.mtw:hover{color:var(--tx);border-color:var(--line2);background:var(--veil2)}
.mtw.on{color:var(--tx);border-color:var(--o);background:var(--o-wash)}
.mtw i{
  width:20px;height:20px;border-radius:100px;flex-shrink:0;
  box-shadow:inset 0 0 0 1px var(--veil4);
}
.mtw-ogien  i{background:linear-gradient(135deg,#E8612A 0 50%,#0A0A0B 50% 100%)}
.mtw-grafit i{background:linear-gradient(135deg,#F26A2E 0 50%,#2A303C 50% 100%)}
.mtw-marmur i{background:linear-gradient(135deg,#B8952F 0 50%,#FBF9F5 50% 100%)}
@media (max-width:620px){
  .foot-motyw{flex-direction:column;align-items:flex-start;gap:12px}
  .motywy{width:100%}
  .mtw{flex:1 1 100%;justify-content:flex-start}
}

/* =============================================================
   BANER COOKIES
   ============================================================= */
.ck{
  position:fixed;left:0;right:0;bottom:0;z-index:940;
  background:var(--ink2);border-top:1px solid var(--line);
  padding:20px var(--pad) calc(20px + env(safe-area-inset-bottom));
  box-shadow:0 -14px 40px var(--shadow);
  transform:translateY(110%);transition:transform .45s cubic-bezier(.16,1,.3,1);
}
.ck.on{transform:none}
.ck-in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:18px 32px;align-items:center}
.ck h2{font-family:var(--display);font-weight:700;font-size:1rem;text-transform:uppercase;letter-spacing:-.004em;margin-bottom:8px}
.ck p{font-size:.9rem;line-height:1.6;color:var(--tx2);max-width:78ch}
.ck p a{color:var(--o);text-decoration:underline;text-underline-offset:3px}
.ck-btns{display:flex;gap:10px;flex-wrap:wrap}
.ck-btns .btn{white-space:nowrap}
.ck-opts{grid-column:1/-1;display:none;border-top:1px solid var(--line);margin-top:4px;padding-top:18px;gap:14px}
.ck.rozwin .ck-opts{display:grid}
.ck-opt{
  display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;
  padding:14px 16px;border:1px solid var(--line);border-radius:var(--r);background:var(--veil1);
}
.ck-opt b{display:block;font-size:.92rem;margin-bottom:4px}
.ck-opt span{font-size:.84rem;color:var(--tx3);line-height:1.55}
.ck-sw{position:relative;width:46px;height:26px;flex-shrink:0;margin-top:2px}
.ck-sw input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.ck-sw i{
  position:absolute;inset:0;border-radius:100px;background:var(--veil3);
  border:1px solid var(--line2);transition:background .2s,border-color .2s;pointer-events:none;
}
.ck-sw i::after{
  content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:100px;
  background:var(--tx3);transition:transform .22s cubic-bezier(.16,1,.3,1),background .2s;
}
.ck-sw input:checked + i{background:var(--o-wash);border-color:var(--o)}
.ck-sw input:checked + i::after{transform:translateX(20px);background:var(--o)}
.ck-sw input:disabled + i{opacity:.55}
.ck-sw input:focus-visible + i{outline:2px solid var(--o2);outline-offset:3px}
body.has-bar .ck{bottom:0}
@media (max-width:920px){
  .ck-in{grid-template-columns:1fr}
  .ck-btns .btn{flex:1 1 100%;justify-content:center}
  .ck{padding-top:18px}
}

/* linki prawne w stopce */
.foot-prawne{display:flex;gap:8px 20px;flex-wrap:wrap;align-items:center}
.foot-prawne a{color:var(--tx2);text-decoration:none;border-bottom:1px solid var(--line2);padding-bottom:1px;transition:color .2s,border-color .2s}
.foot-prawne a:hover{color:var(--o);border-color:var(--o)}
@media (max-width:920px){.foot-prawne a{display:inline-flex;align-items:center;min-height:44px}}

/* strona prawna — czytelna kolumna tekstu */
.prawne{max-width:82ch}
.prawne h2{font-family:var(--display);font-weight:700;font-size:clamp(1.05rem,1.5vw,1.3rem);text-transform:uppercase;letter-spacing:-.004em;margin:44px 0 14px;padding-top:26px;border-top:1px solid var(--line)}
.prawne h2:first-of-type{margin-top:0;padding-top:0;border-top:none}
.prawne h3{font-family:var(--display);font-weight:700;font-size:1rem;text-transform:uppercase;margin:26px 0 10px;color:var(--o)}
.prawne p{color:var(--tx2);margin-bottom:14px;line-height:1.75}
.prawne ul{margin:0 0 16px;padding:0;list-style:none}
.prawne li{position:relative;padding-left:22px;margin-bottom:9px;color:var(--tx2);line-height:1.7}
.prawne li::before{content:'';position:absolute;left:0;top:.72em;width:7px;height:1px;background:var(--o)}
.prawne strong{color:var(--tx)}
.prawne a{color:var(--o);text-decoration:underline;text-underline-offset:3px}
.prawne table{width:100%;border-collapse:collapse;margin:8px 0 20px;font-size:.94rem}
.prawne th,.prawne td{text-align:left;padding:13px 14px 13px 0;border-bottom:1px solid var(--line);vertical-align:top;color:var(--tx2)}
.prawne th{color:var(--tx);font-weight:600;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase}
@media (max-width:620px){.prawne table,.prawne thead,.prawne tbody,.prawne tr,.prawne th,.prawne td{display:block;width:100%}
  .prawne thead{display:none}
  .prawne td{border-bottom:none;padding:4px 0}
  .prawne tr{display:block;border-bottom:1px solid var(--line);padding:14px 0}}

/* długie adresy e-mail i URL nie mogą rozpychać strony na wąskich ekranach */
.prawne a,.prawne td,.foot-grid a,.foot-prawne a,.ferr a,.sheet-foot a{overflow-wrap:anywhere}

/* przycisk zamykania profilu leży na ciemnym zdjęciu — w jasnym motywie
   musi mieć jasny krzyżyk, inaczej ginie */
[data-motyw="marmur"] .acard{--tx3:rgba(247,243,234,.86)}
[data-motyw="marmur"] .panel-close{color:#F7F3EA;border-color:rgba(247,243,234,.34);background:rgba(16,13,9,.72)}
[data-motyw="marmur"] .panel-close:hover{background:#DFB55C;border-color:#DFB55C;color:#1A1610}

/* menu w jasnym motywie — bez obrysu, samo mleczne tlo */
[data-motyw="marmur"] .nav-mid{
  background:rgba(255,255,255,.5);border-color:transparent;
  box-shadow:0 1px 2px rgba(60,48,22,.05);
}
[data-motyw="marmur"] .nav.stuck .nav-mid{background:rgba(255,255,255,.72)}
[data-motyw="marmur"] .nav-mid a{color:rgba(26,22,16,.72)}
[data-motyw="marmur"] .nav-mid a:hover{color:var(--tx);background:rgba(122,92,18,.08)}
[data-motyw="marmur"] .nav-mid a[aria-current]{
  color:var(--tx);background:rgba(122,92,18,.12);box-shadow:inset 0 0 0 1px rgba(122,92,18,.42);
}