/* Animacje sekcji „Dla kogo” (.me-anim-tile--<slug>) — przeniesione 1:1 z bloków style w
   templates/components/dla-kogo/*.php (audyt wydajności #6b: -116 KB HTML strony głównej).
   Ładowane linkiem z ME360_DlaKogo_Shortcode::assets(); nowa animacja = nowy blok tutaj. */

/* ── krzywa-kosztow ── */
.me-anim-tile--krzywa-kosztow,.me-anim-tile--krzywa-kosztow *{margin:0;padding:0;box-sizing:border-box}
.me-anim-tile--krzywa-kosztow{
  width:100%;max-width:520px;margin:0 auto;aspect-ratio:1/1.12;
  font-family:'Clash Display','ClashDisplay',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);border-radius:24px;
  position:relative;overflow:hidden;container-type:inline-size;
}
.me-anim-tile--krzywa-kosztow::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;
}
.me-anim-tile--krzywa-kosztow::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
}
.me-anim-tile--krzywa-kosztow .me-anim-fit{position:absolute;inset:0}
.me-anim-tile--krzywa-kosztow .phone{
  position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:64%;height:90%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--krzywa-kosztow .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--krzywa-kosztow .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--krzywa-kosztow .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--krzywa-kosztow .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--krzywa-kosztow .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--krzywa-kosztow .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--krzywa-kosztow .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--krzywa-kosztow .app{flex:1;display:flex;flex-direction:column;padding:15% 6% 6%;gap:2%}
.me-anim-tile--krzywa-kosztow .app-head{font-size:clamp(10px,5.2cqw,15px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:5px}
.me-anim-tile--krzywa-kosztow .app-head .dot{width:.5em;height:.5em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--krzywa-kosztow .app-sub{font-size:clamp(8px,4cqw,12px);color:#8fa0ad;font-weight:400;margin-top:-1%}
.me-anim-tile--krzywa-kosztow .stage{flex:1;display:flex;align-items:center;justify-content:center;min-height:0}
.me-anim-tile--krzywa-kosztow .app-card{
  background:rgba(51,229,189,.08);border:1px solid rgba(51,229,189,.22);border-radius:10px;
  padding:4% 5%;font-size:clamp(7px,3.7cqw,12px);color:#cde9df;font-weight:500;line-height:1.25;
  display:flex;align-items:center;gap:5px;white-space:nowrap;
}
.me-anim-tile--krzywa-kosztow .app-card b{white-space:nowrap}
.me-anim-tile--krzywa-kosztow .app-card b{color:#33e5bd;font-weight:700}
.me-anim-tile--krzywa-kosztow .app-card .up{color:#33e5bd;font-weight:700}
.me-anim-tile--krzywa-kosztow .p1-svg{width:100%;height:100%}
.me-anim-tile--krzywa-kosztow .p1-grid line{stroke:rgba(255,255,255,.07);stroke-width:1}
.me-anim-tile--krzywa-kosztow .p1-curve{
  fill:none;stroke:#33e5bd;stroke-width:9;stroke-linecap:round;
  stroke-dasharray:520;stroke-dashoffset:520;
  filter:drop-shadow(0 0 7px rgba(51,229,189,.6));
  animation:me-dk-p1draw 4s cubic-bezier(.4,0,.2,1) infinite;
}
@keyframes me-dk-p1draw{0%{stroke-dashoffset:520}45%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:0}}
.me-anim-tile--krzywa-kosztow .p1-dot{fill:#33e5bd;opacity:0;animation:me-dk-p1dot 4s ease-out infinite}
@keyframes me-dk-p1dot{0%,42%{opacity:0}52%{opacity:1;r:11}62%{r:8}72%{r:11}86%{opacity:1;r:9}100%{opacity:0}}
.me-anim-tile--krzywa-kosztow .p1-chip{opacity:0;animation:me-dk-p1chip 4s ease infinite}
@keyframes me-dk-p1chip{0%,40%{opacity:0;transform:translateY(6px)}55%,88%{opacity:1;transform:translateY(0)}100%{opacity:0}}
.me-anim-tile--krzywa-kosztow .p1-chip rect{fill:#112330;stroke:rgba(51,229,189,.35);stroke-width:2}
.me-anim-tile--krzywa-kosztow .p1-chip text{fill:#33e5bd;font-family:'Clash Display','ClashDisplay',sans-serif;font-weight:600;font-size:26px}
@media (prefers-reduced-motion:reduce){
  .me-anim-tile--krzywa-kosztow .p1-curve{animation:none;stroke-dashoffset:0}
  .me-anim-tile--krzywa-kosztow .p1-dot{animation:none;opacity:1}
  .me-anim-tile--krzywa-kosztow .p1-chip{animation:none;opacity:1;transform:none}
}

/* ── dk-klient-2 ── */
.me-anim-tile--dk-klient-2,.me-anim-tile--dk-klient-2 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-klient-2{
  aspect-ratio:1/1.12;
  width:100%;
  max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;
  position:relative;
  overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-klient-2::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-klient-2::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-klient-2 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;
  background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;
  z-index:2;
}
.me-anim-tile--dk-klient-2 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-klient-2 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-klient-2 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-klient-2 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-klient-2 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-klient-2 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-klient-2 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-klient-2 .app{flex:1;display:flex;flex-direction:column;padding:16% 8% 6%;gap:4%}
.me-anim-tile--dk-klient-2 .app-head{font-size:clamp(11px,2.2cqw,16px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-klient-2 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-klient-2 .app-sub{font-size:clamp(9px,1.8cqw,13px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-klient-2 .stage{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;position:relative}

/* ═══════ KARTY OPCJI + KURSOR DOTYKOWY ═══════ */
.me-anim-tile--dk-klient-2 .v3-list{width:100%;display:flex;flex-direction:column;gap:7%;justify-content:center;height:100%}
.me-anim-tile--dk-klient-2 .opt{
  background:#112330;border:2px solid rgba(51,229,189,.18);border-radius:14px;
  display:flex;flex-direction:column;align-items:stretch;gap:6%;
  padding:5% 7%;position:relative;
}
.me-anim-tile--dk-klient-2 .o-top{display:flex;align-items:center;gap:6%}
.me-anim-tile--dk-klient-2 .o-top .b-ico{flex-shrink:0;width:13%}
.me-anim-tile--dk-klient-2 .b-ico svg{width:100%;height:auto;display:block}
.me-anim-tile--dk-klient-2 .b-shell{fill:#0d1e2c;stroke:rgba(51,229,189,.45);stroke-width:6}
.me-anim-tile--dk-klient-2 .b-tip{fill:rgba(51,229,189,.45)}
.me-anim-tile--dk-klient-2 .b-fill{fill:#33e5bd}
.me-anim-tile--dk-klient-2 .o-name{font-size:clamp(9px,1.9cqw,13px);font-weight:600;color:#e2e8f4}
.me-anim-tile--dk-klient-2 .o-spec{font-size:clamp(8px,1.6cqw,11px);color:#8fa0ad;font-weight:400}
.me-anim-tile--dk-klient-2 .o-badge{
  position:absolute;top:-12%;right:4%;
  background:#33e5bd;color:#091722;font-weight:700;
  font-size:clamp(7px,1.5cqw,10px);
  padding:.4em .9em;border-radius:999px;
  opacity:0;transform:scale(.6);
  box-shadow:0 4px 14px rgba(51,229,189,.4);
  white-space:nowrap;z-index:3;
}
.me-anim-tile--dk-klient-2 .bars{display:flex;flex-direction:column;gap:4px}
.me-anim-tile--dk-klient-2 .bar{height:5px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.me-anim-tile--dk-klient-2 .bar i{display:block;height:100%;border-radius:99px;background:#33e5bd;opacity:.55}
.me-anim-tile--dk-klient-2 .opt-a .bar:nth-child(1) i{width:45%}
.me-anim-tile--dk-klient-2 .opt-a .bar:nth-child(2) i{width:35%}
.me-anim-tile--dk-klient-2 .opt-b .bar i{opacity:1;box-shadow:0 0 8px rgba(51,229,189,.5)}
.me-anim-tile--dk-klient-2 .cursor{
  position:absolute;z-index:9;width:11%;aspect-ratio:1;border-radius:50%;
  background:rgba(255,255,255,.28);
  border:2px solid rgba(255,255,255,.75);
  box-shadow:0 2px 12px rgba(0,0,0,.4);
  pointer-events:none;
}
.me-anim-tile--dk-klient-2 .cursor::after{content:'';position:absolute;inset:26%;border-radius:50%;background:rgba(255,255,255,.85)}

/* ═══════ ANIMACJE (loop 7 s) ═══════ */
.me-anim-tile--dk-klient-2 .opt-a{animation:medk_dk_klient_2_0 7s ease-in-out infinite}
@keyframes medk_dk_klient_2_0{
  0%,14%{transform:scale(1);border-color:rgba(51,229,189,.18)}
  20%,36%{transform:scale(1.05);border-color:rgba(51,229,189,.55)}
  44%,100%{transform:scale(1);border-color:rgba(51,229,189,.18)}
}
.me-anim-tile--dk-klient-2 .opt-b{animation:medk_dk_klient_2_1 7s ease-in-out infinite}
@keyframes medk_dk_klient_2_1{
  0%,52%{transform:scale(1);border-color:rgba(51,229,189,.18);box-shadow:none;background:#112330}
  60%,90%{transform:scale(1.06);border-color:#33e5bd;box-shadow:0 0 26px rgba(51,229,189,.35);background:#12312e}
  98%,100%{transform:scale(1);border-color:rgba(51,229,189,.18);box-shadow:none;background:#112330}
}
.me-anim-tile--dk-klient-2 .opt-b .o-badge{animation:medk_dk_klient_2_2 7s ease infinite}
@keyframes medk_dk_klient_2_2{
  0%,58%{opacity:0;transform:scale(.6)}
  64%,90%{opacity:1;transform:scale(1)}
  96%,100%{opacity:0;transform:scale(.6)}
}
.me-anim-tile--dk-klient-2 .opt-b .bar:nth-child(1) i{animation:medk_dk_klient_2_3 7s ease infinite}
.me-anim-tile--dk-klient-2 .opt-b .bar:nth-child(2) i{animation:medk_dk_klient_2_4 7s ease infinite}
@keyframes medk_dk_klient_2_3{0%,54%{width:30%}64%,92%{width:88%}100%{width:30%}}
@keyframes medk_dk_klient_2_4{0%,56%{width:25%}66%,92%{width:76%}100%{width:25%}}
.me-anim-tile--dk-klient-2 .cursor{animation:medk_dk_klient_2_5 7s ease-in-out infinite}
@keyframes medk_dk_klient_2_5{
  0%{left:70%;top:96%;opacity:0;transform:scale(1)}
  10%{left:48%;top:20%;opacity:1;transform:scale(1)}
  16%{transform:scale(.72)}
  22%{transform:scale(1)}
  36%{left:48%;top:20%}
  50%{left:48%;top:66%;transform:scale(1)}
  56%{transform:scale(.72)}
  62%{transform:scale(1)}
  86%{left:48%;top:66%;opacity:1}
  94%,100%{left:62%;top:96%;opacity:0}
}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-klient-2 *{animation:none!important;transition:none!important}}

/* ── dk-klient-3 ── */
.me-anim-tile--dk-klient-3,.me-anim-tile--dk-klient-3 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-klient-3{
  aspect-ratio:1/1.12;
  width:100%;
  max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;
  position:relative;
  overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-klient-3::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-klient-3::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-klient-3 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;
  background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;
  z-index:2;
}
.me-anim-tile--dk-klient-3 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-klient-3 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-klient-3 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-klient-3 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-klient-3 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-klient-3 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-klient-3 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-klient-3 .app{flex:1;display:flex;flex-direction:column;padding:21% 8% 6%;gap:4%}
.me-anim-tile--dk-klient-3 .app-head{font-size:clamp(11px,2.2cqw,16px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-klient-3 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-klient-3 .app-sub{font-size:clamp(9px,1.8cqw,13px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-klient-3 .stage{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;position:relative}

/* ═══════ CHECKLISTA ═══════ */
.me-anim-tile--dk-klient-3 .steps{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;gap:4.5%}
.me-anim-tile--dk-klient-3 .step{
  display:flex;align-items:center;gap:6%;
  background:#112330;border:2px solid rgba(51,229,189,.14);border-radius:12px;
  padding:3.6% 6%;position:relative;
}
.me-anim-tile--dk-klient-3 .step .txt{font-size:clamp(9px,1.9cqw,13px);font-weight:500;color:#c7d3dd}
.me-anim-tile--dk-klient-3 .step .box{
  flex-shrink:0;width:9%;aspect-ratio:1;border-radius:30%;
  border:2px solid rgba(51,229,189,.4);background:#0d1e2c;
  display:flex;align-items:center;justify-content:center;
}
.me-anim-tile--dk-klient-3 .step .box svg{width:70%;height:70%}
.me-anim-tile--dk-klient-3 .step .box .tick{fill:none;stroke:#091722;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:20;stroke-dashoffset:20}

/* ═══════ ANIMACJA (loop 9 s, zsynchronizowana):
   wszystkie kroki widoczne i odznaczone od startu,
   zaznaczają się po kolei (6/15/24/33/42%),
   trzymają do 86%, po czym WSZYSTKIE resetują się
   RAZEM (88–91%) i pętla rusza od nowa. ═══════ */

/* — krok 1 — */
.me-anim-tile--dk-klient-3 .s1{animation:medk_dk_klient_3_5 9s ease infinite}
.me-anim-tile--dk-klient-3 .s1 .box{animation:medk_dk_klient_3_0 9s ease infinite}
.me-anim-tile--dk-klient-3 .s1 .tick{animation:medk_dk_klient_3_10 9s ease infinite}
@keyframes medk_dk_klient_3_5{0%,5%{border-color:rgba(51,229,189,.14);background:#112330;transform:scale(1)}7%{border-color:rgba(51,229,189,.6);background:#12312e;transform:scale(1.04)}10%,86%{border-color:rgba(51,229,189,.34);background:#112c2c;transform:scale(1)}91%,100%{border-color:rgba(51,229,189,.14);background:#112330;transform:scale(1)}}
@keyframes medk_dk_klient_3_0{0%,5%{background:#0d1e2c;border-color:rgba(51,229,189,.4);box-shadow:none}9%,86%{background:#33e5bd;border-color:#33e5bd;box-shadow:0 0 10px rgba(51,229,189,.55)}91%,100%{background:#0d1e2c;border-color:rgba(51,229,189,.4);box-shadow:none}}
@keyframes medk_dk_klient_3_10{0%,5%{stroke-dashoffset:20}10%,86%{stroke-dashoffset:0}91%,100%{stroke-dashoffset:20}}

/* — krok 2 — */
.me-anim-tile--dk-klient-3 .s2{animation:medk_dk_klient_3_6 9s ease infinite}
.me-anim-tile--dk-klient-3 .s2 .box{animation:medk_dk_klient_3_1 9s ease infinite}
.me-anim-tile--dk-klient-3 .s2 .tick{animation:medk_dk_klient_3_11 9s ease infinite}
@keyframes medk_dk_klient_3_6{0%,14%{border-color:rgba(51,229,189,.14);background:#112330;transform:scale(1)}16%{border-color:rgba(51,229,189,.6);background:#12312e;transform:scale(1.04)}19%,86%{border-color:rgba(51,229,189,.34);background:#112c2c;transform:scale(1)}91%,100%{border-color:rgba(51,229,189,.14);background:#112330;transform:scale(1)}}
@keyframes medk_dk_klient_3_1{0%,14%{background:#0d1e2c;border-color:rgba(51,229,189,.4);box-shadow:none}18%,86%{background:#33e5bd;border-color:#33e5bd;box-shadow:0 0 10px rgba(51,229,189,.55)}91%,100%{background:#0d1e2c;border-color:rgba(51,229,189,.4);box-shadow:none}}
@keyframes medk_dk_klient_3_11{0%,14%{stroke-dashoffset:20}19%,86%{stroke-dashoffset:0}91%,100%{stroke-dashoffset:20}}

/* — krok 3 — */
.me-anim-tile--dk-klient-3 .s3{animation:medk_dk_klient_3_7 9s ease infinite}
.me-anim-tile--dk-klient-3 .s3 .box{animation:medk_dk_klient_3_2 9s ease infinite}
.me-anim-tile--dk-klient-3 .s3 .tick{animation:medk_dk_klient_3_12 9s ease infinite}
@keyframes medk_dk_klient_3_7{0%,23%{border-color:rgba(51,229,189,.14);background:#112330;transform:scale(1)}25%{border-color:rgba(51,229,189,.6);background:#12312e;transform:scale(1.04)}28%,86%{border-color:rgba(51,229,189,.34);background:#112c2c;transform:scale(1)}91%,100%{border-color:rgba(51,229,189,.14);background:#112330;transform:scale(1)}}
@keyframes medk_dk_klient_3_2{0%,23%{background:#0d1e2c;border-color:rgba(51,229,189,.4);box-shadow:none}27%,86%{background:#33e5bd;border-color:#33e5bd;box-shadow:0 0 10px rgba(51,229,189,.55)}91%,100%{background:#0d1e2c;border-color:rgba(51,229,189,.4);box-shadow:none}}
@keyframes medk_dk_klient_3_12{0%,23%{stroke-dashoffset:20}28%,86%{stroke-dashoffset:0}91%,100%{stroke-dashoffset:20}}

/* — krok 4 — */
.me-anim-tile--dk-klient-3 .s4{animation:medk_dk_klient_3_8 9s ease infinite}
.me-anim-tile--dk-klient-3 .s4 .box{animation:medk_dk_klient_3_3 9s ease infinite}
.me-anim-tile--dk-klient-3 .s4 .tick{animation:medk_dk_klient_3_13 9s ease infinite}
@keyframes medk_dk_klient_3_8{0%,32%{border-color:rgba(51,229,189,.14);background:#112330;transform:scale(1)}34%{border-color:rgba(51,229,189,.6);background:#12312e;transform:scale(1.04)}37%,86%{border-color:rgba(51,229,189,.34);background:#112c2c;transform:scale(1)}91%,100%{border-color:rgba(51,229,189,.14);background:#112330;transform:scale(1)}}
@keyframes medk_dk_klient_3_3{0%,32%{background:#0d1e2c;border-color:rgba(51,229,189,.4);box-shadow:none}36%,86%{background:#33e5bd;border-color:#33e5bd;box-shadow:0 0 10px rgba(51,229,189,.55)}91%,100%{background:#0d1e2c;border-color:rgba(51,229,189,.4);box-shadow:none}}
@keyframes medk_dk_klient_3_13{0%,32%{stroke-dashoffset:20}37%,86%{stroke-dashoffset:0}91%,100%{stroke-dashoffset:20}}

/* — krok 5 — */
.me-anim-tile--dk-klient-3 .s5{animation:medk_dk_klient_3_9 9s ease infinite}
.me-anim-tile--dk-klient-3 .s5 .box{animation:medk_dk_klient_3_4 9s ease infinite}
.me-anim-tile--dk-klient-3 .s5 .tick{animation:medk_dk_klient_3_14 9s ease infinite}
@keyframes medk_dk_klient_3_9{0%,41%{border-color:rgba(51,229,189,.14);background:#112330;transform:scale(1)}43%{border-color:rgba(51,229,189,.6);background:#12312e;transform:scale(1.04)}46%,86%{border-color:rgba(51,229,189,.34);background:#112c2c;transform:scale(1)}91%,100%{border-color:rgba(51,229,189,.14);background:#112330;transform:scale(1)}}
@keyframes medk_dk_klient_3_4{0%,41%{background:#0d1e2c;border-color:rgba(51,229,189,.4);box-shadow:none}45%,86%{background:#33e5bd;border-color:#33e5bd;box-shadow:0 0 10px rgba(51,229,189,.55)}91%,100%{background:#0d1e2c;border-color:rgba(51,229,189,.4);box-shadow:none}}
@keyframes medk_dk_klient_3_14{0%,41%{stroke-dashoffset:20}46%,86%{stroke-dashoffset:0}91%,100%{stroke-dashoffset:20}}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-klient-3 *{animation:none!important;transition:none!important}}

/* ── dk-klient-4 ── */
.me-anim-tile--dk-klient-4,.me-anim-tile--dk-klient-4 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-klient-4{
  aspect-ratio:1/1.12;
  width:100%;
  max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;
  position:relative;
  overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-klient-4::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-klient-4::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-klient-4 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;
  background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;
  z-index:2;
}
.me-anim-tile--dk-klient-4 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-klient-4 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-klient-4 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-klient-4 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-klient-4 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-klient-4 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-klient-4 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-klient-4 .app{flex:1;display:flex;flex-direction:column;padding:16% 8% 6%;gap:3%}
.me-anim-tile--dk-klient-4 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-klient-4 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-klient-4 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-klient-4 .stage{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;position:relative}

/* ═══════ CZAT ═══════ */
.me-anim-tile--dk-klient-4 .chat{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;gap:2.4%}
.me-anim-tile--dk-klient-4 .msg{display:flex;gap:4%;align-items:flex-end;max-width:96%}
.me-anim-tile--dk-klient-4 .msg.right{align-self:flex-end;flex-direction:row-reverse}
.me-anim-tile--dk-klient-4 .msg .ava{
  flex-shrink:0;width:11%;aspect-ratio:1;border-radius:50%;
  background:#1a2b3d;border:2px solid rgba(51,229,189,.3);
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(8px,1.6cqw,11px);font-weight:700;color:#33e5bd;
}
.me-anim-tile--dk-klient-4 .msg .ava.me360{background:#0d2b26;border-color:#33e5bd}
.me-anim-tile--dk-klient-4 .msg .bub{
  background:#112330;border:1.5px solid rgba(51,229,189,.16);
  border-radius:14px 14px 14px 4px;
  padding:.55em .9em;min-width:0;
}
.me-anim-tile--dk-klient-4 .msg.right .bub{background:#33e5bd;border-color:#33e5bd;border-radius:14px 14px 4px 14px;padding:.55em 1.1em;flex-shrink:0}
.me-anim-tile--dk-klient-4 .msg .who{font-size:clamp(8px,1.55cqw,10px);color:#7e93a3;font-weight:500;margin-bottom:2px}
.me-anim-tile--dk-klient-4 .msg .tx{font-size:clamp(9.5px,2.05cqw,13.5px);color:#dbe6ee;font-weight:400;line-height:1.45}
.me-anim-tile--dk-klient-4 .msg .tx .emj{display:inline-block;font-size:1em;line-height:1;vertical-align:-0.15em}
.me-anim-tile--dk-klient-4 .msg.right .tx{color:#091722;font-weight:500;white-space:nowrap}
.me-anim-tile--dk-klient-4 .msg.right .who{display:none}
.me-anim-tile--dk-klient-4 .typing{display:flex;gap:4px;padding:5% 6%}
.me-anim-tile--dk-klient-4 .typing i{width:.42em;height:.42em;border-radius:50%;background:#7e93a3;animation:medk_dk_klient_4_6 1s ease infinite}
.me-anim-tile--dk-klient-4 .typing i:nth-child(2){animation-delay:.15s}
.me-anim-tile--dk-klient-4 .typing i:nth-child(3){animation-delay:.3s}
@keyframes medk_dk_klient_4_6{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-30%);opacity:1}}

/* ═══════ ANIMACJA (loop 11 s):
   m1@4%, m2@13%, typing 21–33%, m3@35%, karta@46%,
   pełny widok trzyma się od ~50% do 92% (ok. 4,5 s
   na przeczytanie), po czym wszystko znika RAZEM. ═══════ */
.me-anim-tile--dk-klient-4 .m1{opacity:0;transform:translateY(30%);animation:medk_dk_klient_4_0 11s cubic-bezier(.2,0,.2,1) infinite}
.me-anim-tile--dk-klient-4 .m2{opacity:0;transform:translateY(30%);animation:medk_dk_klient_4_1 11s cubic-bezier(.2,0,.2,1) infinite}
.me-anim-tile--dk-klient-4 .ty{opacity:0;position:absolute;left:15%;top:0;background:#112330;border:1.5px solid rgba(51,229,189,.16);border-radius:14px 14px 14px 4px;animation:medk_dk_klient_4_5 11s ease infinite}
.me-anim-tile--dk-klient-4 .m3{opacity:0;transform:translateY(30%);animation:medk_dk_klient_4_2 11s cubic-bezier(.2,0,.2,1) infinite}
.me-anim-tile--dk-klient-4 .m3-wrap{position:relative}
@keyframes medk_dk_klient_4_0{0%,3%{opacity:0;transform:translateY(30%)}6%,92%{opacity:1;transform:translateY(0)}96%,100%{opacity:0;transform:translateY(30%)}}
@keyframes medk_dk_klient_4_1{0%,12%{opacity:0;transform:translateY(30%)}15%,92%{opacity:1;transform:translateY(0)}96%,100%{opacity:0;transform:translateY(30%)}}
@keyframes medk_dk_klient_4_5{0%,20%{opacity:0}23%,31%{opacity:1}34%,100%{opacity:0}}
@keyframes medk_dk_klient_4_2{0%,34%{opacity:0;transform:translateY(30%)}38%,92%{opacity:1;transform:translateY(0)}96%,100%{opacity:0;transform:translateY(30%)}}
.me-anim-tile--dk-klient-4 .support{
  display:flex;align-items:center;justify-content:center;gap:.55em;
  background:rgba(51,229,189,.08);border:1.5px solid rgba(51,229,189,.3);
  border-radius:12px;padding:.65em 1em;
  font-size:clamp(9px,1.9cqw,13px);font-weight:600;color:#cde9df;
  white-space:nowrap;
  opacity:0;transform:translateY(40%);
  animation:medk_dk_klient_4_4 11s cubic-bezier(.2,0,.2,1) infinite;
}
@keyframes medk_dk_klient_4_4{0%,45%{opacity:0;transform:translateY(40%)}50%,92%{opacity:1;transform:translateY(0)}96%,100%{opacity:0;transform:translateY(40%)}}
.me-anim-tile--dk-klient-4 .support .pulse{
  width:.6em;height:.6em;border-radius:50%;background:#33e5bd;flex-shrink:0;
  box-shadow:0 0 0 0 rgba(51,229,189,.5);
  animation:medk_dk_klient_4_3 1.6s ease-out infinite;
}
@keyframes medk_dk_klient_4_3{0%{box-shadow:0 0 0 0 rgba(51,229,189,.5)}100%{box-shadow:0 0 0 10px rgba(51,229,189,0)}}
.me-anim-tile--dk-klient-4 .support b{color:#33e5bd}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-klient-4 *{animation:none!important;transition:none!important}}

/* ── dk-klient-5 ── */
.me-anim-tile--dk-klient-5,.me-anim-tile--dk-klient-5 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-klient-5{
  aspect-ratio:1/1.12;
  width:100%;
  max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;
  position:relative;
  overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-klient-5::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-klient-5::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-klient-5 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;
  background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;
  z-index:2;
}
.me-anim-tile--dk-klient-5 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-klient-5 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-klient-5 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-klient-5 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-klient-5 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-klient-5 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-klient-5 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-klient-5 .app{flex:1;display:flex;flex-direction:column;padding:21% 8% 6%;gap:4%}
.me-anim-tile--dk-klient-5 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-klient-5 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-klient-5 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-klient-5 .stage{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;position:relative}

/* ═══════ EKOSYSTEM SVG ═══════ */
.me-anim-tile--dk-klient-5 .eco{width:100%;height:100%}
.me-anim-tile--dk-klient-5 .lnk{fill:none;stroke:rgba(51,229,189,.22);stroke-width:2.5;stroke-linecap:round}
.me-anim-tile--dk-klient-5 .pulse{fill:none;stroke:#33e5bd;stroke-width:3;stroke-linecap:round;stroke-dasharray:10 90;filter:drop-shadow(0 0 4px rgba(51,229,189,.7));animation:medk_dk_klient_5_13 1.6s linear infinite}
@keyframes medk_dk_klient_5_13{to{stroke-dashoffset:-100}}
.me-anim-tile--dk-klient-5 .nd circle.bg{fill:#112330;stroke:rgba(51,229,189,.4);stroke-width:2.5}
.me-anim-tile--dk-klient-5 .nd .ic{fill:none;stroke:#e2f4ee;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.me-anim-tile--dk-klient-5 .nd text{fill:#9fb3c0;font-family:'Clash Display',sans-serif;font-weight:500;font-size:13px;text-anchor:middle}
.me-anim-tile--dk-klient-5 .nd.hub circle.bg{fill:#0d2b26;stroke:#33e5bd;stroke-width:3}

/* ═══════ MASTER-LOOP 12 s (zsynchronizowany):
   węzły dochodzą: 4/12/20/28/36/44%, linki tuż po
   parze, impulsy aktywne 50–88%, hub świeci,
   po czym WSZYSTKO resetuje się RAZEM 92–96%. ═══════ */
.me-anim-tile--dk-klient-5 .n{opacity:0;transform:scale(.5);transform-origin:center;transform-box:fill-box}
.me-anim-tile--dk-klient-5 .l{stroke-dasharray:200;stroke-dashoffset:200}
.me-anim-tile--dk-klient-5 .pg{opacity:0}
.me-anim-tile--dk-klient-5 .n.a1{animation:medk_dk_klient_5_6 12s cubic-bezier(.3,1.4,.4,1) infinite}
.me-anim-tile--dk-klient-5 .n.a2{animation:medk_dk_klient_5_7 12s cubic-bezier(.3,1.4,.4,1) infinite}
.me-anim-tile--dk-klient-5 .n.a3{animation:medk_dk_klient_5_8 12s cubic-bezier(.3,1.4,.4,1) infinite}
.me-anim-tile--dk-klient-5 .n.a4{animation:medk_dk_klient_5_9 12s cubic-bezier(.3,1.4,.4,1) infinite}
.me-anim-tile--dk-klient-5 .n.a5{animation:medk_dk_klient_5_10 12s cubic-bezier(.3,1.4,.4,1) infinite}
.me-anim-tile--dk-klient-5 .n.a6{animation:medk_dk_klient_5_11 12s cubic-bezier(.3,1.4,.4,1) infinite}
@keyframes medk_dk_klient_5_6{0%,3%{opacity:0;transform:scale(.5)}6%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.5)}}
@keyframes medk_dk_klient_5_7{0%,11%{opacity:0;transform:scale(.5)}14%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.5)}}
@keyframes medk_dk_klient_5_8{0%,19%{opacity:0;transform:scale(.5)}22%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.5)}}
@keyframes medk_dk_klient_5_9{0%,27%{opacity:0;transform:scale(.5)}30%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.5)}}
@keyframes medk_dk_klient_5_10{0%,35%{opacity:0;transform:scale(.5)}38%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.5)}}
@keyframes medk_dk_klient_5_11{0%,43%{opacity:0;transform:scale(.5)}46%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.5)}}
.me-anim-tile--dk-klient-5 .l.b2{animation:medk_dk_klient_5_1 12s ease infinite}
.me-anim-tile--dk-klient-5 .l.b3{animation:medk_dk_klient_5_2 12s ease infinite}
.me-anim-tile--dk-klient-5 .l.b4{animation:medk_dk_klient_5_3 12s ease infinite}
.me-anim-tile--dk-klient-5 .l.b5{animation:medk_dk_klient_5_4 12s ease infinite}
.me-anim-tile--dk-klient-5 .l.b6{animation:medk_dk_klient_5_5 12s ease infinite}
@keyframes medk_dk_klient_5_1{0%,14%{stroke-dashoffset:200}19%,92%{stroke-dashoffset:0}96%,100%{stroke-dashoffset:200}}
@keyframes medk_dk_klient_5_2{0%,22%{stroke-dashoffset:200}27%,92%{stroke-dashoffset:0}96%,100%{stroke-dashoffset:200}}
@keyframes medk_dk_klient_5_3{0%,30%{stroke-dashoffset:200}35%,92%{stroke-dashoffset:0}96%,100%{stroke-dashoffset:200}}
@keyframes medk_dk_klient_5_4{0%,38%{stroke-dashoffset:200}43%,92%{stroke-dashoffset:0}96%,100%{stroke-dashoffset:200}}
@keyframes medk_dk_klient_5_5{0%,46%{stroke-dashoffset:200}51%,92%{stroke-dashoffset:0}96%,100%{stroke-dashoffset:200}}
.me-anim-tile--dk-klient-5 .pg{animation:medk_dk_klient_5_12 12s ease infinite}
@keyframes medk_dk_klient_5_12{0%,50%{opacity:0}54%,88%{opacity:1}92%,100%{opacity:0}}
.me-anim-tile--dk-klient-5 .hubglow{animation:medk_dk_klient_5_0 12s ease infinite}
@keyframes medk_dk_klient_5_0{0%,50%{filter:none}56%,88%{filter:drop-shadow(0 0 14px rgba(51,229,189,.65))}94%,100%{filter:none}}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-klient-5 *{animation:none!important;transition:none!important}}

/* ── dk-handlowiec-1 ── */
.me-anim-tile--dk-handlowiec-1,.me-anim-tile--dk-handlowiec-1 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-handlowiec-1{
  aspect-ratio:1/1.12;width:100%;max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;position:relative;overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-handlowiec-1::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-handlowiec-1::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-handlowiec-1 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--dk-handlowiec-1 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-handlowiec-1 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-handlowiec-1 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-handlowiec-1 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-handlowiec-1 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-handlowiec-1 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-handlowiec-1 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-handlowiec-1 .app{flex:1;display:flex;flex-direction:column;padding:16% 8% 6%;gap:3%}
.me-anim-tile--dk-handlowiec-1 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-handlowiec-1 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-handlowiec-1 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}

/* ═══════ ZAKŁADKI ═══════ */
.me-anim-tile--dk-handlowiec-1 .tabs{display:flex;gap:3%}
.me-anim-tile--dk-handlowiec-1 .tab{flex:1;text-align:center;font-size:clamp(7px,1.5cqw,10px);font-weight:600;color:#7e93a3;background:#112330;border:1px solid rgba(51,229,189,.14);border-radius:8px;padding:.6em 0;white-space:nowrap}
.me-anim-tile--dk-handlowiec-1 .tab.t1{animation:medk_dk_handlowiec_1_13 12s ease infinite}
.me-anim-tile--dk-handlowiec-1 .tab.t2{animation:medk_dk_handlowiec_1_14 12s ease infinite}
.me-anim-tile--dk-handlowiec-1 .tab.t3{animation:medk_dk_handlowiec_1_15 12s ease infinite}
.me-anim-tile--dk-handlowiec-1 .tab.t4{animation:medk_dk_handlowiec_1_16 12s ease infinite}
@keyframes medk_dk_handlowiec_1_13{0%,2%,24%,100%{color:#7e93a3;background:#112330;border-color:rgba(51,229,189,.14)}3%,22%{color:#091722;background:#33e5bd;border-color:#33e5bd}}
@keyframes medk_dk_handlowiec_1_14{0%,26%,50%,100%{color:#7e93a3;background:#112330;border-color:rgba(51,229,189,.14)}28%,47%{color:#091722;background:#33e5bd;border-color:#33e5bd}}
@keyframes medk_dk_handlowiec_1_15{0%,51%,72%,100%{color:#7e93a3;background:#112330;border-color:rgba(51,229,189,.14)}53%,69%{color:#091722;background:#33e5bd;border-color:#33e5bd}}
@keyframes medk_dk_handlowiec_1_16{0%,73%,96%,100%{color:#7e93a3;background:#112330;border-color:rgba(51,229,189,.14)}75%,93%{color:#091722;background:#33e5bd;border-color:#33e5bd}}

/* ═══════ PANELE (pełna wysokość) ═══════ */
.me-anim-tile--dk-handlowiec-1 .panes{position:relative;flex:1;min-height:0}
.me-anim-tile--dk-handlowiec-1 .pane{position:absolute;inset:0;opacity:0;transform:translateX(8%);display:flex}
.me-anim-tile--dk-handlowiec-1 .pane .mod{
  flex:1;background:#112330;border:1.5px solid rgba(51,229,189,.18);
  border-radius:14px;padding:5.5% 6.5%;
  display:flex;flex-direction:column;gap:3%;min-height:0;overflow:hidden;
}
.me-anim-tile--dk-handlowiec-1 .p1{animation:medk_dk_handlowiec_1_2 12s cubic-bezier(.2,0,.2,1) infinite}
.me-anim-tile--dk-handlowiec-1 .p2{animation:medk_dk_handlowiec_1_3 12s cubic-bezier(.2,0,.2,1) infinite}
.me-anim-tile--dk-handlowiec-1 .p3{animation:medk_dk_handlowiec_1_4 12s cubic-bezier(.2,0,.2,1) infinite}
.me-anim-tile--dk-handlowiec-1 .p4{animation:medk_dk_handlowiec_1_5 12s cubic-bezier(.2,0,.2,1) infinite}
@keyframes medk_dk_handlowiec_1_2{0%,2%{opacity:0;transform:translateX(8%)}4%,21%{opacity:1;transform:translateX(0)}24%,100%{opacity:0;transform:translateX(-8%)}}
@keyframes medk_dk_handlowiec_1_3{0%,27%{opacity:0;transform:translateX(8%)}29%,46%{opacity:1;transform:translateX(0)}49%,100%{opacity:0;transform:translateX(-8%)}}
@keyframes medk_dk_handlowiec_1_4{0%,52%{opacity:0;transform:translateX(8%)}54%,68%{opacity:1;transform:translateX(0)}71%,100%{opacity:0;transform:translateX(-8%)}}
@keyframes medk_dk_handlowiec_1_5{0%,74%{opacity:0;transform:translateX(8%)}76%,92%{opacity:1;transform:translateX(0)}95%,100%{opacity:0;transform:translateX(-8%)}}
.me-anim-tile--dk-handlowiec-1 .m-t{display:flex;align-items:center;gap:5%;font-size:clamp(10px,2.05cqw,14px);font-weight:600;color:#e2e8f4;flex-shrink:0}
.me-anim-tile--dk-handlowiec-1 .m-t .mi{width:1.7em;height:1.7em;border-radius:8px;background:rgba(51,229,189,.12);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.me-anim-tile--dk-handlowiec-1 .m-t .mi svg{width:60%;height:60%;fill:none;stroke:#33e5bd;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.me-anim-tile--dk-handlowiec-1 .m-d{font-size:clamp(8.5px,1.75cqw,12px);color:#8fa0ad;line-height:1.45;flex-shrink:0}

/* ═══ ZAKŁADKA 1: PODGLĄD OFERTY A4 ═══ */
.me-anim-tile--dk-handlowiec-1 .a4wrap{flex:1;min-height:0;display:flex;justify-content:center}
.me-anim-tile--dk-handlowiec-1 .a4{
  height:100%;aspect-ratio:210/260;background:#e9eef2;border-radius:8px;
  padding:6% 7%;display:flex;flex-direction:column;gap:4.5%;
  box-shadow:0 8px 24px rgba(0,0,0,.4);
}
.me-anim-tile--dk-handlowiec-1 .a4 .hd{display:flex;justify-content:space-between;align-items:center}
.me-anim-tile--dk-handlowiec-1 .a4 .lg{width:30%;height:.8em;border-radius:4px;background:#33e5bd}
.me-anim-tile--dk-handlowiec-1 .a4 .no{width:22%;height:.55em;border-radius:4px;background:#b9c4cd}
.me-anim-tile--dk-handlowiec-1 .a4 .ln{height:.5em;border-radius:4px;background:#c9d3da}
.me-anim-tile--dk-handlowiec-1 .a4 .ln.s{width:62%}
.me-anim-tile--dk-handlowiec-1 .a4 .tbl{display:flex;flex-direction:column;gap:6%;flex:1;justify-content:center}
.me-anim-tile--dk-handlowiec-1 .a4 .tr{display:flex;gap:5%}
.me-anim-tile--dk-handlowiec-1 .a4 .tr i{display:block;height:.5em;border-radius:4px;background:#c9d3da}
.me-anim-tile--dk-handlowiec-1 .a4 .tr i:nth-child(1){flex:2.4}
.me-anim-tile--dk-handlowiec-1 .a4 .tr i:nth-child(2){flex:1}
.me-anim-tile--dk-handlowiec-1 .a4 .tr i:nth-child(3){flex:1.2}
.me-anim-tile--dk-handlowiec-1 .a4 .sum{display:flex;justify-content:flex-end;gap:5%;align-items:center}
.me-anim-tile--dk-handlowiec-1 .a4 .sum .lb{width:26%;height:.55em;border-radius:4px;background:#b9c4cd}
.me-anim-tile--dk-handlowiec-1 .a4 .sum .pr{width:32%;height:.8em;border-radius:4px;background:#0d9e77}
.me-anim-tile--dk-handlowiec-1 .ofr-tags{display:flex;gap:3.5%;flex-shrink:0}
.me-anim-tile--dk-handlowiec-1 .mtag{font-size:clamp(7.5px,1.5cqw,10px);font-weight:600;color:#33e5bd;background:rgba(51,229,189,.1);border:1px solid rgba(51,229,189,.25);border-radius:99px;padding:.3em .9em;white-space:nowrap}

/* ═══ ZAKŁADKA 2: WIDEO + PRZEWIJANY SKRYPT ═══ */
.me-anim-tile--dk-handlowiec-1 .vid{position:relative;background:#0d1e2c;border-radius:10px;flex-shrink:0;aspect-ratio:16/7.2;display:flex;align-items:center;justify-content:center;overflow:hidden}
.me-anim-tile--dk-handlowiec-1 .vid .play{width:0;height:0;border-left:1.1em solid #33e5bd;border-top:.68em solid transparent;border-bottom:.68em solid transparent;filter:drop-shadow(0 0 6px rgba(51,229,189,.5))}
.me-anim-tile--dk-handlowiec-1 .vid .prog{position:absolute;left:6%;right:6%;bottom:9%;height:3px;border-radius:99px;background:rgba(255,255,255,.15)}
.me-anim-tile--dk-handlowiec-1 .vid .prog i{display:block;height:100%;border-radius:99px;background:#33e5bd;width:0;animation:medk_dk_handlowiec_1_17 5s linear infinite}
@keyframes medk_dk_handlowiec_1_17{0%{width:0}92%,100%{width:100%}}
.me-anim-tile--dk-handlowiec-1 .scriptwin{flex:1;min-height:0;overflow:hidden;position:relative;background:#0d1e2c;border-radius:10px;padding:4% 6%}
.me-anim-tile--dk-handlowiec-1 .scriptwin::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0d1e2c 0%,transparent 22%,transparent 78%,#0d1e2c 100%);z-index:2;pointer-events:none}
.me-anim-tile--dk-handlowiec-1 .script{display:flex;flex-direction:column;gap:.55em;animation:medk_dk_handlowiec_1_8 9s linear infinite}
@keyframes medk_dk_handlowiec_1_8{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
.me-anim-tile--dk-handlowiec-1 .script span{font-size:clamp(8px,1.65cqw,11px);color:#a9bcc8;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-anim-tile--dk-handlowiec-1 .script span.hl{color:#33e5bd;font-weight:500}

/* ═══ ZAKŁADKA 3: KONFIGURATOR ═══ */
.me-anim-tile--dk-handlowiec-1 .cfg{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:space-evenly;gap:3%}
.me-anim-tile--dk-handlowiec-1 .cfg .cl{font-size:clamp(8px,1.6cqw,11px);color:#8fa0ad;display:flex;justify-content:space-between;align-items:center}
.me-anim-tile--dk-handlowiec-1 .cfg .cl b{color:#e2e8f4;font-weight:600}
.me-anim-tile--dk-handlowiec-1 .sl{position:relative;height:4px;border-radius:99px;background:rgba(255,255,255,.12);margin:.45em 0 .2em}
.me-anim-tile--dk-handlowiec-1 .sl i{position:absolute;top:50%;transform:translate(-50%,-50%);width:.95em;height:.95em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.6)}
.me-anim-tile--dk-handlowiec-1 .sl.s1 i{animation:medk_dk_handlowiec_1_11 4s ease-in-out infinite}
.me-anim-tile--dk-handlowiec-1 .sl.s2 i{animation:medk_dk_handlowiec_1_12 4s ease-in-out infinite}
@keyframes medk_dk_handlowiec_1_11{0%,100%{left:28%}50%{left:74%}}
@keyframes medk_dk_handlowiec_1_12{0%,100%{left:62%}50%{left:38%}}
.me-anim-tile--dk-handlowiec-1 .chips{display:flex;gap:3.5%}
.me-anim-tile--dk-handlowiec-1 .chip{font-size:clamp(7.5px,1.5cqw,10px);font-weight:600;color:#7e93a3;background:#0d1e2c;border:1px solid rgba(51,229,189,.18);border-radius:99px;padding:.35em .95em;white-space:nowrap}
.me-anim-tile--dk-handlowiec-1 .chip.on{color:#091722;background:#33e5bd;border-color:#33e5bd;animation:medk_dk_handlowiec_1_0 4s ease infinite}
@keyframes medk_dk_handlowiec_1_0{0%,100%{box-shadow:0 0 0 0 rgba(51,229,189,.4)}50%{box-shadow:0 0 12px 2px rgba(51,229,189,.35)}}
.me-anim-tile--dk-handlowiec-1 .price{display:flex;justify-content:space-between;align-items:center;background:#0d1e2c;border:1px solid rgba(51,229,189,.25);border-radius:10px;padding:.6em 1em}
.me-anim-tile--dk-handlowiec-1 .price .pl{font-size:clamp(8px,1.6cqw,11px);color:#8fa0ad;font-weight:500}
.me-anim-tile--dk-handlowiec-1 .price .pv{position:relative;font-size:clamp(10px,2.1cqw,15px);font-weight:700;color:#33e5bd;min-width:5.5em;text-align:right}
.me-anim-tile--dk-handlowiec-1 .price .pv span{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.me-anim-tile--dk-handlowiec-1 .price .pv .v1{animation:medk_dk_handlowiec_1_6 4s ease infinite}
.me-anim-tile--dk-handlowiec-1 .price .pv .v2{animation:medk_dk_handlowiec_1_7 4s ease infinite}
@keyframes medk_dk_handlowiec_1_6{0%,42%,100%{opacity:1}50%,92%{opacity:0}}
@keyframes medk_dk_handlowiec_1_7{0%,42%,100%{opacity:0}50%,92%{opacity:1}}

/* ═══ ZAKŁADKA 4: CRM — WYSYŁKA OFERTY (globalne 74–94%) ═══ */
.me-anim-tile--dk-handlowiec-1 .send{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:space-evenly;gap:2.2%}
.me-anim-tile--dk-handlowiec-1 .srow{display:flex;align-items:center;gap:4%;background:#0d1e2c;border:1px solid rgba(51,229,189,.16);border-radius:10px;padding:.6em .95em}
.me-anim-tile--dk-handlowiec-1 .srow .sk{font-size:clamp(8px,1.6cqw,11px);color:#7e93a3;font-weight:500;flex-shrink:0}
.me-anim-tile--dk-handlowiec-1 .srow .sv{font-size:clamp(8.5px,1.75cqw,12px);color:#dbe6ee;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-anim-tile--dk-handlowiec-1 .att{display:flex;align-items:center;gap:.6em}
.me-anim-tile--dk-handlowiec-1 .att .pdfic{width:1.9em;height:2.3em;border-radius:4px;background:#e9eef2;position:relative;flex-shrink:0}
.me-anim-tile--dk-handlowiec-1 .att .pdfic::after{content:'PDF';position:absolute;left:50%;bottom:12%;transform:translateX(-50%);font-size:.52em;font-weight:700;color:#0d9e77}
.me-anim-tile--dk-handlowiec-1 .sendbar{position:relative;background:#0d1e2c;border:1px solid rgba(51,229,189,.25);border-radius:10px;padding:.7em 1em;overflow:hidden}
.me-anim-tile--dk-handlowiec-1 .sendbar .sb-l{font-size:clamp(8px,1.65cqw,11px);color:#8fa0ad;font-weight:500;position:relative;z-index:2}
.me-anim-tile--dk-handlowiec-1 .sendbar .fill{position:absolute;inset:0;background:rgba(51,229,189,.16);transform:scaleX(0);transform-origin:left;animation:medk_dk_handlowiec_1_10 12s ease infinite}
@keyframes medk_dk_handlowiec_1_10{0%,76%{transform:scaleX(0)}84%,94%{transform:scaleX(1)}96%,100%{transform:scaleX(0)}}
.me-anim-tile--dk-handlowiec-1 .plane{position:absolute;right:6%;top:50%;transform:translateY(-50%);z-index:2;width:1.2em;height:1.2em;animation:medk_dk_handlowiec_1_1 12s ease infinite}
.me-anim-tile--dk-handlowiec-1 .plane svg{width:100%;height:100%;fill:none;stroke:#33e5bd;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@keyframes medk_dk_handlowiec_1_1{0%,76%{transform:translate(0,-50%);opacity:1}84%{transform:translate(240%,-140%);opacity:0}85%,100%{transform:translate(0,-50%);opacity:0}96%{opacity:1}}
.me-anim-tile--dk-handlowiec-1 .sent{
  align-self:center;background:#33e5bd;color:#091722;font-weight:700;
  font-size:clamp(9px,1.9cqw,13px);padding:.5em 1.2em;border-radius:999px;
  box-shadow:0 6px 18px rgba(51,229,189,.4);opacity:0;transform:scale(.7);
  animation:medk_dk_handlowiec_1_9 12s cubic-bezier(.3,1.5,.4,1) infinite;white-space:nowrap;
}
@keyframes medk_dk_handlowiec_1_9{0%,84%{opacity:0;transform:scale(.7)}87%,93%{opacity:1;transform:scale(1)}95%,100%{opacity:0;transform:scale(.7)}}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-handlowiec-1 *{animation:none!important;transition:none!important}}

/* ── dk-handlowiec-2 ── */
.me-anim-tile--dk-handlowiec-2,.me-anim-tile--dk-handlowiec-2 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-handlowiec-2{
  aspect-ratio:1/1.12;width:100%;max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;position:relative;overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-handlowiec-2::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-handlowiec-2::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-handlowiec-2 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--dk-handlowiec-2 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-handlowiec-2 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-handlowiec-2 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-handlowiec-2 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-handlowiec-2 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-handlowiec-2 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-handlowiec-2 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-handlowiec-2 .app{flex:1;display:flex;flex-direction:column;padding:20% 8% 6%;gap:3.5%}
.me-anim-tile--dk-handlowiec-2 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-handlowiec-2 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-handlowiec-2 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-handlowiec-2 .stage{flex:1;display:flex;flex-direction:column;min-height:0;gap:3.5%}

/* ═══════ POWIADOMIENIE „NOWE SZKOLENIE" ═══════ */
.me-anim-tile--dk-handlowiec-2 .notif{
  position:relative;display:flex;align-items:center;gap:5%;
  background:#12312e;border:1.5px solid #33e5bd;border-radius:12px;
  padding:3.6% 5.5%;flex-shrink:0;
  box-shadow:0 0 20px rgba(51,229,189,.25);
  opacity:0;transform:translateY(-60%);
  animation:medk_dk_handlowiec_2_7 13s cubic-bezier(.3,1.4,.4,1) infinite;
}
@keyframes medk_dk_handlowiec_2_7{0%,3%{opacity:0;transform:translateY(-60%)}7%,92%{opacity:1;transform:translateY(0)}96%,100%{opacity:0;transform:translateY(-60%)}}
.me-anim-tile--dk-handlowiec-2 .notif .ci{width:2em;height:2em;border-radius:9px;background:rgba(51,229,189,.16);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.me-anim-tile--dk-handlowiec-2 .notif .ci svg{width:58%;height:58%;fill:none;stroke:#33e5bd;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.me-anim-tile--dk-handlowiec-2 .notif .nt{font-size:clamp(9px,1.9cqw,13px);font-weight:600;color:#e8fff8}
.me-anim-tile--dk-handlowiec-2 .notif .nd{font-size:clamp(8px,1.6cqw,11px);color:#9fc9bc}
.me-anim-tile--dk-handlowiec-2 .newbadge{position:absolute;top:-22%;right:4%;background:#33e5bd;color:#091722;font-weight:700;font-size:clamp(7.5px,1.5cqw,10px);padding:.32em .9em;border-radius:999px;box-shadow:0 4px 14px rgba(51,229,189,.45);z-index:3;white-space:nowrap}

/* ═══════ TREŚĆ (player + lekcje) ═══════ */
.me-anim-tile--dk-handlowiec-2 .body{flex:1;min-height:0;display:flex;flex-direction:column;gap:3.5%;opacity:0;animation:medk_dk_handlowiec_2_0 13s ease infinite}
@keyframes medk_dk_handlowiec_2_0{0%,8%{opacity:0}12%,93%{opacity:1}97%,100%{opacity:0}}

/* player — pasek resetuje się przy zmianie lekcji */
.me-anim-tile--dk-handlowiec-2 .vid{position:relative;background:#0d1e2c;border-radius:10px;flex-shrink:0;aspect-ratio:16/6.4;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1.5px solid rgba(51,229,189,.16)}
.me-anim-tile--dk-handlowiec-2 .vid .play{width:0;height:0;border-left:1.05em solid #33e5bd;border-top:.65em solid transparent;border-bottom:.65em solid transparent;filter:drop-shadow(0 0 6px rgba(51,229,189,.5))}
.me-anim-tile--dk-handlowiec-2 .vid .prog{position:absolute;left:6%;right:6%;bottom:10%;height:3px;border-radius:99px;background:rgba(255,255,255,.15)}
.me-anim-tile--dk-handlowiec-2 .vid .prog i{display:block;height:100%;border-radius:99px;background:#33e5bd;width:0;animation:medk_dk_handlowiec_2_11 13s linear infinite}
@keyframes medk_dk_handlowiec_2_11{
  0%,12%{width:0}
  36%{width:100%}
  37%{width:0}
  62%{width:100%}
  63%{width:0}
  88%{width:100%}
  89%,100%{width:0}
}

/* lekcje — stała lista, aktywują się po kolei */
.me-anim-tile--dk-handlowiec-2 .lessons{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:space-evenly;gap:3%}
.me-anim-tile--dk-handlowiec-2 .les{
  display:flex;align-items:center;gap:5%;
  background:#112330;border:1.5px solid rgba(51,229,189,.14);border-radius:11px;
  padding:3.2% 5%;
}
.me-anim-tile--dk-handlowiec-2 .les .num{
  flex-shrink:0;width:1.5em;height:1.5em;border-radius:50%;position:relative;
  border:2px solid rgba(51,229,189,.4);background:#0d1e2c;
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(8px,1.65cqw,11px);font-weight:700;color:#8fa0ad;
}
.me-anim-tile--dk-handlowiec-2 .les .num svg{position:absolute;inset:18%;fill:none;stroke:#091722;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.me-anim-tile--dk-handlowiec-2 .les .lt{font-size:clamp(8.5px,1.8cqw,12px);font-weight:500;color:#c7d3dd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-anim-tile--dk-handlowiec-2 .les .lt b{color:#7e93a3;font-weight:600;margin-right:.35em}

/* okna aktywności: L1 12–36%, L2 37–62%, L3 63–88% */
.me-anim-tile--dk-handlowiec-2 .l1{animation:medk_dk_handlowiec_2_1 13s ease infinite}
.me-anim-tile--dk-handlowiec-2 .l2{animation:medk_dk_handlowiec_2_2 13s ease infinite}
.me-anim-tile--dk-handlowiec-2 .l3{animation:medk_dk_handlowiec_2_3 13s ease infinite}
@keyframes medk_dk_handlowiec_2_1{
  0%,10%{border-color:rgba(51,229,189,.14);background:#112330}
  12%,35%{border-color:#33e5bd;background:#12312e;box-shadow:0 0 16px rgba(51,229,189,.22)}
  38%,92%{border-color:rgba(51,229,189,.3);background:#112c2c;box-shadow:none}
  96%,100%{border-color:rgba(51,229,189,.14);background:#112330}
}
@keyframes medk_dk_handlowiec_2_2{
  0%,35%{border-color:rgba(51,229,189,.14);background:#112330}
  37%,61%{border-color:#33e5bd;background:#12312e;box-shadow:0 0 16px rgba(51,229,189,.22)}
  64%,92%{border-color:rgba(51,229,189,.3);background:#112c2c;box-shadow:none}
  96%,100%{border-color:rgba(51,229,189,.14);background:#112330}
}
@keyframes medk_dk_handlowiec_2_3{
  0%,61%{border-color:rgba(51,229,189,.14);background:#112330}
  63%,87%{border-color:#33e5bd;background:#12312e;box-shadow:0 0 16px rgba(51,229,189,.22)}
  89%,92%{border-color:rgba(51,229,189,.3);background:#112c2c;box-shadow:none}
  96%,100%{border-color:rgba(51,229,189,.14);background:#112330}
}
/* kółka: numer → fajka po obejrzeniu */
.me-anim-tile--dk-handlowiec-2 .l1 .num{animation:medk_dk_handlowiec_2_4 13s ease infinite}
.me-anim-tile--dk-handlowiec-2 .l2 .num{animation:medk_dk_handlowiec_2_5 13s ease infinite}
.me-anim-tile--dk-handlowiec-2 .l3 .num{animation:medk_dk_handlowiec_2_6 13s ease infinite}
@keyframes medk_dk_handlowiec_2_4{0%,35%{background:#0d1e2c;border-color:rgba(51,229,189,.4);color:#8fa0ad}37%,92%{background:#33e5bd;border-color:#33e5bd;color:transparent}96%,100%{background:#0d1e2c;border-color:rgba(51,229,189,.4);color:#8fa0ad}}
@keyframes medk_dk_handlowiec_2_5{0%,61%{background:#0d1e2c;border-color:rgba(51,229,189,.4);color:#8fa0ad}63%,92%{background:#33e5bd;border-color:#33e5bd;color:transparent}96%,100%{background:#0d1e2c;border-color:rgba(51,229,189,.4);color:#8fa0ad}}
@keyframes medk_dk_handlowiec_2_6{0%,87%{background:#0d1e2c;border-color:rgba(51,229,189,.4);color:#8fa0ad}89%,92%{background:#33e5bd;border-color:#33e5bd;color:transparent}96%,100%{background:#0d1e2c;border-color:rgba(51,229,189,.4);color:#8fa0ad}}
.me-anim-tile--dk-handlowiec-2 .l1 .num svg{animation:medk_dk_handlowiec_2_8 13s ease infinite}
.me-anim-tile--dk-handlowiec-2 .l2 .num svg{animation:medk_dk_handlowiec_2_9 13s ease infinite}
.me-anim-tile--dk-handlowiec-2 .l3 .num svg{animation:medk_dk_handlowiec_2_10 13s ease infinite}
@keyframes medk_dk_handlowiec_2_8{0%,35%{opacity:0}37%,92%{opacity:1}96%,100%{opacity:0}}
@keyframes medk_dk_handlowiec_2_9{0%,61%{opacity:0}63%,92%{opacity:1}96%,100%{opacity:0}}
@keyframes medk_dk_handlowiec_2_10{0%,87%{opacity:0}89%,92%{opacity:1}96%,100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-handlowiec-2 *{animation:none!important;transition:none!important}}

/* ── dk-handlowiec-3 ── */
.me-anim-tile--dk-handlowiec-3,.me-anim-tile--dk-handlowiec-3 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-handlowiec-3{
  aspect-ratio:1/1.12;width:100%;max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;position:relative;overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-handlowiec-3::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-handlowiec-3::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-handlowiec-3 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--dk-handlowiec-3 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-handlowiec-3 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-handlowiec-3 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-handlowiec-3 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-handlowiec-3 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-handlowiec-3 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-handlowiec-3 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-handlowiec-3 .app{flex:1;display:flex;flex-direction:column;padding:16% 8% 6%;gap:2.5%}
.me-anim-tile--dk-handlowiec-3 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-handlowiec-3 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-handlowiec-3 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-handlowiec-3 .stage{flex:1;display:flex;flex-direction:column;justify-content:space-evenly;min-height:0;gap:2%;overflow:hidden}

/* ═══════ FORMULARZ ═══════ */
.me-anim-tile--dk-handlowiec-3 .frow{background:#112330;border:1.5px solid rgba(51,229,189,.16);border-radius:11px;padding:2.6% 5%;position:relative}
.me-anim-tile--dk-handlowiec-3 .frow .fl{font-size:clamp(8px,1.6cqw,11px);color:#7e93a3;font-weight:500;margin-bottom:.3em}
.me-anim-tile--dk-handlowiec-3 .frow .fv{font-size:clamp(9.5px,2cqw,13px);color:#dbe6ee;font-weight:500;min-height:1.3em;white-space:nowrap;overflow:hidden}
.me-anim-tile--dk-handlowiec-3 .chipset{display:flex;gap:3.5%;margin-top:.35em}
.me-anim-tile--dk-handlowiec-3 .chip{font-size:clamp(8px,1.6cqw,10.5px);font-weight:600;color:#7e93a3;background:#0d1e2c;border:1px solid rgba(51,229,189,.18);border-radius:99px;padding:.32em .9em;white-space:nowrap}

/* ═══════ ANIMACJA (loop 12 s):
   imię 10% → chip OZE 24% → chip specjalizacja 38%
   → przycisk wciska się 50% → pasek weryfikacji 52–64%
   → badge 71% → hold do 90% → reset RAZEM. ═══════ */
.me-anim-tile--dk-handlowiec-3 .fv .typed{opacity:0;animation:medk_dk_handlowiec_3_3 12s ease infinite}
@keyframes medk_dk_handlowiec_3_3{0%,6%{opacity:0}10%,90%{opacity:1}95%,100%{opacity:0}}
.me-anim-tile--dk-handlowiec-3 .chip.c1{animation:medk_dk_handlowiec_3_1 12s ease infinite}
@keyframes medk_dk_handlowiec_3_1{0%,20%{color:#7e93a3;background:#0d1e2c;border-color:rgba(51,229,189,.18)}24%,90%{color:#091722;background:#33e5bd;border-color:#33e5bd}95%,100%{color:#7e93a3;background:#0d1e2c;border-color:rgba(51,229,189,.18)}}
.me-anim-tile--dk-handlowiec-3 .chip.c2{animation:medk_dk_handlowiec_3_2 12s ease infinite}
@keyframes medk_dk_handlowiec_3_2{0%,34%{color:#7e93a3;background:#0d1e2c;border-color:rgba(51,229,189,.18)}38%,90%{color:#091722;background:#33e5bd;border-color:#33e5bd}95%,100%{color:#7e93a3;background:#0d1e2c;border-color:rgba(51,229,189,.18)}}
.me-anim-tile--dk-handlowiec-3 .sbtn{
  align-self:stretch;text-align:center;background:#33e5bd;color:#091722;
  font-weight:700;font-size:clamp(9px,1.85cqw,12.5px);
  padding:.65em 0;border-radius:10px;position:relative;overflow:hidden;
  animation:medk_dk_handlowiec_3_0 12s ease infinite;
}
@keyframes medk_dk_handlowiec_3_0{0%,48%{transform:scale(1);opacity:.55}50%{transform:scale(.96)}52%,64%{transform:scale(1);opacity:1}66%,90%{opacity:.55}95%,100%{opacity:.55;transform:scale(1)}}
.me-anim-tile--dk-handlowiec-3 .sbtn .vfill{position:absolute;inset:0;background:rgba(9,23,34,.22);transform:scaleX(0);transform-origin:left;animation:medk_dk_handlowiec_3_5 12s ease infinite}
@keyframes medk_dk_handlowiec_3_5{0%,52%{transform:scaleX(0)}64%,90%{transform:scaleX(1)}95%,100%{transform:scaleX(0)}}
.me-anim-tile--dk-handlowiec-3 .okbadge{
  align-self:center;margin-bottom:2%;
  background:#33e5bd;color:#091722;font-weight:700;
  font-size:clamp(9.5px,2cqw,13.5px);padding:.5em 1.2em;border-radius:999px;
  box-shadow:0 6px 18px rgba(51,229,189,.4);white-space:nowrap;
  opacity:0;transform:scale(.7);
  animation:medk_dk_handlowiec_3_4 12s cubic-bezier(.3,1.5,.4,1) infinite;
}
@keyframes medk_dk_handlowiec_3_4{0%,66%{opacity:0;transform:scale(.7)}71%,90%{opacity:1;transform:scale(1)}95%,100%{opacity:0;transform:scale(.7)}}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-handlowiec-3 *{animation:none!important;transition:none!important}}

/* ── dk-handlowiec-4 ── */
.me-anim-tile--dk-handlowiec-4,.me-anim-tile--dk-handlowiec-4 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-handlowiec-4{
  aspect-ratio:1/1.12;width:100%;max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;position:relative;overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-handlowiec-4::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-handlowiec-4::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-handlowiec-4 .phone{
  position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:64%;height:94%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--dk-handlowiec-4 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-handlowiec-4 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-handlowiec-4 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-handlowiec-4 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-handlowiec-4 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-handlowiec-4 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-handlowiec-4 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-handlowiec-4 .app{flex:1;display:flex;flex-direction:column;padding:17% 7% 6%;gap:2.4%;min-height:0;overflow:hidden}
.me-anim-tile--dk-handlowiec-4 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-handlowiec-4 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-handlowiec-4 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-handlowiec-4 .stage{flex:1;display:flex;flex-direction:column;min-height:0;gap:2.4%;overflow:hidden}

/* ═══════ KOLUMNY ═══════ */
.me-anim-tile--dk-handlowiec-4 .cmp{flex:1;min-height:0;display:flex;gap:4%}
.me-anim-tile--dk-handlowiec-4 .colc{flex:1;border-radius:13px;padding:4.5%;display:flex;flex-direction:column;gap:4%;min-width:0;overflow:hidden}
.me-anim-tile--dk-handlowiec-4 .colc.bad{background:#112330;border:1.5px solid rgba(255,255,255,.1)}
.me-anim-tile--dk-handlowiec-4 .colc.good{background:#12312e;border:2px solid #33e5bd}
.me-anim-tile--dk-handlowiec-4 .colc .ch{display:flex;align-items:center;gap:5%;flex-shrink:0}
.me-anim-tile--dk-handlowiec-4 .colc .ch .mark{flex-shrink:0;width:1.45em;height:1.45em;border-radius:50%;display:flex;align-items:center;justify-content:center}
.me-anim-tile--dk-handlowiec-4 .colc.bad .ch .mark{background:rgba(248,113,113,.15);border:1.5px solid #f87171}
.me-anim-tile--dk-handlowiec-4 .colc.good .ch .mark{background:#33e5bd;box-shadow:0 0 10px rgba(51,229,189,.5)}
.me-anim-tile--dk-handlowiec-4 .colc .ch .mark svg{width:60%;height:60%;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:3.2}
.me-anim-tile--dk-handlowiec-4 .colc.bad .ch .mark svg{stroke:#f87171}
.me-anim-tile--dk-handlowiec-4 .colc.good .ch .mark svg{stroke:#091722}
.me-anim-tile--dk-handlowiec-4 .colc .ch .cn{font-size:clamp(8.5px,1.75cqw,11.5px);font-weight:600;color:#dbe6ee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-anim-tile--dk-handlowiec-4 .colc.bad .ch .cn{color:#9aa9b5}
.me-anim-tile--dk-handlowiec-4 .itm{display:flex;align-items:center;gap:5%;background:rgba(255,255,255,.04);border-radius:8px;padding:2.6% 5%;min-width:0}
.me-anim-tile--dk-handlowiec-4 .colc.good .itm{background:rgba(51,229,189,.08)}
.me-anim-tile--dk-handlowiec-4 .itm .id{flex-shrink:0;width:.5em;height:.5em;border-radius:50%;background:#7e93a3}
.me-anim-tile--dk-handlowiec-4 .colc.good .itm .id{background:#33e5bd;box-shadow:0 0 6px rgba(51,229,189,.6)}
.me-anim-tile--dk-handlowiec-4 .itm .it{font-size:clamp(8px,1.6cqw,10.5px);font-weight:500;color:#c7d3dd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-anim-tile--dk-handlowiec-4 .colc .empt{flex:1}

/* mini-wykres „Rachunki za prąd" (spada w dół) */
.me-anim-tile--dk-handlowiec-4 .bills{display:flex;flex-direction:column;gap:.3em;background:rgba(51,229,189,.08);border-radius:8px;padding:3% 5%;overflow:hidden}
.me-anim-tile--dk-handlowiec-4 .bills .bl{font-size:clamp(7.5px,1.5cqw,9.5px);color:#9fc9bc;font-weight:500;display:flex;align-items:center;gap:.4em;min-width:0}
.me-anim-tile--dk-handlowiec-4 .bills .bl b{color:#33e5bd}
.me-anim-tile--dk-handlowiec-4 .bills svg{display:block;width:100%;height:2.1em;overflow:hidden}
.me-anim-tile--dk-handlowiec-4 .bills .grid line{stroke:rgba(255,255,255,.09);stroke-width:1}
.me-anim-tile--dk-handlowiec-4 .bills .down{
  fill:none;stroke:#33e5bd;stroke-width:3;stroke-linecap:round;
  stroke-dasharray:160;stroke-dashoffset:160;
  animation:medk_dk_handlowiec_4_2 12s ease infinite;
}
@keyframes medk_dk_handlowiec_4_2{0%,40%{stroke-dashoffset:160}54%,90%{stroke-dashoffset:0}95%,100%{stroke-dashoffset:160}}

/* ═══════ WEJŚCIE KOLUMN (z pustki) ═══════ */
.me-anim-tile--dk-handlowiec-4 .colc.bad{opacity:0;transform:translateX(-8%);animation:medk_dk_handlowiec_4_0 12s ease infinite}
@keyframes medk_dk_handlowiec_4_0{0%,3%{opacity:0;transform:translateX(-8%)}7%,90%{opacity:1;transform:translateX(0)}95%,100%{opacity:0;transform:translateX(-8%)}}
.me-anim-tile--dk-handlowiec-4 .colc.good{opacity:0;transform:translateX(8%);animation:medk_dk_handlowiec_4_1 12s ease infinite,medk_dk_handlowiec_4_3 12s ease infinite}
@keyframes medk_dk_handlowiec_4_1{0%,7%{opacity:0;transform:translateX(8%)}11%,90%{opacity:1;transform:translateX(0)}95%,100%{opacity:0;transform:translateX(8%)}}
@keyframes medk_dk_handlowiec_4_3{0%,52%{box-shadow:0 0 0 rgba(51,229,189,0)}58%,90%{box-shadow:0 0 24px rgba(51,229,189,.4)}95%,100%{box-shadow:0 0 0 rgba(51,229,189,0)}}
/* pozycje prawej wskakują po kolei */
.me-anim-tile--dk-handlowiec-4 .gi1{opacity:0;animation:medk_dk_handlowiec_4_4 12s ease infinite}
.me-anim-tile--dk-handlowiec-4 .gi2{opacity:0;animation:medk_dk_handlowiec_4_5 12s ease infinite}
.me-anim-tile--dk-handlowiec-4 .gi3{opacity:0;animation:medk_dk_handlowiec_4_6 12s ease infinite}
.me-anim-tile--dk-handlowiec-4 .gi4{opacity:0;animation:medk_dk_handlowiec_4_7 12s ease infinite}
.me-anim-tile--dk-handlowiec-4 .gi5{opacity:0;animation:medk_dk_handlowiec_4_8 12s ease infinite}
@keyframes medk_dk_handlowiec_4_4{0%,13%{opacity:0;transform:translateY(25%)}17%,90%{opacity:1;transform:translateY(0)}95%,100%{opacity:0}}
@keyframes medk_dk_handlowiec_4_5{0%,19%{opacity:0;transform:translateY(25%)}23%,90%{opacity:1;transform:translateY(0)}95%,100%{opacity:0}}
@keyframes medk_dk_handlowiec_4_6{0%,25%{opacity:0;transform:translateY(25%)}29%,90%{opacity:1;transform:translateY(0)}95%,100%{opacity:0}}
@keyframes medk_dk_handlowiec_4_7{0%,31%{opacity:0;transform:translateY(25%)}35%,90%{opacity:1;transform:translateY(0)}95%,100%{opacity:0}}
@keyframes medk_dk_handlowiec_4_8{0%,37%{opacity:0;transform:translateY(25%)}41%,90%{opacity:1;transform:translateY(0)}95%,100%{opacity:0}}

/* ═══════ PASKI WARTOŚCI (kompaktowe) ═══════ */
.me-anim-tile--dk-handlowiec-4 .valrow{flex-shrink:0;display:flex;flex-direction:column;gap:.35em;background:#112330;border:1.5px solid rgba(51,229,189,.18);border-radius:11px;padding:2.6% 5%;opacity:0;animation:medk_dk_handlowiec_4_11 12s ease infinite}
@keyframes medk_dk_handlowiec_4_11{0%,42%{opacity:0;transform:translateY(25%)}46%,90%{opacity:1;transform:translateY(0)}95%,100%{opacity:0}}
.me-anim-tile--dk-handlowiec-4 .vl{display:flex;justify-content:space-between;font-size:clamp(7.5px,1.5cqw,9.5px);color:#8fa0ad;font-weight:500}
.me-anim-tile--dk-handlowiec-4 .vbar{height:4px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}
.me-anim-tile--dk-handlowiec-4 .vbar i{display:block;height:100%;border-radius:99px;transform-origin:left;transform:scaleX(0)}
.me-anim-tile--dk-handlowiec-4 .vbar.b1 i{background:#7e93a3;animation:medk_dk_handlowiec_4_9 12s ease infinite}
.me-anim-tile--dk-handlowiec-4 .vbar.b2 i{background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.6);animation:medk_dk_handlowiec_4_10 12s ease infinite}
@keyframes medk_dk_handlowiec_4_9{0%,46%{transform:scaleX(0)}54%,90%{transform:scaleX(.25)}95%,100%{transform:scaleX(0)}}
@keyframes medk_dk_handlowiec_4_10{0%,50%{transform:scaleX(0)}64%,90%{transform:scaleX(1)}95%,100%{transform:scaleX(0)}}

/* ═══════ BADGE (odsunięty od dołu) ═══════ */
.me-anim-tile--dk-handlowiec-4 .winbadge{
  align-self:center;margin-bottom:3%;flex-shrink:0;
  background:#33e5bd;color:#091722;font-weight:700;
  font-size:clamp(9px,1.9cqw,12.5px);padding:.45em 1.1em;border-radius:999px;
  box-shadow:0 6px 18px rgba(51,229,189,.4);white-space:nowrap;
  opacity:0;transform:scale(.7);animation:medk_dk_handlowiec_4_12 12s cubic-bezier(.3,1.5,.4,1) infinite;
}
@keyframes medk_dk_handlowiec_4_12{0%,68%{opacity:0;transform:scale(.7)}73%,90%{opacity:1;transform:scale(1)}95%,100%{opacity:0;transform:scale(.7)}}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-handlowiec-4 *{animation:none!important;transition:none!important}}

/* ── dk-handlowiec-5 ── */
.me-anim-tile--dk-handlowiec-5,.me-anim-tile--dk-handlowiec-5 *{margin:0;padding:0;box-sizing:border-box}

/* licznik zarobków — płynne naliczanie */
@property --me-zr-n{syntax:'<integer>';initial-value:0;inherits:false}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-handlowiec-5{
  aspect-ratio:1/1.12;width:100%;max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;position:relative;overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-handlowiec-5::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-handlowiec-5::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-handlowiec-5 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--dk-handlowiec-5 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-handlowiec-5 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-handlowiec-5 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-handlowiec-5 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-handlowiec-5 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-handlowiec-5 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-handlowiec-5 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-handlowiec-5 .app{flex:1;display:flex;flex-direction:column;padding:20% 8% 9%;gap:3.5%}
.me-anim-tile--dk-handlowiec-5 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-handlowiec-5 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-handlowiec-5 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-handlowiec-5 .stage{flex:1;display:flex;flex-direction:column;justify-content:center;min-height:0;gap:6%}

/* ═══════ SŁUPKI TYGODNI (skrócone, odsunięte od dołu) ═══════ */
.me-anim-tile--dk-handlowiec-5 .chart{flex-shrink:0;height:44%;display:flex;align-items:flex-end;gap:6%;padding:0 4%}
.me-anim-tile--dk-handlowiec-5 .bwrap{flex:1;display:flex;flex-direction:column;align-items:center;gap:.45em;height:100%;justify-content:flex-end}
.me-anim-tile--dk-handlowiec-5 .bar{width:100%;border-radius:6px 6px 0 0;background:linear-gradient(180deg,#33e5bd,#1fae8e);transform:scaleY(0);transform-origin:bottom;box-shadow:0 0 10px rgba(51,229,189,.3)}
.me-anim-tile--dk-handlowiec-5 .bw{font-size:clamp(7.5px,1.5cqw,10px);color:#8fa0ad;font-weight:500}
.me-anim-tile--dk-handlowiec-5 .b1 .bar{height:34%;animation:medk_dk_handlowiec_5_0 13s ease infinite}
.me-anim-tile--dk-handlowiec-5 .b2 .bar{height:50%;animation:medk_dk_handlowiec_5_1 13s ease infinite}
.me-anim-tile--dk-handlowiec-5 .b3 .bar{height:68%;animation:medk_dk_handlowiec_5_2 13s ease infinite}
.me-anim-tile--dk-handlowiec-5 .b4 .bar{height:90%;animation:medk_dk_handlowiec_5_3 13s ease infinite}
@keyframes medk_dk_handlowiec_5_0{0%,10%{transform:scaleY(0)}18%,90%{transform:scaleY(1)}95%,100%{transform:scaleY(0)}}
@keyframes medk_dk_handlowiec_5_1{0%,24%{transform:scaleY(0)}32%,90%{transform:scaleY(1)}95%,100%{transform:scaleY(0)}}
@keyframes medk_dk_handlowiec_5_2{0%,38%{transform:scaleY(0)}46%,90%{transform:scaleY(1)}95%,100%{transform:scaleY(0)}}
@keyframes medk_dk_handlowiec_5_3{0%,52%{transform:scaleY(0)}60%,90%{transform:scaleY(1)}95%,100%{transform:scaleY(0)}}

/* ═══════ SUMA — PŁYNNE NALICZANIE ═══════
   Licznik --me-zr-n nabija się razem ze słupkami:
   0 → 5400 → 9900 → 14600 → 19800, cyfra po cyfrze
   (animowany <integer>), zamiast chamskiego przeskoku. ═══════ */
.me-anim-tile--dk-handlowiec-5 .total{
  flex-shrink:0;display:flex;justify-content:space-between;align-items:center;
  background:rgba(51,229,189,.08);border:1.5px solid rgba(51,229,189,.3);
  border-radius:12px;padding:3.8% 5.5%;
  animation:medk_dk_handlowiec_5_5 13s ease infinite;
}
@keyframes medk_dk_handlowiec_5_5{0%,60%{box-shadow:none}66%,90%{box-shadow:0 0 22px rgba(51,229,189,.35)}95%,100%{box-shadow:none}}
.me-anim-tile--dk-handlowiec-5 .total .tl{font-size:clamp(8.5px,1.8cqw,12px);color:#cde9df;font-weight:500}
.me-anim-tile--dk-handlowiec-5 .total .tv{
  font-size:clamp(12px,2.5cqw,17px);font-weight:700;color:#33e5bd;
  font-variant-numeric:tabular-nums;white-space:nowrap;
  --me-zr-n:0;
  animation:medk_dk_handlowiec_5_4 13s cubic-bezier(.3,0,.4,1) infinite;
  counter-reset:mezrn var(--me-zr-n);
}
.me-anim-tile--dk-handlowiec-5 .total .tv::before{content:counter(mezrn)}
.me-anim-tile--dk-handlowiec-5 .total .tv::after{content:'\00a0zł'}
@keyframes medk_dk_handlowiec_5_4{
  0%,10%{--me-zr-n:0}
  18%,24%{--me-zr-n:5400}
  32%,38%{--me-zr-n:9900}
  46%,52%{--me-zr-n:14600}
  60%,92%{--me-zr-n:19800}
  97%,100%{--me-zr-n:0}
}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-handlowiec-5 *{animation:none!important;transition:none!important}}

/* ── dk-instalator-1 ── */
.me-anim-tile--dk-instalator-1,.me-anim-tile--dk-instalator-1 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-instalator-1{
  aspect-ratio:1/1.12;width:100%;max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;position:relative;overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-instalator-1::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-instalator-1::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-instalator-1 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--dk-instalator-1 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-instalator-1 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-instalator-1 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-instalator-1 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-instalator-1 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-instalator-1 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-instalator-1 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-instalator-1 .app{flex:1;display:flex;flex-direction:column;padding:20% 8% 7%;gap:3.5%}
.me-anim-tile--dk-instalator-1 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-instalator-1 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-instalator-1 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-instalator-1 .stage{flex:1;min-height:0;position:relative}

/* ═══════ FEED ═══════ */
.me-anim-tile--dk-instalator-1 .feedwin{position:absolute;inset:0;overflow:hidden;border-radius:12px;opacity:0;animation:medk_dk_instalator_1_2 13s ease infinite}
@keyframes medk_dk_instalator_1_2{0%{opacity:0}5%,88%{opacity:1}94%,100%{opacity:0}}
.me-anim-tile--dk-instalator-1 .feed{
  position:absolute;left:0;right:0;top:0;height:200%;
  display:flex;flex-direction:column;gap:5%;
  animation:medk_dk_instalator_1_3 13s cubic-bezier(.25,0,.2,1) infinite;
}
/* scroll → STOP na czas popupu → reset */
@keyframes medk_dk_instalator_1_3{
  0%,6%{transform:translateY(0)}
  22%,100%{transform:translateY(-27%)}
}
.me-anim-tile--dk-instalator-1 .card{
  height:30%;flex:none;
  background:#112330;border:1.5px solid rgba(51,229,189,.14);border-radius:12px;
  padding:4.2% 5.5%;display:flex;flex-direction:column;gap:4.5%;min-width:0;overflow:hidden;
}
.me-anim-tile--dk-instalator-1 .crow{display:flex;align-items:center;gap:4%;flex-shrink:0}
.me-anim-tile--dk-instalator-1 .cav{flex-shrink:0;width:1.6em;height:1.6em;border-radius:50%;background:#1a2b3d;border:1.5px solid rgba(51,229,189,.3);display:flex;align-items:center;justify-content:center;font-size:clamp(7px,1.4cqw,9px);font-weight:700;color:#33e5bd}
.me-anim-tile--dk-instalator-1 .cwho{min-width:0}
.me-anim-tile--dk-instalator-1 .cnm{display:block;font-size:clamp(8px,1.65cqw,10.5px);font-weight:600;color:#dbe6ee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-anim-tile--dk-instalator-1 .cwh{display:block;font-size:clamp(7px,1.4cqw,9px);color:#7e93a3;white-space:nowrap}
.me-anim-tile--dk-instalator-1 .ctx{font-size:clamp(8px,1.65cqw,11px);color:#a9bcc8;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0}
.me-anim-tile--dk-instalator-1 .emj{display:inline-block;font-size:1em;line-height:1;vertical-align:-0.15em}
.me-anim-tile--dk-instalator-1 .cimg{flex:1;min-height:0;border-radius:8px;background:linear-gradient(120deg,#155448,#0d2b26 55%,#1a3a4a);position:relative;overflow:hidden}
.me-anim-tile--dk-instalator-1 .cimg::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(9,20,30,.5))}
.me-anim-tile--dk-instalator-1 .cimg .ph{position:absolute;left:8%;bottom:10%;width:26%;height:38%;border-radius:4px;background:rgba(51,229,189,.28);box-shadow:14% 0 rgba(51,229,189,.18)}
.me-anim-tile--dk-instalator-1 .creact{display:flex;gap:1.2em;font-size:clamp(7px,1.45cqw,9.5px);font-weight:600;color:#8fa0ad;flex-shrink:0}
.me-anim-tile--dk-instalator-1 .creact b{color:#33e5bd}

/* ═══════ PRZYCIEMNIENIE TŁA ═══════ */
.me-anim-tile--dk-instalator-1 .feedwin::after{
  content:'';position:absolute;inset:0;background:rgba(9,18,27,.58);
  opacity:0;animation:medk_dk_instalator_1_1 13s ease infinite;z-index:2;
}
@keyframes medk_dk_instalator_1_1{0%,18%{opacity:0}24%,84%{opacity:1}90%,100%{opacity:0}}

/* ═══════ REKLAMA-POPUP ═══════ */
.me-anim-tile--dk-instalator-1 .adfloat{
  position:absolute;left:3%;right:3%;top:50%;
  transform:translateY(-38%) scale(.92);opacity:0;z-index:3;
  background:#12312e;border:2px solid #33e5bd;border-radius:14px;
  padding:5.5% 6%;display:flex;flex-direction:column;gap:.7em;
  animation:medk_dk_instalator_1_0 13s cubic-bezier(.3,1.3,.4,1) infinite;
}
@keyframes medk_dk_instalator_1_0{
  0%,22%{opacity:0;transform:translateY(-28%) scale(.92);box-shadow:none}
  28%,84%{opacity:1;transform:translateY(-50%) scale(1);box-shadow:0 14px 40px rgba(0,0,0,.5),0 0 26px rgba(51,229,189,.4)}
  90%,100%{opacity:0;transform:translateY(-28%) scale(.92);box-shadow:none}
}
.me-anim-tile--dk-instalator-1 .adfloat .sp{
  position:absolute;top:-0.9em;right:6.5%;
  font-size:clamp(6px,1.25cqw,8px);font-weight:600;letter-spacing:.7px;text-transform:uppercase;
  color:#9fc9bc;background:#0f2a26;border:1px solid rgba(51,229,189,.45);
  border-radius:99px;padding:.28em .8em;
  box-shadow:0 4px 10px rgba(0,0,0,.35);
}
.me-anim-tile--dk-instalator-1 .adfloat .crow{gap:.7em;padding-right:32%}
.me-anim-tile--dk-instalator-1 .adfloat .cav{
  width:2.2em;height:2.2em;background:#0d2b26;border-color:#33e5bd;
}
.me-anim-tile--dk-instalator-1 .adfloat .cav svg{width:60%;height:60%}
.me-anim-tile--dk-instalator-1 .adfloat .lg-roof{fill:none;stroke:#e2f4ee;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.me-anim-tile--dk-instalator-1 .adfloat .lg-bolt{fill:#33e5bd}
.me-anim-tile--dk-instalator-1 .adfloat .cnm{font-size:clamp(10px,2.15cqw,14px);color:#e8fff8}
.me-anim-tile--dk-instalator-1 .adfloat .cwh{font-size:clamp(8px,1.65cqw,10.5px);color:#9fc9bc}
.me-anim-tile--dk-instalator-1 .adfloat .atx{
  font-size:clamp(9.5px,2cqw,13px);color:#cde9df;line-height:1.4;font-weight:500;
}
.me-anim-tile--dk-instalator-1 .adfloat .abtn{
  align-self:flex-start;margin-top:.15em;
  background:#33e5bd;color:#091722;font-weight:700;
  font-size:clamp(9px,1.9cqw,12.5px);padding:.55em 1.4em;border-radius:10px;
  box-shadow:0 4px 14px rgba(51,229,189,.35);white-space:nowrap;
}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-instalator-1 *{animation:none!important;transition:none!important}}

/* ── dk-instalator-2 ── */
.me-anim-tile--dk-instalator-2,.me-anim-tile--dk-instalator-2 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-instalator-2{
  aspect-ratio:1/1.12;width:100%;max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;position:relative;overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-instalator-2::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-instalator-2::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-instalator-2 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--dk-instalator-2 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-instalator-2 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-instalator-2 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-instalator-2 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-instalator-2 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-instalator-2 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-instalator-2 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-instalator-2 .app{flex:1;display:flex;flex-direction:column;padding:20% 8% 8%;gap:3.5%}
.me-anim-tile--dk-instalator-2 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-instalator-2 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-instalator-2 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-instalator-2 .stage{flex:1;display:flex;flex-direction:column;justify-content:space-evenly;min-height:0;gap:2.5%}

/* ═══════ KARTA PROFILU ═══════ */
.me-anim-tile--dk-instalator-2 .prof{
  flex-shrink:0;background:#112330;border:1.5px solid rgba(51,229,189,.22);
  border-radius:13px;overflow:hidden;
  opacity:0;transform:translateY(-30%);
  animation:medk_dk_instalator_2_0 13s cubic-bezier(.3,1.3,.4,1) infinite;
}
@keyframes medk_dk_instalator_2_0{0%,3%{opacity:0;transform:translateY(-30%)}8%,90%{opacity:1;transform:translateY(0)}95%,100%{opacity:0;transform:translateY(-30%)}}
.me-anim-tile--dk-instalator-2 .prof .cover{height:2em;background:linear-gradient(120deg,#155448,#0d2b26 60%,#123a35)}
.me-anim-tile--dk-instalator-2 .prof .prow{display:flex;align-items:flex-end;gap:4.5%;padding:0 5% 3.6%;margin-top:-1.1em}
.me-anim-tile--dk-instalator-2 .prof .pav{
  flex-shrink:0;width:2.5em;height:2.5em;border-radius:50%;
  background:#0d2b26;border:2.5px solid #33e5bd;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 12px rgba(0,0,0,.4);
}
.me-anim-tile--dk-instalator-2 .prof .pav svg{width:58%;height:58%}
.me-anim-tile--dk-instalator-2 .prof .pav .lg-roof{fill:none;stroke:#e2f4ee;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.me-anim-tile--dk-instalator-2 .prof .pav .lg-bolt{fill:#33e5bd}
.me-anim-tile--dk-instalator-2 .prof .pnm{min-width:0;padding-bottom:.15em}
.me-anim-tile--dk-instalator-2 .prof .pn{display:flex;align-items:center;gap:.35em;font-size:clamp(9.5px,2cqw,13px);font-weight:600;color:#e8fff8;white-space:nowrap;overflow:hidden}
.me-anim-tile--dk-instalator-2 .prof .pn .vf{flex-shrink:0;width:1em;height:1em;border-radius:50%;background:#33e5bd;display:flex;align-items:center;justify-content:center}
.me-anim-tile--dk-instalator-2 .prof .pn .vf svg{width:62%;height:62%;fill:none;stroke:#091722;stroke-width:3.6;stroke-linecap:round;stroke-linejoin:round}
.me-anim-tile--dk-instalator-2 .prof .pr{font-size:clamp(8px,1.6cqw,10.5px);color:#8fa0ad;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ═══════ ZAPYTANIA ═══════ */
.me-anim-tile--dk-instalator-2 .fcard{
  display:flex;gap:4.5%;align-items:flex-start;
  background:#112330;border:1.5px solid rgba(51,229,189,.16);border-radius:11px;
  padding:2.8% 5%;min-width:0;opacity:0;transform:translateY(35%);
}
.me-anim-tile--dk-instalator-2 .fcard .dotn{flex-shrink:0;width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7);margin-top:.35em}
.me-anim-tile--dk-instalator-2 .fcard .fx{min-width:0;flex:1}
.me-anim-tile--dk-instalator-2 .fcard .fn{font-size:clamp(8px,1.65cqw,10.5px);font-weight:600;color:#dbe6ee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-anim-tile--dk-instalator-2 .fcard .ft{font-size:clamp(8px,1.65cqw,11px);color:#a9bcc8;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-anim-tile--dk-instalator-2 .msg1{animation:medk_dk_instalator_2_1 13s cubic-bezier(.3,1.3,.4,1) infinite}
.me-anim-tile--dk-instalator-2 .msg2{animation:medk_dk_instalator_2_2 13s cubic-bezier(.3,1.3,.4,1) infinite}
.me-anim-tile--dk-instalator-2 .msg3{animation:medk_dk_instalator_2_3 13s cubic-bezier(.3,1.3,.4,1) infinite}
@keyframes medk_dk_instalator_2_1{0%,16%{opacity:0;transform:translateY(35%)}21%,90%{opacity:1;transform:translateY(0)}95%,100%{opacity:0;transform:translateY(35%)}}
@keyframes medk_dk_instalator_2_2{0%,32%{opacity:0;transform:translateY(35%)}37%,90%{opacity:1;transform:translateY(0)}95%,100%{opacity:0;transform:translateY(35%)}}
@keyframes medk_dk_instalator_2_3{0%,48%{opacity:0;transform:translateY(35%)}53%,90%{opacity:1;transform:translateY(0)}95%,100%{opacity:0;transform:translateY(35%)}}

/* ═══════ BADGE ═══════ */
.me-anim-tile--dk-instalator-2 .zbadge{
  align-self:center;flex-shrink:0;margin-bottom:2%;
  background:#33e5bd;color:#091722;font-weight:700;
  font-size:clamp(9px,1.9cqw,12.5px);padding:.45em 1.1em;border-radius:999px;
  box-shadow:0 6px 18px rgba(51,229,189,.4);white-space:nowrap;
  opacity:0;transform:scale(.7);animation:medk_dk_instalator_2_4 13s cubic-bezier(.3,1.5,.4,1) infinite;
}
@keyframes medk_dk_instalator_2_4{0%,62%{opacity:0;transform:scale(.7)}67%,90%{opacity:1;transform:scale(1)}95%,100%{opacity:0;transform:scale(.7)}}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-instalator-2 *{animation:none!important;transition:none!important}}

/* ── dk-instalator-3 ── */
.me-anim-tile--dk-instalator-3,.me-anim-tile--dk-instalator-3 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-instalator-3{
  aspect-ratio:1/1.12;width:100%;max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;position:relative;overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-instalator-3::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-instalator-3::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-instalator-3 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--dk-instalator-3 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-instalator-3 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-instalator-3 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-instalator-3 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-instalator-3 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-instalator-3 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-instalator-3 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-instalator-3 .app{flex:1;display:flex;flex-direction:column;padding:20% 8% 8%;gap:3.5%}
.me-anim-tile--dk-instalator-3 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-instalator-3 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-instalator-3 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-instalator-3 .stage{flex:1;display:flex;flex-direction:column;min-height:0;gap:4%}

/* ═══════ PLAYER ═══════ */
.me-anim-tile--dk-instalator-3 .player{
  flex-shrink:0;background:#0b1420;border:1.5px solid rgba(51,229,189,.2);
  border-radius:13px;overflow:hidden;display:flex;flex-direction:column;
  opacity:0;transform:translateY(-20%);
  animation:medk_dk_instalator_3_10 16s cubic-bezier(.3,1.3,.4,1) infinite;
}
@keyframes medk_dk_instalator_3_10{0%,2.5%{opacity:0;transform:translateY(-20%)}6.5%,92%{opacity:1;transform:translateY(0)}96%,100%{opacity:0;transform:translateY(-20%)}}
.me-anim-tile--dk-instalator-3 .vidarea{position:relative;width:100%;aspect-ratio:16/9.6;background:#0a1826}
.me-anim-tile--dk-instalator-3 .vidarea svg{position:absolute;inset:0;width:100%;height:100%}

/* schemat — kreska techniczna */
.me-anim-tile--dk-instalator-3 .sch{stroke:#a9d8cc;stroke-width:.85;fill:none;stroke-linecap:round;stroke-linejoin:round}
.me-anim-tile--dk-instalator-3 .sch.dash{stroke-dasharray:1.5 1.1}
.me-anim-tile--dk-instalator-3 .jd{fill:#a9d8cc}
.me-anim-tile--dk-instalator-3 .wire{fill:none;stroke:#33e5bd;stroke-width:1.05;stroke-linecap:round}
.me-anim-tile--dk-instalator-3 .mlab{fill:#8fa6b2;font-family:'Clash Display',sans-serif;font-weight:500;font-size:3.7px;letter-spacing:.1px}
.me-anim-tile--dk-instalator-3 .mval{fill:#33e5bd;font-family:'Clash Display',sans-serif;font-weight:600;font-size:3.4px}

/* komponenty pojawiają się po kolei */
.me-anim-tile--dk-instalator-3 .comp{opacity:0;transform-origin:center;transform-box:fill-box}
.me-anim-tile--dk-instalator-3 .g-pv{animation:medk_dk_instalator_3_4 16s ease infinite}
.me-anim-tile--dk-instalator-3 .g-inv{animation:medk_dk_instalator_3_5 16s ease infinite}
.me-anim-tile--dk-instalator-3 .g-bat{animation:medk_dk_instalator_3_6 16s ease infinite}
.me-anim-tile--dk-instalator-3 .g-grid{animation:medk_dk_instalator_3_7 16s ease infinite}
.me-anim-tile--dk-instalator-3 .g-gnd{animation:medk_dk_instalator_3_8 16s ease infinite}
@keyframes medk_dk_instalator_3_4{0%,8%{opacity:0;transform:scale(.85)}11.5%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.85)}}
@keyframes medk_dk_instalator_3_5{0%,19.5%{opacity:0;transform:scale(.85)}23%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.85)}}
@keyframes medk_dk_instalator_3_6{0%,32.5%{opacity:0;transform:scale(.85)}36%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.85)}}
@keyframes medk_dk_instalator_3_7{0%,44%{opacity:0;transform:scale(.85)}47%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.85)}}
@keyframes medk_dk_instalator_3_8{0%,49%{opacity:0;transform:scale(.85)}52%,92%{opacity:1;transform:scale(1)}96%,100%{opacity:0;transform:scale(.85)}}
/* przewody rysują się */
.me-anim-tile--dk-instalator-3 .w1{stroke-dasharray:30;stroke-dashoffset:30;animation:medk_dk_instalator_3_11 16s ease infinite}
.me-anim-tile--dk-instalator-3 .w2{stroke-dasharray:30;stroke-dashoffset:30;animation:medk_dk_instalator_3_12 16s ease infinite}
.me-anim-tile--dk-instalator-3 .w3{stroke-dasharray:30;stroke-dashoffset:30;animation:medk_dk_instalator_3_13 16s ease infinite}
@keyframes medk_dk_instalator_3_11{0%,12%{stroke-dashoffset:30}19%,92%{stroke-dashoffset:0}96%,100%{stroke-dashoffset:30}}
@keyframes medk_dk_instalator_3_12{0%,24.5%{stroke-dashoffset:30}32%,92%{stroke-dashoffset:0}96%,100%{stroke-dashoffset:30}}
@keyframes medk_dk_instalator_3_13{0%,37.5%{stroke-dashoffset:30}43%,92%{stroke-dashoffset:0}96%,100%{stroke-dashoffset:30}}

/* pasek playera */
.me-anim-tile--dk-instalator-3 .pbar{display:flex;align-items:center;gap:5%;padding:3.2% 4.5%;background:#0d1e2c}
.me-anim-tile--dk-instalator-3 .pbtn{flex-shrink:0;width:1.5em;height:1.5em;border-radius:50%;background:#33e5bd;display:flex;align-items:center;justify-content:center}
.me-anim-tile--dk-instalator-3 .pbtn svg{width:46%;height:46%;fill:#091722;margin-left:8%}
.me-anim-tile--dk-instalator-3 .ptrack{flex:1;height:4.5px;border-radius:99px;background:rgba(255,255,255,.12);overflow:hidden}
.me-anim-tile--dk-instalator-3 .ptrack i{
  display:block;height:100%;border-radius:99px;background:#33e5bd;
  box-shadow:0 0 8px rgba(51,229,189,.6);
  transform:scaleX(0);transform-origin:left;
  animation:medk_dk_instalator_3_9 16s linear infinite;
}
@keyframes medk_dk_instalator_3_9{0%,8%{transform:scaleX(0)}69%,92%{transform:scaleX(1)}96%,100%{transform:scaleX(0)}}
.me-anim-tile--dk-instalator-3 .ptime{flex-shrink:0;font-size:clamp(7px,1.45cqw,9.5px);color:#8fa0ad;font-weight:500}

/* ═══════ DOKUMENTACJA ═══════ */
.me-anim-tile--dk-instalator-3 .docs{
  flex:1;min-height:0;background:#112330;border:1.5px solid rgba(51,229,189,.16);
  border-radius:12px;padding:4.5% 5.5%;display:flex;flex-direction:column;
  justify-content:space-evenly;gap:2.5%;overflow:hidden;
  opacity:0;transform:translateY(25%);
  animation:medk_dk_instalator_3_3 16s ease infinite;
}
@keyframes medk_dk_instalator_3_3{0%,5%{opacity:0;transform:translateY(25%)}9%,92%{opacity:1;transform:translateY(0)}96%,100%{opacity:0;transform:translateY(25%)}}
.me-anim-tile--dk-instalator-3 .docs .dt{font-size:clamp(8.5px,1.75cqw,11.5px);color:#8fa0ad;font-weight:600;letter-spacing:.5px;text-transform:uppercase;flex-shrink:0}
.me-anim-tile--dk-instalator-3 .dline{display:flex;align-items:center;gap:4%;min-width:0;opacity:0}
.me-anim-tile--dk-instalator-3 .dline .di{flex-shrink:0;width:1.35em;height:1.35em;border-radius:6px;background:rgba(51,229,189,.14);display:flex;align-items:center;justify-content:center}
.me-anim-tile--dk-instalator-3 .dline .di svg{width:58%;height:58%;fill:none;stroke:#33e5bd;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.me-anim-tile--dk-instalator-3 .dline .dx{font-size:clamp(9px,1.9cqw,12.5px);color:#c7d3dd;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-anim-tile--dk-instalator-3 .dl1{animation:medk_dk_instalator_3_0 16s ease infinite}
.me-anim-tile--dk-instalator-3 .dl2{animation:medk_dk_instalator_3_1 16s ease infinite}
.me-anim-tile--dk-instalator-3 .dl3{animation:medk_dk_instalator_3_2 16s ease infinite}
@keyframes medk_dk_instalator_3_0{0%,50.5%{opacity:0;transform:translateX(-6%)}54.5%,92%{opacity:1;transform:translateX(0)}96%,100%{opacity:0;transform:translateX(-6%)}}
@keyframes medk_dk_instalator_3_1{0%,57%{opacity:0;transform:translateX(-6%)}61%,92%{opacity:1;transform:translateX(0)}96%,100%{opacity:0;transform:translateX(-6%)}}
@keyframes medk_dk_instalator_3_2{0%,63.5%{opacity:0;transform:translateX(-6%)}67.5%,92%{opacity:1;transform:translateX(0)}96%,100%{opacity:0;transform:translateX(-6%)}}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-instalator-3 *{animation:none!important;transition:none!important}}

/* ── dk-instalator-4 ── */
.me-anim-tile--dk-instalator-4,.me-anim-tile--dk-instalator-4 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-instalator-4{
  aspect-ratio:1/1.12;width:100%;max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;position:relative;overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-instalator-4::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-instalator-4::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-instalator-4 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--dk-instalator-4 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-instalator-4 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-instalator-4 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-instalator-4 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-instalator-4 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-instalator-4 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-instalator-4 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-instalator-4 .app{flex:1;display:flex;flex-direction:column;padding:20% 8% 8%;gap:3.5%}
.me-anim-tile--dk-instalator-4 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-instalator-4 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-instalator-4 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}
.me-anim-tile--dk-instalator-4 .stage{flex:1;display:flex;flex-direction:column;justify-content:center;min-height:0;gap:6%}

/* ═══════ PASEK WERYFIKACJI (nad kartą) ═══════ */
.me-anim-tile--dk-instalator-4 .verify{
  background:#112330;border:1.5px solid rgba(51,229,189,.16);border-radius:11px;
  padding:3.6% 5%;display:flex;flex-direction:column;gap:.55em;
  opacity:0;animation:medk_dk_instalator_4_7 12s ease infinite;
}
@keyframes medk_dk_instalator_4_7{0%,6%{opacity:0;transform:translateY(25%)}12%,88%{opacity:1;transform:translateY(0)}94%,100%{opacity:0;transform:translateY(25%)}}
.me-anim-tile--dk-instalator-4 .verify .vt{display:flex;justify-content:space-between;font-size:clamp(8px,1.65cqw,10.5px);color:#8fa0ad;font-weight:500}
.me-anim-tile--dk-instalator-4 .verify .vt .done{color:#33e5bd;opacity:0;animation:medk_dk_instalator_4_2 12s ease infinite}
@keyframes medk_dk_instalator_4_2{0%,42%{opacity:0}46%,88%{opacity:1}94%,100%{opacity:0}}
.me-anim-tile--dk-instalator-4 .vbar{height:5px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}
.me-anim-tile--dk-instalator-4 .vbar i{
  display:block;height:100%;border-radius:99px;background:#33e5bd;
  box-shadow:0 0 8px rgba(51,229,189,.6);
  transform:scaleX(0);transform-origin:left;
  animation:medk_dk_instalator_4_0 12s ease infinite;
}
@keyframes medk_dk_instalator_4_0{0%,14%{transform:scaleX(0)}42%,88%{transform:scaleX(1)}94%,100%{transform:scaleX(0)}}

/* ═══════ KARTA FIRMY ═══════ */
.me-anim-tile--dk-instalator-4 .fcard{
  background:#112330;border:2px solid rgba(51,229,189,.18);border-radius:14px;
  padding:6.5% 6.5%;display:flex;align-items:center;gap:5%;position:relative;
  opacity:0;transform:translateY(20%);
  animation:medk_dk_instalator_4_1 12s cubic-bezier(.3,1.3,.4,1) infinite,medk_dk_instalator_4_3 12s ease infinite;
}
@keyframes medk_dk_instalator_4_1{0%,3%{opacity:0;transform:translateY(20%)}9%,88%{opacity:1;transform:translateY(0)}94%,100%{opacity:0;transform:translateY(20%)}}
@keyframes medk_dk_instalator_4_3{
  0%,52%{border-color:rgba(51,229,189,.18);box-shadow:none}
  58%,88%{border-color:#33e5bd;box-shadow:0 0 24px rgba(51,229,189,.35)}
  94%,100%{border-color:rgba(51,229,189,.18);box-shadow:none}
}
.me-anim-tile--dk-instalator-4 .fcard .lg{
  flex-shrink:0;width:3em;height:3em;border-radius:50%;
  background:#0d2b26;border:2.5px solid #33e5bd;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 12px rgba(0,0,0,.4);
}
.me-anim-tile--dk-instalator-4 .fcard .lg svg{width:58%;height:58%}
.me-anim-tile--dk-instalator-4 .lg-roof{fill:none;stroke:#e2f4ee;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.me-anim-tile--dk-instalator-4 .lg-bolt{fill:#33e5bd}
.me-anim-tile--dk-instalator-4 .fcard .fx{min-width:0;flex:1}
.me-anim-tile--dk-instalator-4 .fcard .nrow{display:flex;align-items:center;gap:.4em}
.me-anim-tile--dk-instalator-4 .fcard .fn{font-size:clamp(12px,2.55cqw,17px);font-weight:600;color:#e8fff8;white-space:nowrap}
.me-anim-tile--dk-instalator-4 .fcard .vf{
  flex-shrink:0;width:1.15em;height:1.15em;border-radius:50%;background:#33e5bd;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 10px rgba(51,229,189,.6);
  opacity:0;transform:scale(0);
  animation:medk_dk_instalator_4_6 12s cubic-bezier(.3,1.8,.4,1) infinite;
}
@keyframes medk_dk_instalator_4_6{0%,44%{opacity:0;transform:scale(0)}50%,88%{opacity:1;transform:scale(1)}94%,100%{opacity:0;transform:scale(0)}}
.me-anim-tile--dk-instalator-4 .fcard .vf svg{width:62%;height:62%;fill:none;stroke:#091722;stroke-width:3.6;stroke-linecap:round;stroke-linejoin:round}
/* podtytuł — odsunięty od nazwy */
.me-anim-tile--dk-instalator-4 .fcard .subw{position:relative;height:1.4em;margin-top:.65em;overflow:visible}
.me-anim-tile--dk-instalator-4 .fcard .subw span{position:absolute;left:0;top:0;white-space:nowrap;font-size:clamp(8.5px,1.8cqw,12px);font-weight:500}
.me-anim-tile--dk-instalator-4 .fcard .s-old{color:#8fa0ad;animation:medk_dk_instalator_4_5 12s ease infinite}
@keyframes medk_dk_instalator_4_5{0%,50%{opacity:1;transform:translateY(0)}56%,100%{opacity:0;transform:translateY(-40%)}}
.me-anim-tile--dk-instalator-4 .fcard .s-new{color:#33e5bd;opacity:0;animation:medk_dk_instalator_4_4 12s ease infinite}
@keyframes medk_dk_instalator_4_4{0%,52%{opacity:0;transform:translateY(45%)}58%,88%{opacity:1;transform:translateY(0)}94%,100%{opacity:0;transform:translateY(45%)}}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-instalator-4 *{animation:none!important;transition:none!important}}

/* ── dk-instalator-5 ── */
.me-anim-tile--dk-instalator-5,.me-anim-tile--dk-instalator-5 *{margin:0;padding:0;box-sizing:border-box}

/* ═══════ KAFELEK 1:1 Z TŁEM ═══════ */
.me-anim-tile--dk-instalator-5{
  aspect-ratio:1/1.12;width:100%;max-width:520px;
  font-family:'Clash Display',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);
  border-radius:24px;position:relative;overflow:hidden;container-type:inline-size;margin:0 auto}
.me-anim-tile--dk-instalator-5::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;pointer-events:none;
}
.me-anim-tile--dk-instalator-5::after{
  content:'';position:absolute;left:50%;bottom:-20%;transform:translateX(-50%);
  width:80%;height:70%;border-radius:50%;
  background:radial-gradient(circle,rgba(51,229,189,.16),transparent 65%);
  pointer-events:none;
}

/* ═══════ TELEFON ═══════ */
.me-anim-tile--dk-instalator-5 .phone{
  position:absolute;left:50%;bottom:-6%;transform:translateX(-50%);
  width:64%;height:96%;background:#0b0f14;
  border-radius:13% 13% 0 0 / 8.5% 8.5% 0 0;
  padding:3.2%;padding-bottom:0;
  box-shadow:0 -8px 40px rgba(0,0,0,.55),inset 0 0 0 2px #1c232e;z-index:2;
}
.me-anim-tile--dk-instalator-5 .btn-side{position:absolute;background:#1c232e;border-radius:4px}
.me-anim-tile--dk-instalator-5 .btn-side.l1{left:-1.2%;top:22%;width:1.4%;height:7%}
.me-anim-tile--dk-instalator-5 .btn-side.l2{left:-1.2%;top:32%;width:1.4%;height:11%}
.me-anim-tile--dk-instalator-5 .btn-side.r1{right:-1.2%;top:26%;width:1.4%;height:14%}
.me-anim-tile--dk-instalator-5 .screen{
  width:100%;height:100%;background:#0e1621;
  border-radius:10% 10% 0 0 / 6.5% 6.5% 0 0;
  position:relative;overflow:hidden;display:flex;flex-direction:column;
}
.me-anim-tile--dk-instalator-5 .island{
  position:absolute;top:3.5%;left:50%;transform:translateX(-50%);
  width:34%;height:4.6%;background:#000;border-radius:999px;z-index:5;
  display:flex;align-items:center;justify-content:flex-end;padding-right:3%;
}
.me-anim-tile--dk-instalator-5 .island::after{content:'';width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3a52,#0a0f18 70%)}
.me-anim-tile--dk-instalator-5 .app{flex:1;display:flex;flex-direction:column;padding:20% 8% 8%;gap:3%}
.me-anim-tile--dk-instalator-5 .app-head{font-size:clamp(12px,2.4cqw,17px);font-weight:600;color:#e2e8f4;display:flex;align-items:center;gap:6px}
.me-anim-tile--dk-instalator-5 .app-head .dot{width:.55em;height:.55em;border-radius:50%;background:#33e5bd;box-shadow:0 0 8px rgba(51,229,189,.7)}
.me-anim-tile--dk-instalator-5 .app-sub{font-size:clamp(10px,2cqw,14px);color:#8fa0ad;font-weight:400;margin-top:-2%}

/* ═══════ ZAKŁADKI ═══════ */
.me-anim-tile--dk-instalator-5 .tabs{flex-shrink:0;display:flex;gap:2.5%;margin-top:1%}
.me-anim-tile--dk-instalator-5 .tab{
  flex:1;text-align:center;
  font-size:clamp(7.5px,1.55cqw,10px);font-weight:600;color:#7e93a3;
  background:#112330;border:1.5px solid rgba(51,229,189,.16);
  border-radius:9px;padding:.55em 0;white-space:nowrap;
  animation:medk_dk_instalator_5_0 16s ease infinite;
}
@keyframes medk_dk_instalator_5_0{
  0%,1%{color:#7e93a3;background:#112330;border-color:rgba(51,229,189,.16)}
  3%,23%{color:#091722;background:#33e5bd;border-color:#33e5bd}
  25%,100%{color:#7e93a3;background:#112330;border-color:rgba(51,229,189,.16)}
}
.me-anim-tile--dk-instalator-5 .tab.t2{animation-delay:4s}
.me-anim-tile--dk-instalator-5 .tab.t3{animation-delay:8s}
.me-anim-tile--dk-instalator-5 .tab.t4{animation-delay:12s}

/* ═══════ PANELE RANKINGU ═══════ */
.me-anim-tile--dk-instalator-5 .stage{flex:1;min-height:0;position:relative;margin-top:2%}
.me-anim-tile--dk-instalator-5 .panel{
  position:absolute;inset:0;opacity:0;
  animation:medk_dk_instalator_5_1 16s ease infinite;
}
@keyframes medk_dk_instalator_5_1{
  0%,1.5%{opacity:0;transform:translateY(4%)}
  4%,23%{opacity:1;transform:translateY(0)}
  25.5%,100%{opacity:0;transform:translateY(4%)}
}
.me-anim-tile--dk-instalator-5 .panel.p2{animation-delay:4s}
.me-anim-tile--dk-instalator-5 .panel.p3{animation-delay:8s}
.me-anim-tile--dk-instalator-5 .panel.p4{animation-delay:12s}

/* kolumna miejsc 1–4 (statyczna) */
.me-anim-tile--dk-instalator-5 .rk{
  position:absolute;left:0;width:1.5em;height:21%;
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(9px,1.9cqw,12.5px);font-weight:700;color:#7e93a3;
}
.me-anim-tile--dk-instalator-5 .rk.r1{top:0;color:#33e5bd}
.me-anim-tile--dk-instalator-5 .rk.r2{top:25.3%}
.me-anim-tile--dk-instalator-5 .rk.r3{top:50.7%}
.me-anim-tile--dk-instalator-5 .rk.r4{top:76%}

/* karty produktów */
.me-anim-tile--dk-instalator-5 .pc{
  position:absolute;left:2em;right:0;height:21%;
  background:#112330;border:1.5px solid rgba(51,229,189,.14);border-radius:10px;
  padding:0 4.5%;display:flex;align-items:center;gap:4.5%;min-width:0;
}
.me-anim-tile--dk-instalator-5 .pc .ic{flex-shrink:0;width:1.7em;height:1.7em;border-radius:7px;background:rgba(51,229,189,.12);display:flex;align-items:center;justify-content:center}
.me-anim-tile--dk-instalator-5 .pc .ic svg{width:62%;height:62%;fill:none;stroke:#33e5bd;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.me-anim-tile--dk-instalator-5 .pc .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:.35em}
.me-anim-tile--dk-instalator-5 .pc .b1{height:.5em;border-radius:99px;background:rgba(255,255,255,.22)}
.me-anim-tile--dk-instalator-5 .pc .b2{height:.4em;border-radius:99px;background:rgba(255,255,255,.1)}
.me-anim-tile--dk-instalator-5 .pc .up{
  flex-shrink:0;font-size:clamp(8px,1.7cqw,11px);font-weight:700;color:#33e5bd;
  opacity:0;animation:medk_dk_instalator_5_2 16s ease infinite;
}
@keyframes medk_dk_instalator_5_2{0%,12%{opacity:0}15%,22%{opacity:1}24%,100%{opacity:0}}

/* ── przetasowanie: 2→1, 3→2, 4→3, a lider spada na 4 ── */
.me-anim-tile--dk-instalator-5 .pc.mvA{top:25.3%;z-index:2;animation:medk_dk_instalator_5_3 16s cubic-bezier(.35,1.2,.4,1) infinite}
@keyframes medk_dk_instalator_5_3{
  0%,7%{top:25.3%;border-color:rgba(51,229,189,.14);box-shadow:none}
  12%{top:0}
  14%,22%{top:0;border-color:#33e5bd;box-shadow:0 0 16px rgba(51,229,189,.35)}
  24%,98%{top:0;border-color:rgba(51,229,189,.14);box-shadow:none}
  100%{top:25.3%}
}
.me-anim-tile--dk-instalator-5 .pc.mvB{top:50.7%;z-index:2;animation:medk_dk_instalator_5_4 16s cubic-bezier(.35,1.2,.4,1) infinite}
@keyframes medk_dk_instalator_5_4{0%,8%{top:50.7%}13%,98%{top:25.3%}100%{top:50.7%}}
.me-anim-tile--dk-instalator-5 .pc.mvC{top:76%;z-index:2;animation:medk_dk_instalator_5_5 16s cubic-bezier(.35,1.2,.4,1) infinite}
@keyframes medk_dk_instalator_5_5{0%,9%{top:76%}14%,98%{top:50.7%}100%{top:76%}}
.me-anim-tile--dk-instalator-5 .pc.mvD{top:0;z-index:1;animation:medk_dk_instalator_5_6 16s ease infinite}
@keyframes medk_dk_instalator_5_6{
  0%,7%{top:0;opacity:1}
  9.5%{opacity:.45}
  13%,98%{top:76%;opacity:1}
  100%{top:0}
}
.me-anim-tile--dk-instalator-5 .p2 .pc{animation-delay:4s}
.me-anim-tile--dk-instalator-5 .p3 .pc{animation-delay:8s}
.me-anim-tile--dk-instalator-5 .p4 .pc{animation-delay:12s}
.me-anim-tile--dk-instalator-5 .p2 .pc .up{animation-delay:4s}
.me-anim-tile--dk-instalator-5 .p3 .pc .up{animation-delay:8s}
.me-anim-tile--dk-instalator-5 .p4 .pc .up{animation-delay:12s}
@media (prefers-reduced-motion:reduce){.me-anim-tile--dk-instalator-5 *{animation:none!important;transition:none!important}}

/* ── placeholder ── */
.me-anim-tile--placeholder{
  width:100%;max-width:520px;margin:0 auto;aspect-ratio:1/1.12;
  font-family:'Clash Display','ClashDisplay',sans-serif;
  background:linear-gradient(160deg,#123a35 0%,#0d1e2c 55%,#0c1a27 100%);
  border:1px solid rgba(51,229,189,.15);border-radius:24px;
  position:relative;overflow:hidden;display:grid;place-items:center;
}
.me-anim-tile--placeholder::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(51,229,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(51,229,189,.05) 1px,transparent 1px);
  background-size:26px 26px;
}
.me-anim-tile--placeholder span{
  position:relative;color:#8fa0ad;font-size:15px;font-weight:500;letter-spacing:.03em;
  padding:10px 18px;border:1px solid rgba(51,229,189,.22);border-radius:999px;
  background:rgba(51,229,189,.06);animation:me-dk-ph-pulse 2.6s ease-in-out infinite;
}
@keyframes me-dk-ph-pulse{0%,100%{opacity:.55}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.me-anim-tile--placeholder span{animation:none;opacity:.8}}