/* =========================================================
   Kopera MMA - koperamma.pl/nowa
   ========================================================= */

:root{
  --black:#000;
  --ink:#070707;
  --ink2:#0d0d0d;
  --brand:#9e6f4c;
  --brand-lt:#c49166;
  --brand-dk:#6f4c33;
  --cream:#f8ebda;
  --cream-dim:rgba(248,235,218,.72);
  --cream-fade:rgba(248,235,218,.45);
  --wa:#25d366;

  --wrap:1540px;
  --gut:clamp(18px,4vw,60px);
  --r:26px;
  --r-lg:44px;

  --ease:cubic-bezier(.22,.68,.32,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur:.85s;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--black);color:var(--cream);
  font-family:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-weight:300;line-height:1.62;font-size:clamp(15px,1.02vw,18px);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.nav-open{overflow:hidden}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3{margin:0;font-weight:500;line-height:1.1}
p{margin:0 0 1.1em}
ul{margin:0;padding:0;list-style:none}
::selection{background:var(--brand);color:#fff}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;z-index:999;background:var(--cream);color:#000;padding:12px 20px;border-radius:0 0 12px 0}
.skip:focus{left:0}
:focus-visible{outline:2px solid var(--brand-lt);outline-offset:3px;border-radius:4px}

/* ---------- pasek postępu ---------- */
.progress{position:fixed;inset:0 0 auto 0;height:3px;z-index:120;pointer-events:none;background:transparent}
.progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--brand-dk),var(--brand-lt));transition:width .1s linear}

/* =========================================================
   HEADER
   ========================================================= */
.hdr{
  position:fixed;inset:0 0 auto 0;z-index:100;
  padding-block:clamp(14px,1.6vw,26px);
  transition:transform .45s var(--ease),background .4s,backdrop-filter .4s,padding .4s,box-shadow .4s;
}
.hdr.is-stuck{
  background:rgba(4,4,4,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  padding-block:10px;box-shadow:0 1px 0 rgba(248,235,218,.08),0 18px 40px -30px #000;
}
.hdr.is-hidden{transform:translate3d(0,-115%,0)}
.hdr__in{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut);
  display:flex;align-items:center;gap:24px;justify-content:space-between}

.hdr__logo img{width:clamp(130px,13vw,190px);height:auto;transition:width .4s var(--ease)}
.hdr.is-stuck .hdr__logo img{width:clamp(115px,10vw,150px)}

.nav ul{display:flex;gap:clamp(16px,2.1vw,40px);align-items:center}
.nav a{
  position:relative;font-size:clamp(13px,.95vw,17px);font-weight:400;color:var(--cream);
  padding-block:6px;transition:color .3s;white-space:nowrap;
}
.nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;
  background:var(--brand-lt);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease-out);
}
.nav a:hover,.nav a.is-active{color:var(--brand-lt)}
.nav a:hover::after,.nav a.is-active::after{transform:scaleX(1);transform-origin:left}

.burger{display:none;width:46px;height:46px;position:relative;z-index:101;flex:0 0 auto}
.burger span{position:absolute;left:11px;right:11px;height:2px;background:var(--cream);border-radius:2px;transition:.4s var(--ease)}
.burger span:nth-child(1){top:16px}
.burger span:nth-child(2){top:22px}
.burger span:nth-child(3){top:28px}
.burger[aria-expanded="true"] span:nth-child(1){top:22px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){top:22px;transform:rotate(-45deg)}

/* =========================================================
   PRZYCISKI
   ========================================================= */
.btn{
  --bg:var(--cream);--fg:var(--brand);
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  min-height:clamp(54px,4.5vw,86px);padding:0 clamp(28px,3.2vw,64px);
  border-radius:999px;background:var(--bg);color:var(--fg);
  font-weight:700;letter-spacing:.055em;font-size:clamp(14px,1.15vw,22px);
  overflow:hidden;isolation:isolate;
  transition:transform .45s var(--ease-out),box-shadow .45s var(--ease-out),color .35s;
  box-shadow:0 18px 40px -26px rgba(248,235,218,.55);
}
.btn span{position:relative;z-index:2}
.btn::before{
  content:"";position:absolute;inset:0;z-index:1;background:var(--brand);
  transform:translate3d(0,101%,0);transition:transform .5s var(--ease-out);
}
.btn:hover{transform:translateY(-3px);box-shadow:0 26px 48px -24px rgba(158,111,76,.75);color:var(--cream)}
.btn:hover::before{transform:translate3d(0,0,0)}
.btn:active{transform:translateY(-1px)}
.btn--lg{min-width:min(100%,560px)}
.btn--full{width:100%}
.btn--sm{min-height:clamp(48px,3.4vw,64px);padding:0 clamp(24px,2.4vw,46px);
  font-size:clamp(13px,.95vw,17px)}

/* ---------- CTA domykające sekcję ---------- */
.cta-inline{
  margin-top:clamp(26px,3vw,50px);padding-top:clamp(20px,2.2vw,36px);
  border-top:1px solid rgba(248,235,218,.12);
  display:flex;flex-wrap:wrap;align-items:center;gap:clamp(14px,1.8vw,30px);
}
.cta-inline__txt{margin:0;flex:1 1 240px;min-width:0;
  font-size:clamp(13px,.95vw,18px);color:var(--cream-dim)}
.cta-inline .btn{flex:0 0 auto}
@media (max-width:540px){
  .cta-inline{flex-direction:column;align-items:stretch;text-align:center}
  /* w kolumnie flex-basis staje sie wysokoscia - stad reset */
  .cta-inline__txt{flex:0 0 auto}
  .cta-inline .btn{width:100%}
}
.btn--brand{--bg:var(--brand);--fg:#fff;box-shadow:0 18px 40px -26px rgba(158,111,76,.8)}
.btn--brand::before{background:var(--cream)}
.btn--brand:hover{color:var(--brand)}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative;min-height:100svh;display:flex;align-items:center;
  padding:clamp(120px,14vh,180px) 0 clamp(70px,9vh,120px);
  overflow:hidden;background:#000;
}
.hero__bg{
  position:absolute;inset:-10% 0 -10%;
  background:
    radial-gradient(58% 48% at 62% 42%,rgba(255,255,255,.115),transparent 62%),
    radial-gradient(90% 70% at 20% 70%,rgba(158,111,76,.16),transparent 65%),
    #000;
  will-change:transform;
}
.hero__glow{
  position:absolute;left:50%;top:50%;width:min(120vw,1500px);aspect-ratio:1;
  transform:translate(-50%,-50%);pointer-events:none;
  background:radial-gradient(circle,rgba(158,111,76,.14),transparent 58%);
  filter:blur(30px);
}
.hero .wrap,.hero__copy,.hero__figure{position:relative;z-index:2}

.hero__figure{
  position:absolute;left:0;bottom:0;
  height:min(90svh,1000px);width:min(50vw,760px);
  display:flex;align-items:flex-end;justify-content:center;will-change:transform;
}
.hero__img{
  width:auto;height:100%;max-width:none;object-fit:contain;object-position:bottom center;
  filter:drop-shadow(0 40px 80px rgba(0,0,0,.85)) contrast(1.04);
  animation:heroIn 1.5s var(--ease-out) both .15s;
}
@keyframes heroIn{from{opacity:0;transform:translate3d(-26px,34px,0) scale(1.035)}to{opacity:1;transform:none}}

/* złote pierścienie */
.rings{position:absolute;pointer-events:none;display:grid;place-items:center}
.rings span{
  position:absolute;border:1px solid rgba(196,145,102,.55);border-radius:50%;
  animation:ringPulse 7s ease-in-out infinite;
}
.rings span:nth-child(2){border-color:rgba(196,145,102,.32);animation-delay:-2.3s}
.rings span:nth-child(3){border-color:rgba(196,145,102,.18);animation-delay:-4.6s}
@keyframes ringPulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.07);opacity:.42}}
.rings--a{right:2%;top:14%;width:clamp(170px,23vw,360px);aspect-ratio:1}
.rings--a span:nth-child(1){inset:0}
.rings--a span:nth-child(2){inset:-13%}
.rings--a span:nth-child(3){inset:-27%}
.rings--b{left:6%;bottom:16%;width:clamp(130px,17vw,270px);aspect-ratio:1}
.rings--b span:nth-child(1){inset:0}
.rings--b span:nth-child(2){inset:-16%}

.hero__copy{margin-left:auto;width:min(100%,50%);padding-inline:var(--gut);
  max-width:calc(var(--wrap)/2 + var(--gut))}
.hero__mark{width:clamp(220px,26vw,500px);height:auto;margin-bottom:clamp(18px,2.4vw,40px)}
.hero__h1{
  font-weight:500;color:var(--brand-lt);
  font-size:clamp(28px,3.55vw,68px);letter-spacing:.005em;line-height:1.12;
}
.hero__h1 .w{display:inline-block;overflow:hidden;vertical-align:bottom;
  line-height:1.12;padding-bottom:.06em}
.hero__h1 .w i{display:block;font-style:normal;transform:translate3d(0,110%,0);
  transition:transform .9s var(--ease-out)}
.is-ready .hero__h1 .w i{transform:none}
.hero__sub{
  font-size:clamp(20px,2.45vw,47px);font-weight:400;color:var(--cream);
  margin:.08em 0 0;line-height:1.16;
}
.hero__lead{
  font-size:clamp(14px,1.72vw,33px);font-weight:400;color:var(--cream-dim);
  margin:clamp(14px,2vw,38px) 0 clamp(20px,2.6vw,44px);
}
.hero__copy [data-anim]{opacity:0;transform:translate3d(0,26px,0);
  transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.is-ready .hero__copy [data-anim]{opacity:1;transform:none}
.is-ready .hero__copy [data-anim="1"]{transition-delay:.15s}
.is-ready .hero__copy [data-anim="2"]{transition-delay:.28s}
.is-ready .hero__copy [data-anim="3"]{transition-delay:.4s}
.is-ready .hero__copy [data-anim="4"]{transition-delay:.52s}
.is-ready .hero__copy [data-anim="5"]{transition-delay:.66s}

.scrollcue{
  position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--cream-fade);
}
.scrollcue__line{width:1px;height:54px;background:linear-gradient(var(--brand-lt),transparent);position:relative;overflow:hidden}
.scrollcue__line::after{content:"";position:absolute;inset:0;background:var(--cream);animation:cue 2.1s var(--ease) infinite}
@keyframes cue{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}
.scrollcue:hover{color:var(--cream)}

/* =========================================================
   TICKER
   ========================================================= */
.ticker{
  border-block:1px solid rgba(248,235,218,.10);background:var(--ink);
  overflow:hidden;padding-block:clamp(12px,1.3vw,22px);
}
.ticker__row{display:flex;align-items:center;gap:clamp(20px,2.6vw,48px);width:max-content;
  animation:tick 34s linear infinite}
.ticker__row span{font-weight:700;letter-spacing:.14em;font-size:clamp(13px,1.35vw,26px);
  color:transparent;-webkit-text-stroke:1px rgba(248,235,218,.55)}
.ticker__row i{color:var(--brand);font-size:clamp(9px,.8vw,14px);font-style:normal}
.ticker:hover .ticker__row{animation-play-state:paused}
@keyframes tick{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* =========================================================
   NAGŁÓWKI SEKCJI
   ========================================================= */
.h-sec{
  font-size:clamp(26px,2.2vw,42px);font-weight:400;color:var(--brand-lt);
  margin-bottom:clamp(16px,1.6vw,28px);position:relative;display:inline-block;
}
.h-sec::after{
  content:"";position:absolute;left:0;bottom:-10px;height:1px;width:100%;
  background:linear-gradient(90deg,var(--brand),transparent);
  transform:scaleX(0);transform-origin:left;transition:transform 1s var(--ease-out) .2s;
}
.h-sec.is-in::after{transform:scaleX(1)}
.h-sec--c{display:block;text-align:center;margin-inline:auto;width:fit-content}
.h-sec--dark{color:#231609}
.h-sec--dark::after{background:linear-gradient(90deg,rgba(0,0,0,.6),transparent)}

/* reveal */
[data-reveal]{opacity:0;transition:opacity var(--dur) var(--ease-out),transform var(--dur) var(--ease-out)}
[data-reveal="up"],[data-reveal=""]{transform:translate3d(0,42px,0)}
[data-reveal="left"]{transform:translate3d(-56px,0,0)}
[data-reveal="right"]{transform:translate3d(56px,0,0)}
[data-reveal="zoom"]{transform:scale(.9)}
[data-reveal].is-in{opacity:1;transform:none}

/* =========================================================
   O MNIE
   ========================================================= */
.omnie{background:var(--black);padding-block:clamp(70px,9vw,150px);position:relative}
.omnie__grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(34px,4.5vw,90px);align-items:center}

.collage{position:relative;aspect-ratio:1/1.05;min-height:340px}
.collage__t{margin:0;position:absolute;border-radius:18px;overflow:hidden;
  box-shadow:0 30px 60px -34px #000;will-change:transform}
.collage__t img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease-out)}
.collage__t:hover img{transform:scale(1.07)}
.collage__t--1{left:0;    top:7%;    width:26%;aspect-ratio:1}
.collage__t--2{left:27%;  top:0;     width:31%;aspect-ratio:1}
.collage__t--3{right:0;   top:4%;    width:26%;aspect-ratio:1}
.collage__t--4{left:0;    top:37%;   width:27%;aspect-ratio:1}
.collage__t--5{left:29%;  bottom:0;  width:30%;aspect-ratio:1}
.collage__t--6{right:1%;  bottom:9%; width:25%;aspect-ratio:1}

.vid{
  margin:0;position:absolute;left:25%;top:17%;width:50%;aspect-ratio:1;border-radius:50%;
  display:grid;place-items:center;overflow:visible;z-index:3;
}
.vid img{width:100%;height:100%;object-fit:cover;border-radius:50%;
  box-shadow:0 30px 70px -26px #000;transition:transform .8s var(--ease-out)}
.vid__rings{position:absolute;inset:-9%;pointer-events:none}
.vid__rings span{position:absolute;border:1px solid rgba(196,145,102,.6);border-radius:50%;inset:0;
  animation:ringPulse 6s ease-in-out infinite}
.vid__rings span:nth-child(2){inset:-8%;border-color:rgba(196,145,102,.3);animation-delay:-3s}

.omnie__txt p{color:var(--cream-dim);max-width:62ch}
.stats{display:flex;flex-wrap:wrap;gap:clamp(20px,3.4vw,64px);margin-top:clamp(24px,3vw,52px)}
.stats li{display:flex;flex-direction:column;gap:4px}
.num{font-weight:900;font-size:clamp(38px,3.75vw,72px);color:var(--brand-lt);line-height:1;
  font-variant-numeric:tabular-nums}
.num--txt{letter-spacing:-.02em}
.stats span{font-weight:400;font-size:clamp(13px,1.55vw,30px);color:var(--brand);line-height:1.18}

/* =========================================================
   O TRENINGACH
   ========================================================= */
.treningi{position:relative;padding:clamp(70px,9vw,150px) 0 clamp(50px,6vw,100px);overflow:hidden;background:var(--ink)}
.treningi__bg{
  position:absolute;inset:-18% 0;opacity:.16;will-change:transform;
  background:url("../img/tlo-klatka@1920.webp") center/cover no-repeat;
  -webkit-mask-image:linear-gradient(#000 12%,transparent 88%);
  mask-image:linear-gradient(#000 12%,transparent 88%);
}
.treningi::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,var(--black),transparent 22%,transparent 78%,var(--black))}
.treningi__grid{position:relative;z-index:2;display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(30px,4.5vw,80px);align-items:center}
.treningi__txt p{color:var(--cream-dim);max-width:60ch}

.place{
  display:inline-flex;align-items:center;gap:clamp(12px,1.4vw,26px);margin-top:clamp(18px,2.4vw,42px);
  color:var(--brand-lt);transition:color .35s,transform .45s var(--ease-out);
}
.place__pin{width:clamp(34px,3.2vw,62px);height:auto;flex:0 0 auto;transition:transform .5s var(--ease-out)}
.place__txt{font-weight:700;font-size:clamp(19px,2.8vw,54px);line-height:1.08}
.place:hover{color:var(--cream)}
.place:hover .place__pin{transform:translateY(-6px) rotate(-6deg)}

.treningi__foto{margin:0;border-radius:var(--r);overflow:hidden;will-change:transform;
  box-shadow:0 50px 90px -48px #000}
.treningi__foto img{width:100%;height:100%;object-fit:cover}

/* =========================================================
   GDZIE TRENUJEMY
   ========================================================= */
.miejsce{position:relative;overflow:hidden;background:var(--black);
  padding-block:clamp(70px,9vw,140px)}
.miejsce__bg{
  position:absolute;inset:-24% 0;will-change:transform;
  background:url("../img/sala-worki@1400.webp") center/cover no-repeat;
  filter:grayscale(1) contrast(1.06);
}
.miejsce::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(64% 76% at 50% 52%,rgba(0,0,0,.82),rgba(0,0,0,.45) 62%,transparent),
    linear-gradient(180deg,var(--black),rgba(0,0,0,.30) 26%,rgba(0,0,0,.34) 70%,var(--black))}
.miejsce__in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:clamp(6px,.8vw,12px)}
.miejsce__kicker{margin:0;font-size:12px;letter-spacing:.34em;text-transform:uppercase;
  color:var(--brand-lt)}
.miejsce__name{margin:0;font-weight:700;line-height:1.05;color:var(--cream);
  font-size:clamp(28px,4.2vw,74px);letter-spacing:.01em;
  text-shadow:0 6px 34px rgba(0,0,0,.8)}
.miejsce .place{margin-top:clamp(10px,1.2vw,20px)}
.miejsce .place__txt{font-size:clamp(17px,2vw,38px);font-weight:500}
.miejsce__note{margin:clamp(12px,1.4vw,24px) 0 0;max-width:46ch;
  font-size:clamp(13px,1vw,19px);color:var(--cream-dim)}

/* =========================================================
   OFERTA
   ========================================================= */
.oferta{background:var(--black);padding-block:clamp(60px,8vw,130px)}
.oferta__lead{text-align:center;max-width:60ch;margin:0 auto;color:var(--cream-dim);
  font-size:clamp(14px,1.1vw,20px)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(20px,2.6vw,52px);margin-top:clamp(30px,4vw,70px)}
.cards--2{grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:1060px;margin-inline:auto;gap:clamp(22px,3.2vw,64px)}
.card{display:flex;flex-direction:column}
.card__media{
  position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:449/560;
  transform-style:preserve-3d;transition:transform .6s var(--ease-out),box-shadow .6s var(--ease-out);
  box-shadow:0 40px 70px -46px #000;
}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out),filter .6s}
.card__media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.18) 0%,rgba(0,0,0,.05) 38%,rgba(0,0,0,.9) 100%);
  transition:opacity .5s;
}
.card:hover .card__media{transform:translateY(-8px)}
.card:hover .card__media img{transform:scale(1.08)}
.card__title{
  position:absolute;left:0;right:0;top:68%;z-index:2;text-align:center;
  transform:translateY(-50%);
  font-size:clamp(20px,2.15vw,41px);font-weight:400;color:var(--cream);
  text-shadow:0 4px 26px rgba(0,0,0,.9),0 1px 3px rgba(0,0,0,.8);
}
.card__lead{
  margin:clamp(-46px,-3vw,-30px) clamp(12px,1.2vw,26px) 0;position:relative;z-index:3;
  background:rgba(10,10,10,.86);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(248,235,218,.09);border-radius:18px;
  padding:clamp(16px,1.5vw,28px);text-align:center;font-size:clamp(13.5px,.95vw,18px);
  color:var(--cream);box-shadow:0 30px 60px -40px #000;
}
.card__more{margin:clamp(14px,1.3vw,22px) clamp(6px,.8vw,18px) 0;text-align:center;
  font-size:clamp(13px,.9vw,17px);color:var(--cream-fade)}

/* =========================================================
   CTA BAND
   ========================================================= */
.band{position:relative;overflow:hidden;padding-block:clamp(70px,9vw,150px);background:var(--ink2)}
.band__bg{
  position:absolute;inset:-22% 0;will-change:transform;opacity:.9;
  background:url("../img/tlo-rekawice@1920.webp") center 42%/cover no-repeat;
  filter:saturate(.85) contrast(1.08);
}
.band::after{content:"";position:absolute;inset:0;
  background:
    radial-gradient(60% 70% at 50% 50%,rgba(0,0,0,.72),rgba(0,0,0,.35) 60%,transparent),
    linear-gradient(180deg,var(--black),rgba(0,0,0,.22) 34%,rgba(0,0,0,.28) 62%,var(--black))}
.band__in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:clamp(18px,2vw,34px);text-align:center}
.band__in{gap:clamp(12px,1.4vw,22px)}
.band__kicker{margin:0;font-size:clamp(15px,1.5vw,30px);letter-spacing:.14em;
  text-transform:uppercase;color:var(--cream);font-weight:500}
.band__sub{margin:0;max-width:52ch;font-size:clamp(13px,1vw,19px);color:var(--cream-dim)}
.band .btn{margin-top:clamp(6px,.8vw,14px)}

/* =========================================================
   OPINIE
   ========================================================= */
.opinie{background:var(--black);padding-block:clamp(60px,8vw,130px);overflow:hidden}
.demo-flag{
  text-align:center;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brand);border:1px dashed rgba(158,111,76,.5);border-radius:999px;
  padding:7px 18px;width:fit-content;margin:0 auto clamp(26px,3vw,50px);
}
.slider{position:relative;margin-top:clamp(20px,2.5vw,40px);padding-inline:clamp(0px,4vw,70px)}
.slider__vp{overflow:hidden}
.slider__track{display:flex;transition:transform .8s var(--ease-out);will-change:transform}
.op{flex:0 0 33.3333%;padding-inline:clamp(10px,1.4vw,30px);text-align:center;
  transition:opacity .6s,filter .6s}
.op__ring{
  display:block;width:clamp(120px,13vw,240px);aspect-ratio:1;margin:0 auto clamp(14px,1.6vw,28px);
  border-radius:50%;padding:7px;position:relative;
  background:linear-gradient(145deg,var(--brand-lt),rgba(158,111,76,.12));
}
.op__ring::after{content:"";position:absolute;inset:-9px;border:1px solid rgba(196,145,102,.4);border-radius:50%}
.op__ring img{width:100%;height:100%;object-fit:cover;border-radius:50%;background:#111}
.op h3{font-size:clamp(17px,1.6vw,30px);font-weight:400;color:var(--cream)}
.op em{display:block;font-style:normal;font-size:clamp(13px,1.15vw,22px);color:var(--brand-lt);margin-bottom:.9em}
.op p{font-size:clamp(13px,.92vw,18px);color:var(--cream-fade);max-width:34ch;margin-inline:auto}

.slider__nav{
  position:absolute;top:clamp(58px,6.5vw,118px);z-index:4;width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;color:var(--cream);
  border:1px solid rgba(248,235,218,.18);background:rgba(0,0,0,.4);
  transition:.4s var(--ease-out);
}
.slider__nav:hover{background:var(--brand);border-color:var(--brand);transform:scale(1.08)}
.slider__nav--prev{left:0}
.slider__nav--next{right:0}
.slider__dots{display:flex;gap:10px;justify-content:center;margin-top:clamp(20px,2.2vw,38px)}
.slider__dots button{width:9px;height:9px;border-radius:50%;background:rgba(248,235,218,.24);transition:.35s}
.slider__dots button[aria-selected="true"]{background:var(--brand-lt);width:26px;border-radius:5px}

/* =========================================================
   CENNIK
   ========================================================= */
.cennik{
  position:relative;min-height:clamp(560px,52vw,880px);display:flex;align-items:center;
  background:#000 url("../img/tlo-klatka@1920.webp") center/cover no-repeat;
  overflow:hidden;isolation:isolate;
}
.cennik::before{content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,var(--black),rgba(0,0,0,.6) 30%,rgba(0,0,0,.72) 70%,var(--black))}
.cennik__foto{
  margin:0;position:absolute;right:clamp(-6%,-1vw,2%);bottom:0;z-index:1;
  height:min(96%,1000px);width:min(52vw,780px);
  display:flex;align-items:flex-end;justify-content:center;will-change:transform;
}
.cennik__foto img{width:auto;height:100%;max-width:none;object-fit:contain;
  object-position:bottom center;filter:drop-shadow(0 40px 80px rgba(0,0,0,.9))}
.cennik__panel{
  position:relative;z-index:2;
  background:linear-gradient(135deg,var(--brand-lt),var(--brand));
  color:#20150b;border-radius:0 var(--r-lg) var(--r-lg) 0;
  width:min(62vw,1200px);margin-right:auto;
  padding:clamp(28px,3.6vw,68px) clamp(24px,3.4vw,64px) clamp(28px,3.6vw,68px) max(var(--gut),calc((100vw - var(--wrap))/2 + var(--gut)));
  box-shadow:0 50px 100px -50px #000;
}
.cennik__panel p{font-weight:300;font-size:clamp(14px,1.25vw,24px);max-width:46ch;color:#23170c}
.price{display:flex;flex-wrap:wrap;gap:clamp(18px,2.2vw,44px);margin-top:clamp(18px,2vw,34px)}
.price li{display:flex;align-items:center;gap:clamp(8px,1vw,16px);flex-wrap:wrap;
  flex:1 1 210px;max-width:100%}
.price__ico{width:clamp(30px,2.4vw,46px);height:auto;color:#20150b;flex:0 0 auto}
.price__lab{width:100%;order:-1;font-size:clamp(11px,.85vw,15px);letter-spacing:.14em;
  text-transform:uppercase;color:rgba(32,21,11,.72);margin-bottom:4px}
.price__val{font-weight:900;font-size:clamp(28px,2.9vw,56px);line-height:1;color:#140d06}
.price__val i{display:block;font-style:normal;font-weight:500;line-height:1.3;
  font-size:clamp(11px,.62vw,13px);letter-spacing:.03em;
  text-transform:uppercase;color:rgba(32,21,11,.78);margin-top:6px}

/* =========================================================
   FORMULARZ
   ========================================================= */
.kontakt{background:var(--black);padding-block:clamp(60px,8vw,130px)}
.kontakt__in{max-width:1260px}
.kontakt__lead{text-align:center;color:var(--cream-dim);margin-bottom:clamp(26px,3vw,50px);
  font-size:clamp(14px,1.1vw,20px)}
.form{display:flex;flex-direction:column;gap:clamp(12px,1.35vw,26px)}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.field{position:relative}
.field input,.field select{
  width:100%;min-height:clamp(58px,6.8vw,131px);border:1px solid transparent;border-radius:999px;
  background:var(--cream);color:#151515;
  padding:0 clamp(26px,3.2vw,60px);font-size:clamp(15px,2.1vw,40px);font-weight:500;
  font-family:inherit;appearance:none;-webkit-appearance:none;
  transition:box-shadow .35s,border-color .35s,background .35s;
}
.field input::placeholder{color:#7a7167}
.field select{color:#151515;padding-right:clamp(52px,5vw,90px);cursor:pointer}
.field select:invalid{color:#7a7167}
.field input:focus,.field select:focus{outline:none;border-color:var(--brand);
  box-shadow:0 0 0 4px rgba(158,111,76,.35)}
.field--sel .field__caret{position:absolute;right:clamp(22px,2.4vw,44px);top:50%;transform:translateY(-50%);
  color:#151515;pointer-events:none;width:clamp(20px,2vw,34px);height:auto}
.field.has-err input,.field.has-err select{border-color:#e0674f;box-shadow:0 0 0 4px rgba(224,103,79,.22)}
.err{display:block;color:#f09480;font-size:13px;padding:6px 0 0 clamp(26px,3.2vw,60px);min-height:0}
.err--zgoda{padding-left:44px;margin-top:-6px}

.check{display:flex;gap:16px;align-items:flex-start;cursor:pointer;
  padding:clamp(6px,.8vw,14px) clamp(6px,1.4vw,22px)}
.check input{position:absolute;opacity:0;width:0;height:0}
.check__box{
  flex:0 0 auto;width:28px;height:28px;border-radius:7px;background:var(--cream);
  display:grid;place-items:center;color:var(--brand);transition:.3s var(--ease-out);margin-top:2px;
}
.check__box svg{opacity:0;transform:scale(.4);transition:.3s var(--ease-out)}
.check input:checked + .check__box{background:var(--brand);color:#fff}
.check input:checked + .check__box svg{opacity:1;transform:none}
.check input:focus-visible + .check__box{outline:2px solid var(--brand-lt);outline-offset:3px}
.check__txt{font-size:clamp(12px,.82vw,15px);color:var(--cream-fade);line-height:1.55}
.form__msg{margin:6px 0 0;text-align:center;font-size:15px;min-height:1.4em}
.form__msg.ok{color:#7fd6a0}
.form__msg.bad{color:#f09480}
.form.is-sending .btn--brand{opacity:.6;pointer-events:none}

/* =========================================================
   GALERIA
   ========================================================= */
.galeria{background:var(--black)}
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.gal__i{position:relative;overflow:hidden;aspect-ratio:4/5;display:block;padding:0}
.gal__i img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out),filter .6s;
  will-change:transform}
.gal__i::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.2);transition:background .5s}
.gal__i::before{
  content:"";position:absolute;z-index:2;left:50%;top:50%;width:54px;height:54px;
  transform:translate(-50%,-50%) scale(.6);opacity:0;border-radius:50%;
  border:1px solid var(--cream);
  background:radial-gradient(circle,rgba(248,235,218,.16),transparent 70%);
  transition:.5s var(--ease-out);
}
.gal__i:hover img{transform:scale(1.09)}
.gal__i:hover::after{background:rgba(0,0,0,.08)}
.gal__i:hover::before{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* lightbox */
.lb{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.94);display:grid;place-items:center;
  padding:24px;opacity:0;transition:opacity .35s}
.lb[hidden]{display:none}
.lb.is-on{opacity:1}
.lb img{max-width:min(92vw,700px);max-height:88vh;width:auto;border-radius:14px;
  box-shadow:0 40px 90px -40px #000}
.lb button{position:absolute;color:var(--cream);font-size:40px;line-height:1;
  width:56px;height:56px;border-radius:50%;transition:.3s;display:grid;place-items:center}
.lb button:hover{background:rgba(248,235,218,.12)}
.lb__x{top:18px;right:18px;font-size:34px}
.lb__p{left:12px;top:50%;transform:translateY(-50%)}
.lb__n{right:12px;top:50%;transform:translateY(-50%)}

/* =========================================================
   STOPKA
   ========================================================= */
.stopka{background:var(--black);padding-top:clamp(50px,7vw,110px);position:relative}
.stopka__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(30px,4vw,70px);align-items:start}
.stopka__c1{display:flex;flex-direction:column;gap:clamp(16px,2vw,30px)}
.wa{color:var(--wa);width:fit-content;transition:transform .45s var(--ease-out),filter .45s}
.wa svg{width:clamp(54px,5.4vw,88px);height:auto;filter:drop-shadow(0 0 22px rgba(37,211,102,.35))}
.wa:hover{transform:scale(1.07) rotate(-4deg)}
.dane{display:flex;flex-direction:column;gap:clamp(8px,.9vw,15px);
  font-size:clamp(16px,2vw,41px);font-weight:400;line-height:1.25}
.dane__name{color:var(--cream)}
.dane a{display:inline-flex;align-items:center;gap:12px;color:var(--cream-dim);transition:color .3s}
.dane a svg{width:clamp(18px,1.3vw,26px);height:auto;color:var(--brand-lt);flex:0 0 auto}
.dane a:hover{color:var(--brand-lt)}
.dane__adr{font-size:clamp(13px,1vw,20px);color:var(--cream-fade)}
.stopka__c2 p{font-size:clamp(13px,.88vw,17px);color:var(--cream-fade);max-width:52ch}

.stopka__mark{display:flex;align-items:center;justify-content:center;gap:clamp(16px,2vw,40px);
  padding-block:clamp(36px,5vw,90px) clamp(24px,3vw,50px)}
.stopka__logo{width:clamp(200px,32vw,620px);height:auto;opacity:.95}
.stopka__glove{width:clamp(56px,8vw,150px);height:auto;color:var(--brand);opacity:.9}
.stopka__bot{display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;
  border-top:1px solid rgba(248,235,218,.09);padding-block:20px;
  font-size:13px;color:var(--cream-fade)}
.stopka__bot p{margin:0}
.stopka__bot a{color:var(--brand-lt)}
.stopka__bot a:hover{text-decoration:underline}

/* pływający WhatsApp */
.wafab{
  position:fixed;right:clamp(14px,2vw,28px);bottom:clamp(14px,2vw,28px);z-index:90;
  width:58px;height:58px;border-radius:50%;display:grid;place-items:center;
  background:var(--wa);color:#04331a;
  box-shadow:0 14px 34px -12px rgba(37,211,102,.6);
  transform:translateY(120px);opacity:0;
  transition:transform .5s var(--ease-out),opacity .4s,box-shadow .4s;
}
.wafab.is-on{transform:none;opacity:1}
.wafab:hover{box-shadow:0 18px 44px -10px rgba(37,211,102,.85);transform:scale(1.07)}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1180px){
  .hero__figure{width:min(62vw,720px);left:-10%}
  .hero__copy{width:min(100%,56%)}
  .cennik__panel{width:min(78vw,900px)}
  .cennik__foto{width:min(46vw,520px);right:-6%}
}

@media (max-width:980px){
  .nav{
    position:fixed;inset:0;background:rgba(3,3,3,.97);backdrop-filter:blur(12px);
    display:grid;place-items:center;
    opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s;
  }
  body.nav-open .nav{opacity:1;visibility:visible}
  .nav ul{flex-direction:column;gap:clamp(18px,4vh,34px);text-align:center}
  .nav a{font-size:clamp(20px,5vw,30px)}
  .burger{display:block}

  .hero{min-height:auto;padding-top:clamp(110px,18vh,170px);
    padding-bottom:calc(min(46svh,460px) + 34px)}
  /* uwaga: bez transform - paralaksa nadpisuje transform na tym elemencie */
  .hero__figure{left:0;right:0;margin-inline:auto;
    width:min(92vw,520px);height:min(46svh,460px)}
  .hero__copy{width:100%;max-width:none;margin:0;text-align:center}
  .hero__mark{margin-inline:auto}
  .hero .btn{width:min(100%,460px)}
  .rings--a{right:-4%;top:6%}
  .rings--b{left:-2%;bottom:24%}
  .scrollcue{display:none}

  .omnie__grid,.treningi__grid,.stopka__grid{grid-template-columns:1fr}
  .collage{aspect-ratio:1/.92;max-width:640px;margin-inline:auto;width:100%}
  .treningi__foto{max-width:520px;margin-inline:auto}
  .cards,.cards--2{grid-template-columns:1fr;max-width:480px;margin-inline:auto}

  .op{flex:0 0 100%}
  .slider{padding-inline:clamp(46px,9vw,70px)}
  .slider__nav{top:clamp(50px,16vw,110px)}

  .cennik{flex-direction:column;padding-top:clamp(50px,8vw,90px);min-height:0}
  .cennik__foto{position:relative;right:auto;width:min(74vw,420px);margin:0 auto -8px;order:2}
  .cennik__panel{width:100%;border-radius:0;order:1;
    padding-inline:var(--gut);text-align:left}
  .price{justify-content:flex-start}

  .gal{grid-template-columns:repeat(2,1fr)}
  .stopka__mark{flex-direction:column}
}

@media (max-width:600px){
  :root{--r:18px}
  .hero{padding-bottom:calc(min(42svh,400px) + 26px)}
  .hero__figure{width:min(96vw,420px);height:min(42svh,400px)}
  .stats{gap:22px;justify-content:space-between}
  .stats li{flex:1 1 30%}
  .field input,.field select{font-size:16px;min-height:56px;padding-inline:22px}
  .err{padding-left:22px}
  .lb__p,.lb__n{font-size:30px;width:46px;height:46px}
  .stopka__bot{justify-content:center;text-align:center}
}

/* =========================================================
   REDUCED MOTION
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
  [data-reveal],.hero__copy [data-anim]{opacity:1!important;transform:none!important}
  .hero__h1 .w i{transform:none!important}
  [data-parallax]{transform:none!important}
  .ticker__row{animation:none}
}

/* druk */
@media print{
  .hdr,.wafab,.scrollcue,.ticker,.progress,.slider__nav,.lb{display:none!important}
  body{background:#fff;color:#000}
}

/* =========================================================
   PODSTRONA DOKUMENTOWA (polityka prywatnosci)
   ========================================================= */
.doc{background:var(--black);padding:clamp(110px,13vh,170px) 0 clamp(50px,7vw,110px)}
.doc__in{max-width:860px}
.doc__kicker{margin:0 0 6px;font-size:12px;letter-spacing:.32em;text-transform:uppercase;
  color:var(--brand-lt)}
.doc__h1{font-size:clamp(28px,3.4vw,58px);font-weight:500;color:var(--cream);
  margin-bottom:clamp(14px,1.6vw,24px);line-height:1.1}
.doc__lead{font-size:clamp(15px,1.15vw,21px);color:var(--cream-dim);
  padding-bottom:clamp(18px,2vw,32px);border-bottom:1px solid rgba(248,235,218,.12)}
.doc h2{font-size:clamp(18px,1.55vw,28px);font-weight:500;color:var(--brand-lt);
  margin:clamp(30px,3.4vw,54px) 0 clamp(10px,1vw,16px)}
.doc p,.doc li{color:var(--cream-dim);font-size:clamp(14px,1vw,18px)}
.doc strong{color:var(--cream);font-weight:500}
.doc a{color:var(--brand-lt);text-decoration:underline;text-underline-offset:3px}
.doc a:hover{color:var(--cream)}
.doc ul{margin:0 0 1.1em;padding-left:1.3em;list-style:disc}
.doc li{margin-bottom:.5em;padding-left:.2em}
.doc li::marker{color:var(--brand)}
.doc__box{
  font-style:normal;margin:0 0 1.1em;padding:clamp(18px,2vw,30px);
  border:1px solid rgba(196,145,102,.3);border-radius:var(--r);
  background:rgba(158,111,76,.07);color:var(--cream-dim);
  font-size:clamp(14px,1vw,18px);line-height:1.75;
}
.doc__ok{
  padding:clamp(14px,1.5vw,22px) clamp(16px,1.7vw,26px);border-radius:16px;
  border:1px solid rgba(196,145,102,.28);background:rgba(158,111,76,.09);
}
.doc__meta{margin-top:clamp(30px,3.4vw,54px);padding-top:clamp(16px,1.8vw,28px);
  border-top:1px solid rgba(248,235,218,.12);font-size:13px;color:var(--cream-fade)}
.doc__back{margin-top:clamp(18px,2vw,32px)}
.doc__back a{text-decoration:none}
.doc .stopka__bot{margin-top:0}

/* w stopce i przy zgodzie link do dokumentu */
.stopka__bot a.doc-link{color:var(--cream-fade);text-decoration:underline;text-underline-offset:3px}
.stopka__bot a.doc-link:hover{color:var(--brand-lt)}
.check__txt a{color:var(--cream);text-decoration:underline;text-underline-offset:2px}
.check__txt a:hover{color:var(--brand-lt)}
.doc + .stopka{padding-top:clamp(18px,2.4vw,40px)}