/* KAMELEON — warstwa immersyjna (TEST). Tylko wygląd i ruch: nie zmienia treści strony. */
.im-on .k-hero{min-height:100vh}
.im-on .k-hero-media{overflow:hidden}
.im-on .k-hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% center;transform-origin:60% 50%;will-change:transform}
.im-on .k-hero-media img{transition:opacity .6s}
.im-on .k-hero-media.im-playing img{opacity:0}
.im-beams{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;mix-blend-mode:screen}
.im-on .k-hero-inner{position:relative;z-index:1;will-change:transform,opacity}
.im-laser{position:fixed;left:0;top:50%;height:3px;width:0;z-index:40;pointer-events:none;background:#ff2a3c;
  box-shadow:0 0 14px 3px rgba(237,21,40,.9),0 0 50px 8px rgba(237,21,40,.45)}

/* słowa w nagłówkach */
.im-w{display:inline-block;overflow:hidden;vertical-align:top;padding:.12em .02em .04em;margin:-.12em -.02em -.04em}
.im-w>span{display:inline-block;transform:translateY(115%);transition:transform 1s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--i,0)*55ms)}
.im-in .im-w>span{transform:none}

/* wejście elementów hero */
.im-on .k-hero-lead,.im-on .k-hero-actions,.im-on .k-stats{opacity:0;transform:translateY(24px);transition:opacity .9s,transform .9s cubic-bezier(.16,1,.3,1)}
.im-hero-in .k-hero-lead{opacity:1;transform:none;transition-delay:.55s}
.im-hero-in .k-hero-actions{opacity:1;transform:none;transition-delay:.7s}
.im-hero-in .k-stats{opacity:1;transform:none;transition-delay:.9s}

/* licznik — oryginalny tekst zostaje w kodzie, liczba jest tylko nakładką */
.im-count{position:relative;display:block}
.im-count>.im-num{position:absolute;left:0;top:0;white-space:nowrap}
.im-count.im-counting{color:transparent!important}
.im-count.im-counting>.im-num{color:#fff}

/* pasek postępu */
.im-progress{position:fixed;right:22px;top:50%;width:2px;height:28vh;transform:translateY(-50%);background:rgba(255,255,255,.14);z-index:25;pointer-events:none}
.im-progress i{position:absolute;left:0;top:0;width:2px;height:0;background:#ed1528;box-shadow:0 0 8px #ed1528}

/* przesuwany napis */
.im-marq{overflow:hidden;white-space:nowrap;padding:clamp(28px,4vw,60px) 0;pointer-events:none;user-select:none}
.im-marq div{display:inline-block;font-size:clamp(56px,8vw,140px);font-weight:900;letter-spacing:-.02em;text-transform:uppercase;line-height:1;
  color:rgba(255,255,255,.07);will-change:transform}
.im-marq b{color:#ed1528;margin:0 .3em;opacity:.9}

/* karty oferty: odsłanianie i pochylenie */
.im-on .k-card.k-reveal{clip-path:inset(14% 0 0 0 round 20px);transition:clip-path 1.2s cubic-bezier(.16,1,.3,1),opacity .9s,transform .9s,border-color .25s}
.im-on .k-card.k-reveal.is-in{clip-path:inset(0 0 0 0 round 20px)}
.im-on .k-card .k-card-media video,.im-on .k-card .k-card-media img{transform:scale(1.12);transition:transform 1.6s cubic-bezier(.16,1,.3,1)}
.im-on .k-card.is-in .k-card-media video,.im-on .k-card.is-in .k-card-media img{transform:scale(1)}
.im-tilt{transform-style:preserve-3d}
.im-tilt.is-in{transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0))!important;transition:transform .35s ease-out,clip-path 1.2s cubic-bezier(.16,1,.3,1),border-color .25s!important}
.im-tilt .im-shine{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:0;transition:opacity .3s;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.14),transparent 45%)}
.im-tilt:hover .im-shine{opacity:1}

/* mapping krok po kroku */
.im-map{position:relative;height:340vh}
.im-map-stick{position:sticky;top:0;height:100vh;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.25fr);gap:clamp(28px,5vw,88px);align-items:center;
  max-width:var(--k-wrap,1320px);margin:0 auto;padding:110px var(--k-gutter,5vw) 40px}
.im-map .k-h2{margin:0 0 22px;font-size:clamp(30px,3.4vw,50px)}
.im-map p{margin:0 0 30px;max-width:460px;font-size:17px;line-height:1.6;color:var(--k-muted,#b3b3b8)}
.im-steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.im-steps li{position:relative;padding:0 0 0 64px;font-size:14px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.35);transition:color .3s}
.im-steps li:before{content:"";position:absolute;left:0;top:50%;width:46px;height:2px;background:rgba(255,255,255,.15)}
.im-steps li i{position:absolute;left:0;top:50%;height:2px;width:0;max-width:46px;background:#ed1528;box-shadow:0 0 8px #ed1528}
.im-steps li.on{color:#fff}
.im-stage{position:relative;aspect-ratio:4/3;max-height:76vh;width:100%;border-radius:22px;overflow:hidden;background:#000;border:1px solid var(--k-line,#232327);box-shadow:0 40px 120px rgba(0,0,0,.6)}
.im-on .im-stage img,.im-on .im-stage video{position:absolute!important;inset:0;width:100%!important;height:100%!important;max-width:none;object-fit:cover;display:block;margin:0}
.im-scan{position:absolute;top:0;bottom:0;width:4px;margin-left:-2px;background:#fff;z-index:5;display:none;
  box-shadow:0 0 18px 6px rgba(237,21,40,.85),0 0 60px 20px rgba(237,21,40,.35)}
.im-stage-label{position:absolute;left:20px;bottom:18px;z-index:6;font-size:12px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;
  background:rgba(5,5,5,.7);padding:9px 14px;border-radius:999px;backdrop-filter:blur(6px)}

/* wesele: wideo powiększa się przy przewijaniu */
.im-on .k-wedding-media{transform:scale(var(--ws,1));transition:none}
/* realizacje: paralaksa */
.im-on .k-feature img{transform:translateY(var(--py,0)) scale(1.12)}
.im-on .k-feature:hover img{transform:translateY(var(--py,0)) scale(1.15)}
.im-on .k-project-grid .k-project.is-in{transform:translateY(var(--py,0))}
.im-on .k-project-grid .k-project.is-in:hover{transform:translateY(calc(var(--py,0px) - 4px))}

/* oznaczenie wersji testowej */
.im-badge{position:fixed;left:16px;bottom:16px;z-index:60;font:800 11px/1 Inter,Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase;
  color:#fff;background:#ed1528;padding:9px 13px;border-radius:999px;box-shadow:0 6px 20px rgba(0,0,0,.4)}

@media (max-width:900px){
  .im-map{height:240vh}
  .im-map-stick{grid-template-columns:1fr;align-content:center;gap:22px;padding-top:100px}
  .im-map p{display:none}
  .im-steps{grid-template-columns:repeat(4,1fr);gap:8px}
  .im-steps li{padding:12px 0 0;font-size:10px;letter-spacing:.08em}
  .im-steps li:before,.im-steps li i{top:0}
  .im-steps li i{max-width:none}
  .im-steps li:before{width:auto;right:6px}
  .im-stage{aspect-ratio:4/3;max-height:52vh}
  .im-progress{display:none}
}
@media (prefers-reduced-motion:reduce){
  .im-w>span{transform:none;transition:none}
  .im-on .k-hero-lead,.im-on .k-hero-actions,.im-on .k-stats{opacity:1;transform:none}
}
.im-on .k-project-grid .k-project.is-in{transition:opacity .8s,border-color .25s}

/* ---------- mapa realizacji ---------- */
.im-mapa{padding-top:clamp(40px,6vw,90px);padding-bottom:clamp(40px,6vw,90px)}
.im-mapa-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,80px);align-items:center}
.im-mapa .k-h2{margin:0 0 20px}
.im-mapa-lead{margin:0 0 28px;max-width:460px;font-size:17px;line-height:1.6;color:var(--k-muted,#b3b3b8)}
.im-panel{border:1px solid var(--k-line,#232327);border-radius:20px;padding:24px 26px;background:rgba(255,255,255,.02);min-height:250px}
.im-panel-city{font-size:28px;font-weight:900;text-transform:uppercase;letter-spacing:-.01em}
.im-panel-n{font-size:13px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#ed1528;margin:6px 0 16px}
.im-panel ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.im-panel a{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.07);color:#fff;text-decoration:none;font-size:15px;font-weight:600}
.im-panel a span{color:var(--k-dim,#8a8a92);font-weight:500;white-space:nowrap}
.im-panel a:hover{color:#ed1528}
.im-online{display:inline-flex;margin-top:18px;font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#fff;text-decoration:none;
  border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:10px 16px}
.im-online:hover{border-color:#ed1528;color:#ed1528}
.im-map-box{position:relative;width:100%;max-width:640px;margin-left:auto;aspect-ratio:641/650}
.im-map-box img{position:absolute;inset:0;width:100%;height:100%}
.im-map-box canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.im-city{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;border:0;background:none;padding:0;cursor:pointer;z-index:2}
.im-city i{position:absolute;left:50%;top:50%;width:var(--s,12px);height:var(--s,12px);transform:translate(-50%,-50%) scale(var(--on,0));border-radius:50%;background:#ed1528;
  box-shadow:0 0 0 4px rgba(237,21,40,.25),0 0 22px 6px rgba(237,21,40,.7);transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
.im-city:after{content:"";position:absolute;left:50%;top:50%;width:var(--s,12px);height:var(--s,12px);border-radius:50%;border:2px solid #ed1528;transform:translate(-50%,-50%) scale(1);opacity:0}
.im-city.lit:after{animation:imPulse 2.4s ease-out infinite}
@keyframes imPulse{0%{transform:translate(-50%,-50%) scale(1);opacity:.8}100%{transform:translate(-50%,-50%) scale(4);opacity:0}}
.im-city b{position:absolute;left:50%;top:calc(50% + 14px);transform:translateX(-50%);font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;color:#fff;
  opacity:var(--on,0);transition:opacity .4s;text-shadow:0 2px 8px #000}
.im-city.sel i{background:#fff;box-shadow:0 0 0 5px rgba(237,21,40,.6),0 0 30px 10px rgba(237,21,40,.8)}
@media (max-width:900px){.im-mapa-grid{grid-template-columns:1fr}.im-map-box{margin:0 auto;order:-1}.im-badge{bottom:auto;top:84px}}
