/* =====================================================================
   BMF — robot w ringu, animowany element hero
   Wymaga: bmf-robot.css, bmf-robot.js (opcjonalny), 3 pliki graficzne.
   Bez bibliotek, bez build-stepu.
   ===================================================================== */

.bmf-robot {
  /* --- do sterowania z zewnątrz ------------------------------------- */
  --bmf-neon: #01dafe;              /* kolor światła ringu              */
  --bmf-neon-soft: #73ebfe;
  --bmf-neon-pale: #b8f2ff;
  --bmf-atmo: 1;                    /* gęstość dymu: 0 = czysto, 1.8 = zadymiona hala */
  --bmf-dust: 1;                    /* ilość pyłu w powietrzu           */
  /* Placeholder wjeżdża inline (255 B), więc kadr jest na ekranie w pierwszej
     klatce. Pełna scena (54 kB) dociąga się w tle i przenika przez ::after. */
  --bmf-photo: url("data:image/webp;base64,UklGRqYAAABXRUJQVlA4IJoAAACQBQCdASogABIAPwFqsE8rJiSiKA1RYCAJZACdMunWAAqlZ5+XN91IPEGNyLlOc0jjq5sDwAD+9o2l8K4GRF/aCl6LXLSp6KVRpeHaAwBhs4KQngI3EUZ37N8MQfKYJG3fTfMySM+Jn+c1E03u9qsIkne87/6XIu6YI+TvHIjKl5kiG1so05uPQr7Kl06dReZwm22fiNTsAAAA");
  --bmf-photo-full: url("ring-scene.webp");
  --bmf-smoke-a: url("smoke-a.webp");
  --bmf-smoke-b: url("smoke-b.webp");
  --bmf-flicker: bmfFlicker;        /* bmfFlicker | bmfPulse | none     */
  --bmf-flicker-ease: steps(1, end);

  position: relative;
  width: 100%;
  aspect-ratio: 1600 / 780;         /* proporcja, dla której wyliczono światła */
  overflow: hidden;
  background: #04070a;
  isolation: isolate;
}

.bmf-robot > * { pointer-events: none; }

/* Cała scena — zdjęcie, świetlówki, rdzeń, kamera, dym — jedzie jako JEDNA
   warstwa, więc światła nigdy nie odklejają się od lamp ani od robota.
   Winieta i scanlines zostają nieruchome, bo ramują kadr. */
.bmf-robot__scene {
  position: absolute; inset: 0;
  will-change: transform;
}

/* --- zdjęcie ------------------------------------------------------- */
.bmf-robot__photo {
  position: absolute;
  inset: -3%;
  background: var(--bmf-photo) center / cover no-repeat;
  background-position: 58% 50%;
  /* placeholder to 32 px w poziomie — bez rozmycia widać kwadraty */
  filter: blur(18px);
  transform: scale(1.04);
}

/* Pełna scena jako osobna warstwa: przeglądarka pobiera ją równolegle, a my
   pokazujemy ją dopiero, gdy plik jest zdekodowany (klasę dopina JS). */
.bmf-robot__photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--bmf-photo-full) center / cover no-repeat;
  background-position: 58% 50%;
  opacity: 0;
  transition: opacity 0.45s ease-out;
}
.bmf-robot.is-photo-ready .bmf-robot__photo { filter: none; transform: none; }
.bmf-robot.is-photo-ready .bmf-robot__photo::after { opacity: 1; }

/* Bez JS nie ma kto dopiąć klasy — pokaż pełną scenę od razu. */
html:not(.js) .bmf-robot__photo { filter: none; transform: none; }
html:not(.js) .bmf-robot__photo::after { opacity: 1; }

/* Dym startuje dopiero po scenie: najpierw kadr, potem ruch. Selektor z .js
   ma wyższą swoistość niż bazowa reguła .bmf-robot__smoke niżej w pliku. */
.js .bmf-robot__smoke { opacity: 0; transition: opacity 0.8s ease-out; }
.js .bmf-robot.is-photo-ready .bmf-robot__smoke { opacity: var(--bmf-atmo); }

/* Tryb oszczędny (save-data, 2G): zostaje sam placeholder, zero dociągania. */
.is-lite .bmf-robot__photo { filter: blur(12px); }
.is-lite .bmf-robot__photo::after,
.is-lite .bmf-robot__smoke,
.is-lite .bmf-robot__dust { display: none; }
.is-lite .bmf-robot *,
.is-lite .bmf-robot *::before,
.is-lite .bmf-robot *::after { animation: none !important; }

/* --- światło kluczowe sceny ---------------------------------------- */
.bmf-robot__key {
  position: absolute;
  inset: 0;
  background: radial-gradient(58% 68% at 68% 44%, color-mix(in srgb, var(--bmf-neon) 20%, transparent) 0%, transparent 66%);
  mix-blend-mode: screen;
  animation: bmfGlow 6.5s ease-in-out infinite;
}

/* --- mgła w tle ---------------------------------------------------- */
.bmf-robot__fog { position: absolute; inset: 0; opacity: var(--bmf-atmo); }
.bmf-robot__fog::before,
.bmf-robot__fog::after { content: ""; position: absolute; mix-blend-mode: screen; }
.bmf-robot__fog::before {
  inset: -12%;
  background: radial-gradient(44% 36% at 40% 72%, #9fd8e8 0%, transparent 62%),
              radial-gradient(36% 30% at 68% 84%, #cfe9f2 0%, transparent 60%);
  filter: blur(46px); opacity: .42;
  animation: bmfFogA 26s ease-in-out infinite, bmfFogPulse 11s ease-in-out infinite;
}
.bmf-robot__fog::after {
  inset: -14%;
  background: radial-gradient(38% 32% at 76% 58%, #7fc4da 0%, transparent 58%),
              radial-gradient(30% 26% at 52% 48%, #b3e2ef 0%, transparent 62%);
  filter: blur(58px); opacity: .3;
  animation: bmfFogB 34s ease-in-out infinite, bmfFogPulse 15s ease-in-out infinite 2s;
}

/* --- świetlówki ringu ----------------------------------------------
   Pozycje i kąty zmierzone bezpośrednio na zdjęciu — nie ruszać bez
   ponownego pomiaru, inaczej światło odklei się od lamp.
   ------------------------------------------------------------------- */
.bmf-robot__tubes { position: absolute; inset: 0; }
.bmf-robot__tubes > div { position: absolute; transform-origin: left center; }
.bmf-robot__tubes .core {
  background: linear-gradient(90deg, transparent, var(--bmf-neon-soft) 12%, #ffffff 56%, var(--bmf-neon-pale) 92%, transparent);
  filter: blur(1.1px);
}
.bmf-robot__tubes .halo,
.bmf-robot__tubes .bloom {
  background: linear-gradient(90deg, transparent, var(--bmf-neon) 44%, var(--bmf-neon) 84%, transparent);
}

.bmf-robot .t1 { left: 63.98%; width: 38.86%; top: 90.9%; transform: rotate(3.46deg); animation: var(--bmf-flicker) 12s var(--bmf-flicker-ease) infinite 2.6s; }
.bmf-robot .t1.bloom { height: 82px; margin-top: -41px; filter: blur(45px); opacity: 0.22; }
.bmf-robot .t1.halo  { height: 32px; margin-top: -16px; filter: blur(19px); opacity: 0.56; }
.bmf-robot .t1.core  { height: 3.1px; opacity: 0.9; }

.bmf-robot .t2 { left: 83.15%; width: 17.37%; top: 31.81%; transform: rotate(1.35deg); animation: var(--bmf-flicker) 9s var(--bmf-flicker-ease) infinite; }
.bmf-robot .t2.bloom { height: 88px; margin-top: -44px; filter: blur(48px); opacity: 0.31; }
.bmf-robot .t2.halo  { height: 35px; margin-top: -17px; filter: blur(21px); opacity: 0.78; }
.bmf-robot .t2.core  { height: 3.8px; opacity: 1; }

.bmf-robot .t3 { left: 33.87%; width: 19.23%; top: 69.76%; transform: rotate(24.62deg); animation: var(--bmf-flicker) 13s var(--bmf-flicker-ease) infinite 3.4s; }
.bmf-robot .t3.bloom { height: 75px; margin-top: -37px; filter: blur(41px); opacity: 0.22; }
.bmf-robot .t3.halo  { height: 30px; margin-top: -15px; filter: blur(18px); opacity: 0.56; }
.bmf-robot .t3.core  { height: 3.1px; opacity: 0.92; }

.bmf-robot .t4 { left: 23.61%; width: 9.93%; top: 54.14%; transform: rotate(-23.1deg); animation: var(--bmf-flicker) 10s var(--bmf-flicker-ease) infinite 2.1s; }
.bmf-robot .t4.bloom { height: 82px; margin-top: -41px; filter: blur(45px); opacity: 0.25; }
.bmf-robot .t4.halo  { height: 32px; margin-top: -16px; filter: blur(19px); opacity: 0.62; }
.bmf-robot .t4.core  { height: 3.1px; opacity: 0.99; }

/* świetlówka przy pięści — klin, szerszy i miękki przy dłoni */
.bmf-robot .t5 { left: 45.49%; width: 14.04%; top: 37.69%; transform: rotate(-4.96deg);
  animation: var(--bmf-flicker) 14s var(--bmf-flicker-ease) infinite 4.2s; }
.bmf-robot .t5.bloom { height: 74px; margin-top: -37px; filter: blur(40px); opacity: .2;
  background: linear-gradient(90deg, transparent 12%, color-mix(in srgb, var(--bmf-neon) 35%, transparent) 50%, var(--bmf-neon) 88%, transparent); }
.bmf-robot .t5.halo  { height: 34px; margin-top: -17px; filter: blur(20px); opacity: .4;
  background: linear-gradient(90deg, transparent 10%, color-mix(in srgb, var(--bmf-neon) 30%, transparent) 46%, var(--bmf-neon) 88%, transparent); }
.bmf-robot .t5.core  { height: 18px; margin-top: -9px; filter: blur(5px); opacity: .52;
  clip-path: polygon(0 34%, 100% 8%, 100% 92%, 0 66%);
  background: linear-gradient(90deg, transparent 6%, color-mix(in srgb, var(--bmf-neon-soft) 15%, transparent) 30%, rgb(255 255 255 / .55) 66%, color-mix(in srgb, var(--bmf-neon-pale) 45%, transparent) 88%, transparent); }

/* --- smuga reflektora ---------------------------------------------- */
.bmf-robot__sweep {
  position: absolute; left: 0; right: 0; top: 14%; height: 27%;
  mix-blend-mode: screen;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 32%, #000 68%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0%, #000 32%, #000 68%, transparent 100%);
}
.bmf-robot__sweep::before {
  content: ""; position: absolute; inset: 0; width: 26%;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--bmf-neon) 31%, transparent), transparent);
  filter: blur(26px);
  animation: bmfSweep 13s linear infinite;
}

/* --- rdzeń na klatce robota ----------------------------------------- */
.bmf-robot__core,
.bmf-robot__core-mid,
.bmf-robot__core-halo,
.bmf-robot__core-bleed { position: absolute; border-radius: 50%; mix-blend-mode: screen; }

/* Rdzeń rozjaśnia się razem z kamerą w wizorze, gdy kursor jest nad sceną. */
.bmf-robot__core,
.bmf-robot__core-mid,
.bmf-robot__core-halo,
.bmf-robot__core-bleed {
  transition: opacity .55s ease, filter .55s ease;
  filter: brightness(var(--bmf-live, .55));
}

/* miękka, przezroczysta poświata schodząca z rdzenia w stronę łokcia */
.bmf-robot__core-bleed {
  left: 57.4%; top: 30.5%; width: 21%; height: 34%;
  border-radius: 46% 54% 58% 42% / 38% 36% 64% 62%;
  background: radial-gradient(58% 46% at 54% 30%,
              color-mix(in srgb, var(--bmf-neon-soft) 55%, transparent) 0%,
              color-mix(in srgb, var(--bmf-neon) 34%, transparent) 34%,
              color-mix(in srgb, #0086ad 22%, transparent) 58%, transparent 78%);
  filter: blur(44px) brightness(var(--bmf-live, 1));
  opacity: .22;
  animation: bmfCore 3.6s ease-in-out infinite; animation-play-state: var(--bmf-cam-run, paused);
}
.bmf-robot__core-halo { left: 61.66%; top: 27.87%; width: 12%; height: 22.56%;
  background: radial-gradient(circle, var(--bmf-neon-soft) 0%, color-mix(in srgb, var(--bmf-neon) 50%, transparent) 26%, color-mix(in srgb, var(--bmf-neon) 30%, transparent) 48%, transparent 72%);
  filter: blur(30px); opacity: .34; animation: bmfCore 3.6s ease-in-out infinite; animation-play-state: var(--bmf-cam-run, paused); }
.bmf-robot__core-mid { left: 64.47%; top: 33.29%; width: 6.38%; height: 11.79%;
  background: radial-gradient(circle, #ffffff 0%, var(--bmf-neon-soft) 22%, color-mix(in srgb, var(--bmf-neon) 60%, transparent) 46%, transparent 72%);
  filter: blur(14px); opacity: .46; animation: bmfCore 3.6s ease-in-out infinite; animation-play-state: var(--bmf-cam-run, paused); }
.bmf-robot__core { left: 66.66%; top: 37.14%; width: 2%; height: 4.1%;
  background: radial-gradient(circle, #ffffff 0%, var(--bmf-neon-soft) 28%, var(--bmf-neon) 52%, transparent 74%);
  filter: blur(3px); opacity: .72; animation: bmfCore 3.6s ease-in-out infinite; animation-play-state: var(--bmf-cam-run, paused); }

/* --- kamera w wizorze ----------------------------------------------
   UWAGA: bez data-bmf-parallax — ma stać nieruchomo na głowie.
   Zapala się na stałe, raz na 13 s krótko gaśnie. Pełną jasność
   i animację włącza ruch myszy (bmf-robot.js).
   ------------------------------------------------------------------- */
.bmf-robot__cam {
  position: absolute; left: 66%; top: 16.79%; width: 3.375%; height: 3.08%;
  mix-blend-mode: screen;
  opacity: var(--bmf-cam-live, .3);
  transition: opacity .55s ease;
}
.bmf-robot__cam::before,
.bmf-robot__cam::after {
  content: ""; position: absolute;
  animation: bmfCam 10.8s steps(1, end) infinite;
  animation-play-state: var(--bmf-cam-run, paused);
}
.bmf-robot__cam::before {
  left: 50%; top: 50%; width: 104px; height: 48px; margin: -24px 0 0 -52px;
  border-radius: 50%;
  background: radial-gradient(50% 50% at 50% 50%, #ff3b3b 0%, rgb(200 26 26 / .5) 44%, transparent 74%);
  filter: blur(12px); opacity: .45;
}
.bmf-robot__cam::after {
  left: 3px; right: 11px; top: 10px; height: 3.5px; border-radius: 2px;
  transform: rotate(-5deg);
  background: linear-gradient(90deg, transparent, #ff5a5a 24%, #ffb4b4 54%, #ff5a5a 80%, transparent);
  filter: blur(1.5px); opacity: .7;
}

/* --- dym unoszący się z maty ---------------------------------------- */
.bmf-robot__smoke {
  position: absolute; left: 40%; right: 0; bottom: -4%; height: 96%;
  mix-blend-mode: screen; opacity: var(--bmf-atmo);
}
.bmf-robot__smoke > i {
  position: absolute; bottom: 0; display: block;
  background-size: 100% 100%; background-repeat: no-repeat;
  transform-origin: 50% 100%;
  filter: blur(6px);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 26%, #000 74%, transparent),
                      linear-gradient(180deg, transparent, #000 24%, #000 66%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 26%, #000 74%, transparent),
                      linear-gradient(180deg, transparent, #000 24%, #000 66%, transparent);
  -webkit-mask-composite: source-in;
          mask-composite: intersect;
}
.bmf-robot__smoke .p1 { left: 2%;  width: 34%; height: 72%; opacity: .55; background-image: var(--bmf-smoke-a); animation: bmfPlume 19s linear infinite; }
.bmf-robot__smoke .p2 { left: 30%; width: 30%; height: 64%; opacity: .48; background-image: var(--bmf-smoke-b); animation: bmfPlume 24s linear infinite 7s; }
.bmf-robot__smoke .p3 { left: 58%; width: 38%; height: 78%; opacity: .42; background-image: var(--bmf-smoke-a); animation: bmfPlume 28s linear infinite 14s; }
.bmf-robot__smoke .h1,
.bmf-robot__smoke .h2 {
  position: absolute; bottom: 0; display: block;
  -webkit-mask-image: radial-gradient(60% 60% at 50% 50%, #000 0%, transparent 100%);
          mask-image: radial-gradient(60% 60% at 50% 50%, #000 0%, transparent 100%);
}
.bmf-robot__smoke .h1 { left: 6%;  width: 40%; height: 20%; filter: blur(42px);
  background: radial-gradient(50% 50% at 50% 50%, #b6dfef 0%, rgb(127 185 205 / .3) 48%, transparent 74%);
  animation: bmfHaze 26s ease-out infinite 3s; }
.bmf-robot__smoke .h2 { left: 48%; width: 34%; height: 18%; filter: blur(36px);
  background: radial-gradient(50% 50% at 50% 50%, #cfe9f2 0%, rgb(143 198 217 / .3) 46%, transparent 72%);
  animation: bmfHaze 22s ease-out infinite 12s; }

/* --- pył w powietrzu ------------------------------------------------ */
.bmf-robot__dust { position: absolute; inset: 0; mix-blend-mode: screen; opacity: var(--bmf-dust); }
.bmf-robot__dust > i { position: absolute; display: block; border-radius: 50%; }
.bmf-robot__dust i:nth-child(1) { left: 34%; bottom: 12%; width: 3px; height: 3px; background: var(--bmf-neon-pale); box-shadow: 0 0 8px var(--bmf-neon); animation: bmfDust 9s linear infinite; }
.bmf-robot__dust i:nth-child(2) { left: 48%; bottom: 8%; width: 2px; height: 2px; background: #ffffff; box-shadow: 0 0 6px var(--bmf-neon); animation: bmfDust 12s linear infinite 2.4s; }
.bmf-robot__dust i:nth-child(3) { left: 58%; bottom: 16%; width: 2.5px; height: 2.5px; background: var(--bmf-neon-pale); box-shadow: 0 0 7px var(--bmf-neon); animation: bmfDust 10.5s linear infinite 4.8s; }
.bmf-robot__dust i:nth-child(4) { left: 68%; bottom: 6%; width: 2px; height: 2px; background: #ffffff; box-shadow: 0 0 6px var(--bmf-neon); animation: bmfDust 14s linear infinite 1.2s; }
.bmf-robot__dust i:nth-child(5) { left: 82%; bottom: 14%; width: 3px; height: 3px; background: var(--bmf-neon-soft); box-shadow: 0 0 9px var(--bmf-neon); animation: bmfDust 11s linear infinite 6.2s; }
.bmf-robot__dust i:nth-child(6) { left: 40%; bottom: 4%; width: 2px; height: 2px; background: var(--bmf-neon-pale); box-shadow: 0 0 7px var(--bmf-neon); animation: bmfDust 13s linear infinite 3.6s; }
.bmf-robot__dust i:nth-child(7) { left: 53%; bottom: 20%; width: 1.5px; height: 1.5px; background: #ffffff; box-shadow: 0 0 5px var(--bmf-neon); animation: bmfDust 16s linear infinite 7.4s; }
.bmf-robot__dust i:nth-child(8) { left: 63%; bottom: 2%; width: 3.5px; height: 3.5px; background: var(--bmf-neon-soft); box-shadow: 0 0 11px var(--bmf-neon); animation: bmfDust 15s linear infinite 5.1s; }
.bmf-robot__dust i:nth-child(9) { left: 74%; bottom: 18%; width: 2px; height: 2px; background: var(--bmf-neon-pale); box-shadow: 0 0 6px var(--bmf-neon); animation: bmfDust 12.5s linear infinite 8.3s; }
.bmf-robot__dust i:nth-child(10) { left: 88%; bottom: 5%; width: 2.5px; height: 2.5px; background: #ffffff; box-shadow: 0 0 8px var(--bmf-neon); animation: bmfDust 17s linear infinite 2.9s; }
.bmf-robot__dust i:nth-child(11) { left: 92%; bottom: 22%; width: 1.5px; height: 1.5px; background: var(--bmf-neon-soft); box-shadow: 0 0 5px var(--bmf-neon); animation: bmfDust 14.5s linear infinite 9.6s; }
.bmf-robot__dust i:nth-child(12) { left: 45%; bottom: 26%; width: 2px; height: 2px; background: var(--bmf-neon-pale); box-shadow: 0 0 6px var(--bmf-neon); animation: bmfDust 18s linear infinite 11.2s; }
.bmf-robot__dust i:nth-child(13) { left: 78%; bottom: 30%; width: 1.5px; height: 1.5px; background: #ffffff; box-shadow: 0 0 5px var(--bmf-neon); animation: bmfDust 19s linear infinite 6.8s; }

/* --- przyciemnienie i winieta --------------------------------------
   .bmf-robot--fade-left przyciemnia lewą stronę pod tekst hero.
   Usuń tę klasę, jeśli tekst stoi gdzie indziej.
   ------------------------------------------------------------------- */
.bmf-robot__vignette { position: absolute; inset: 0; box-shadow: inset 0 0 170px 60px #04070a; }
.bmf-robot--fade-left .bmf-robot__vignette::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(96deg, #04070af2 0%, #04070ad9 34%, #04070a4d 58%, transparent 78%);
}
.bmf-robot__scanlines {
  position: absolute; inset: 0; opacity: .28;
  background: repeating-linear-gradient(0deg, rgb(255 255 255 / .014) 0px, rgb(255 255 255 / .014) 1px, transparent 1px, transparent 4px);
}

/* --- animacje -------------------------------------------------------- */
@keyframes bmfGlow     { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes bmfPulse    { 0%, 100% { opacity: .5; }  50% { opacity: 1; } }
@keyframes bmfFlicker {
  0%, 42%, 100% { opacity: .9; }
  43% { opacity: .35; } 45% { opacity: .95; } 46% { opacity: .5; }
  48% { opacity: 1; }   74% { opacity: .92; } 75% { opacity: .55; } 77% { opacity: .98; }
}
@keyframes bmfFogA     { 0%, 100% { transform: rotate(-6deg) translate3d(-8%, 0, 0) scale(1.15); } 50% { transform: rotate(-6deg) translate3d(6%, -2%, 0) scale(1.28); } }
@keyframes bmfFogB     { 0%, 100% { transform: rotate(4deg) translate3d(7%, 1%, 0) scale(1.3); }   50% { transform: rotate(4deg) translate3d(-6%, -3%, 0) scale(1.16); } }
@keyframes bmfFogPulse { 0%, 100% { opacity: .34; } 50% { opacity: .62; } }
@keyframes bmfSweep    { 0% { transform: translateX(-60%) skewX(-14deg); } 100% { transform: translateX(190%) skewX(-14deg); } }
@keyframes bmfCore     { 0%, 100% { opacity: .45; transform: scale(1); } 50% { opacity: .95; transform: scale(1.12); } }
@keyframes bmfCam {
  0%, 44% { opacity: .9; } 45% { opacity: .12; } 48% { opacity: .12; }
  49% { opacity: .95; } 86% { opacity: .9; } 87% { opacity: .2; } 88%, 100% { opacity: .9; }
}
@keyframes bmfPlume {
  0%   { transform: translate3d(0, 22%, 0) scaleX(.62) scaleY(.5); opacity: 0; }
  14%  { opacity: .58; }
  58%  { opacity: .4; }
  100% { transform: translate3d(-7%, -78%, 0) scaleX(1.5) scaleY(1.35); opacity: 0; }
}
@keyframes bmfHaze {
  0%   { transform: translate3d(0, 60px, 0) scale(.62); opacity: 0; }
  16%  { opacity: .5; } 64% { opacity: .3; }
  100% { transform: translate3d(-34px, -300px, 0) scale(1.55) rotate(8deg); opacity: 0; }
}
@keyframes bmfDust {
  0%   { transform: translate3d(0, 14px, 0); opacity: 0; }
  12%  { opacity: .8; } 88% { opacity: .5; }
  100% { transform: translate3d(-26px, -180px, 0); opacity: 0; }
}

/* --- dostępność / oszczędzanie baterii ------------------------------ */
@media (prefers-reduced-motion: reduce) {
  .bmf-robot *, .bmf-robot *::before, .bmf-robot *::after {
    animation: none !important; transition: none !important;
  }
  .bmf-robot__smoke, .bmf-robot__dust { display: none; }
}

/* --- telefony -------------------------------------------------------- */
@media (max-width: 640px) {
  .bmf-robot { aspect-ratio: 3 / 4; }
  .bmf-robot__photo { background-position: 66% 50%; }
  .bmf-robot__dust { display: none; }
}