/*
 * mac-efekt.css - blok "MacBook pri scrollu" (D-030), vklada assets/pmc/data/mac-blok.php.
 *
 * Model v cistem CSS 3D (preserve-3d), bez obrazku a znacek. Souradnice modelu:
 *   pocatek = stred horni plochy spodniho dilu, osa y dolu, osa z k divakovi.
 *   --mac-w sirka, --mac-d hloubka, --mac-h vyska vika, --mac-t tloustka spodku, --mac-tv tloustka vika
 *   (pomery MacBook Pro 14: 312,6 x 221,2 mm, spodek ~ 8 mm, viko ~ 4 mm).
 * --mac-w = velikost OTEVRENEHO Macu na konci (Roman 23. 10.: pres celou obrazovku, 88 % sirky okna);
 * zavreny Mac na stole je zmenseny (scale < 1), takze konecny stav je ostry bez prerastrovani nahoru.
 * Pozici (otoceni, zoom, uhel vika, jas displeje, parallax pozadi) nastavuje mac-efekt.js inline
 * jen pres transform/opacity. Bez tridy .is-ziva (bez JS, prefers-reduced-motion) plati staticka poza:
 * otevreny Mac s fotkou, text pod nim / pres spodni okraj.
 */

.mac-blok {
  /* sirka otevreneho Macu: 88 % okna, ale displej se musi vejit na vysku pod listu (16:9 -> vika ~ 77 %,
     spodni dil v perspektive ~ 88-95 % sirky okna) */
  --mac-w: min(88vw, calc((100vh - var(--pmc-lista-vyska, 0px)) * 1.48), 3200px);
  --mac-d: calc(var(--mac-w) * .708);
  --mac-h: calc(var(--mac-w) * .69);
  --mac-t: calc(var(--mac-w) * .024);
  --mac-tv: calc(var(--mac-w) * .011);
  --mac-r: calc(var(--mac-w) * .026);
  --mac-delka: 360vh;
  --mac-kotva: 50%;

  /* tmavy vzhled (vychozi) */
  --mac-pozadi: #000;
  --mac-zare: rgba(110, 130, 165, .22);
  --mac-text: #f5f5f7;
  --mac-text-tlumeny: rgba(245, 245, 247, .7);
  --mac-odkaz: #4da3ff;
  --mac-drevo-1: #241912;
  --mac-drevo-2: #2e2118;
  --mac-drevo-3: #1d140e;
  --mac-stin: rgba(0, 0, 0, .92);
  --mac-stin-mekky: rgba(0, 0, 0, .5);
  --mac-b1: #ff5c9a; --mac-b2: #5aa8ff; --mac-b3: #ff9d4d; --mac-b4: #4fd69c;

  position: relative;
  display: block;
  margin: 0;
  padding: 0;
  background: var(--mac-pozadi);
  color: var(--mac-text);
  /* pismo jako Apple: SF Pro na Macu, jinak mekke Segoe UI Variable Display / Inter; tezsi rez, tesne prostrkani */
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI Variable Display", "Segoe UI Variable Text", Inter, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  overflow-x: clip;
}
.mac-blok *, .mac-blok *::before, .mac-blok *::after { box-sizing: border-box; }

.mac-blok--svetly {
  --mac-pozadi: #f5f5f7;
  --mac-zare: rgba(255, 255, 255, .95);
  --mac-text: #1d1d1f;
  --mac-text-tlumeny: rgba(29, 29, 31, .7);
  --mac-odkaz: #0066cc;
  --mac-drevo-1: #e6d6bf;
  --mac-drevo-2: #eee2d0;
  --mac-drevo-3: #dfcbb0;
  --mac-stin: rgba(30, 20, 10, .5);
  --mac-stin-mekky: rgba(30, 20, 10, .16);
  --mac-b1: #d0216b; --mac-b2: #0a66d8; --mac-b3: #c75400; --mac-b4: #12804f;
}

/* Barva hliniku: stribrna / vesmirne cerna */
.mac-blok--stribrna {
  --mac-al-1: #eceef0;
  --mac-al-2: #d3d5d8;
  --mac-al-3: #b7b9bd;
  --mac-al-hrana: #8f9296;
  --mac-al-hrana-2: #d9dbde;
  --mac-al-lesk: rgba(255, 255, 255, .55);
  --mac-studna: #18181a;
  --mac-klavesa: #0c0c0d;
  --mac-mezera: #3c3d40;
  --mac-tp-1: #d8d9dc;
  --mac-tp-2: #c8c9cc;
}
/* vesmirne seda (vychozi): kartacovany tmavy hlinik, svetla hrana, cerne klavesy v hlinikove desce */
.mac-blok--cerna {
  --mac-al-1: #5c5f64;
  --mac-al-2: #45474b;
  --mac-al-3: #2e3033;
  --mac-al-hrana: #1f2023;
  --mac-al-hrana-2: #868a90;
  --mac-al-lesk: rgba(255, 255, 255, .34);
  --mac-studna: #0b0b0c;
  --mac-klavesa: #070708;
  --mac-mezera: #3d3f43;
  --mac-tp-1: #505357;
  --mac-tp-2: #43464a;
}

/* ---------- Scena ---------- */
.mac-scena {
  position: relative;
  height: 100vh;
  height: 100svh;
  min-height: 520px;
  overflow: hidden;
  background: var(--mac-pozadi);
}
.mac-drzak { position: relative; }
.mac-blok.is-ziva .mac-drzak { height: var(--mac-delka); }
.mac-blok.is-ziva .mac-scena { position: sticky; top: 0; }

/* Parallax pozadi: zare a stul se posouvaji pomaleji nez Mac (JS: transform) */
.mac-zare {
  position: absolute;
  left: 12%;
  right: 12%;
  top: 4%;
  height: 80%;
  background: radial-gradient(ellipse 50% 50% at 50% 50%, var(--mac-zare), transparent 100%);
  will-change: transform;
  pointer-events: none;
}
.mac-stul-obal {
  position: absolute;
  inset: 0;
  perspective: 1400px;
  perspective-origin: 50% 30%;
  will-change: transform;
  pointer-events: none;
}
/* Deska stolu: pevna transformace (rasterizuje se jednou); s Macem se hybe jen obal (posun) a stin. */
.mac-stul {
  position: absolute;
  left: -60vw;
  right: -60vw;
  top: 40%;
  height: 160vh;
  transform-origin: 50% 0;
  transform: rotateX(80deg);
  /* okraje se rozplynou do plne barvy sceny (bez masky - maska je na slabsich GPU draha) */
  background:
    radial-gradient(ellipse 46% 56% at 50% 52%, transparent 20%, color-mix(in srgb, var(--mac-pozadi) 55%, transparent) 50%, var(--mac-pozadi) 86%),
    repeating-linear-gradient(90deg, transparent 0 9px, rgba(0, 0, 0, .06) 9px 11px, transparent 11px 29px, rgba(255, 255, 255, .03) 29px 30px, transparent 30px 53px),
    linear-gradient(90deg, var(--mac-drevo-1), var(--mac-drevo-2) 30%, var(--mac-drevo-3) 55%, var(--mac-drevo-2) 80%, var(--mac-drevo-1));
}

.mac-pohled {
  position: absolute;
  inset: 0;
  perspective: calc(var(--mac-w) * 2.6);
  perspective-origin: 50% 46%;
  pointer-events: none;
}
.mac-model {
  position: absolute;
  left: 50%;
  top: var(--mac-kotva);
  width: 0;
  height: 0;
  transform-style: preserve-3d;
  /* staticka poza (bez JS / reduced motion) = konec animace */
  transform: translate3d(14vw, calc(var(--pmc-lista-vyska, 0px) + 1.2vh + var(--mac-w) * .74 - 50vh), 0) scale(1) rotateX(-18deg);
}
.mac-model *, .mac-spodek, .mac-pant, .mac-viko { transform-style: preserve-3d; }
.mac-model .mac-displej, .mac-model .mac-displej *, .mac-deska, .mac-deska * { transform-style: flat; }

/* Stin pod Macem: kontaktni (tmavy, tesny) + mekky; hybe se s Macem */
.mac-stin {
  position: absolute;
  left: calc(var(--mac-w) * -.6);
  top: calc(var(--mac-d) * -.6);
  width: calc(var(--mac-w) * 1.2);
  height: calc(var(--mac-d) * 1.2);
  transform: translateY(calc(var(--mac-t) + 1px)) rotateX(90deg);
  background:
    radial-gradient(ellipse 43% 43% at 50% 50.6%, var(--mac-stin) 0 86%, transparent 100%),
    radial-gradient(ellipse 50% 50% at 50% 53%, var(--mac-stin-mekky), transparent 100%);
  backface-visibility: hidden;
}

/* ---------- Spodni dil ---------- */
.mac-spodek { position: absolute; left: 0; top: 0; width: 0; height: 0; }
.mac-deska {
  position: absolute;
  left: calc(var(--mac-w) / -2);
  top: calc(var(--mac-d) / -2);
  width: var(--mac-w);
  height: var(--mac-d);
  border-radius: var(--mac-r);
  transform: rotateX(90deg);
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .14), transparent 5%),
    linear-gradient(110deg, var(--mac-al-1), var(--mac-al-2) 55%, var(--mac-al-3));
  box-shadow: inset 0 0 0 calc(var(--mac-w) * .0012) rgba(255, 255, 255, .25), inset 0 calc(var(--mac-w) * -.002) 0 rgba(0, 0, 0, .12);
  backface-visibility: hidden;
}
/* vyrez pro otevreni na predni hrane */
.mac-deska::after {
  content: "";
  position: absolute;
  left: 43%;
  width: 14%;
  bottom: 0;
  height: 2.2%;
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, .28), rgba(0, 0, 0, .08));
}
/* svit displeje na klavesnici (staticky, maluje se s deskou - zadna dalsi vrstva) */
.mac-svit {
  position: absolute;
  inset: 0 0 auto 0;
  height: 70%;
  background: radial-gradient(ellipse 60% 70% at 50% 0, rgba(255, 255, 255, .22), transparent 70%);
  opacity: 1;
}
.mac-klavesnice {
  position: absolute;
  left: 11.6%;
  top: 6%;
  width: 76.8%;
  height: 43%;
  border-radius: calc(var(--mac-w) * .005);
  background-color: var(--mac-studna);
  background-image:
    linear-gradient(90deg, transparent 88%, var(--mac-mezera) 88%),
    linear-gradient(180deg, transparent 86%, var(--mac-mezera) 86%),
    linear-gradient(180deg, rgba(255, 255, 255, .05), transparent 30%);
  background-size: calc(100% / 14) calc(100% / 6), calc(100% / 14) calc(100% / 6), calc(100% / 14) calc(100% / 6);
  box-shadow: inset 0 0 0 calc(var(--mac-w) * .0025) var(--mac-mezera);
}
/* horni rada funkcnich klaves je nizsi */
.mac-klavesnice::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: calc(100% / 12);
  background: var(--mac-mezera);
}
.mac-repro {
  position: absolute;
  top: 6%;
  width: 6.8%;
  height: 43%;
  background-image: radial-gradient(circle, rgba(0, 0, 0, .55) 0 35%, transparent 45%);
  background-size: calc(var(--mac-w) * .0055) calc(var(--mac-w) * .0055);
  opacity: .5;
}
.mac-repro--l { left: 2.6%; }
.mac-repro--p { right: 2.6%; }
.mac-trackpad {
  position: absolute;
  left: 29%;
  top: 54.5%;
  width: 42%;
  height: 40%;
  border-radius: calc(var(--mac-w) * .011);
  background: linear-gradient(165deg, var(--mac-tp-1), var(--mac-tp-2));
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12), inset 0 1px 2px rgba(255, 255, 255, .25);
}

.mac-hrana { position: absolute; backface-visibility: hidden; }
.mac-hrana--predni, .mac-hrana--zadni {
  left: calc(var(--mac-w) / -2 + var(--mac-r) * .45);
  top: 0;
  width: calc(var(--mac-w) - var(--mac-r) * .9);
  height: var(--mac-t);
  border-radius: 0 0 calc(var(--mac-t) * 1.2) calc(var(--mac-t) * 1.2);
  background:
    linear-gradient(180deg, var(--mac-al-lesk) 0, transparent 22%),
    linear-gradient(180deg, var(--mac-al-hrana-2), var(--mac-al-hrana) 65%, rgba(0, 0, 0, .6));
}
/* vyrez pro prst uprostred predni hrany */
.mac-hrana--predni::after {
  content: "";
  position: absolute;
  left: 43%;
  width: 14%;
  top: 0;
  height: 55%;
  border-radius: 0 0 50% 50% / 0 0 100% 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, .45), rgba(0, 0, 0, .12));
}
.mac-hrana--predni { transform: translateZ(calc(var(--mac-d) / 2)); }
.mac-hrana--zadni { transform: translateZ(calc(var(--mac-d) / -2)) rotateY(180deg); }
.mac-hrana--leva, .mac-hrana--prava {
  left: calc(var(--mac-d) / -2 + var(--mac-r) * .45);
  top: 0;
  width: calc(var(--mac-d) - var(--mac-r) * .9);
  height: var(--mac-t);
  background:
    linear-gradient(180deg, var(--mac-al-lesk) 0, transparent 22%),
    linear-gradient(180deg, var(--mac-al-hrana-2), var(--mac-al-hrana) 65%, rgba(0, 0, 0, .6));
}
.mac-hrana--leva { transform: translateX(calc(var(--mac-w) / -2)) rotateY(-90deg); }
.mac-hrana--prava { transform: translateX(calc(var(--mac-w) / 2)) rotateY(90deg); }

/* ---------- Viko ---------- */
/* pant na zadni hrane spodku; o pixel vys, aby se zavrene viko neprekryvalo s deskou */
.mac-pant {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  transform: translate3d(0, -1px, calc(var(--mac-d) / -2 + var(--mac-tv) * .5));
}
.mac-viko {
  position: absolute;
  left: calc(var(--mac-w) / -2);
  top: calc(var(--mac-h) * -1);
  width: var(--mac-w);
  height: var(--mac-h);
  transform-origin: 50% 100%;
  transform: rotateX(26deg);
}
.mac-viko__predek {
  position: absolute;
  inset: 0;
  border-radius: var(--mac-r) var(--mac-r) calc(var(--mac-r) * .3) calc(var(--mac-r) * .3);
  background: #050506;
  /* tenky hlinikovy lem kolem cerneho skla */
  box-shadow: inset 0 0 0 calc(var(--mac-w) * .0018) var(--mac-al-hrana), inset 0 0 0 calc(var(--mac-w) * .0028) rgba(0, 0, 0, .9);
  backface-visibility: hidden;
}
.mac-displej {
  position: absolute;
  left: 1.9%;
  right: 1.9%;
  top: 2.4%;
  bottom: 3.4%;
  /* bez overflow/border-radius: orez se zaoblenim by na slabsich GPU znamenal masku navic;
     zaoblene horni rohy displeje kresli vrstva odlesku (.mac-displej__lesk) */
  --mac-roh: calc(var(--mac-r) * .42);
  background: #000;
}
.mac-displej__foto, .mac-displej__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* vrstvy displeje, ktere nejsou videt, se nekresli (visibility) - setri GPU */
.mac-displej__video { opacity: 0; visibility: hidden; transition: opacity .9s cubic-bezier(.4, 0, .2, 1), visibility 0s .9s; }
.mac-blok.is-video .mac-displej__video { opacity: 1; visibility: visible; transition: opacity .9s cubic-bezier(.4, 0, .2, 1); }
.mac-displej__tma {
  position: absolute;
  inset: 0;
  background: #000;
  opacity: 0;
  visibility: hidden;
}
/* odlesk skla: sikmy pruh + jemne zesvetleni nahore */
.mac-displej__lesk {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 100% 100%, transparent calc(var(--mac-roh) - .5px), #050506 var(--mac-roh)) 0 0 / var(--mac-roh) var(--mac-roh) no-repeat,
    radial-gradient(circle at 0 100%, transparent calc(var(--mac-roh) - .5px), #050506 var(--mac-roh)) 100% 0 / var(--mac-roh) var(--mac-roh) no-repeat,
    linear-gradient(112deg, rgba(255, 255, 255, .12) 0%, rgba(255, 255, 255, .04) 26%, transparent 38%, transparent 62%, rgba(255, 255, 255, .03) 74%, transparent 86%),
    linear-gradient(180deg, rgba(255, 255, 255, .04), transparent 18%);
  pointer-events: none;
}
.mac-notch {
  position: absolute;
  left: 50%;
  top: 2.4%;
  width: 6.2%;
  height: 3.2%;
  transform: translateX(-50%);
  background: #050506;
  border-radius: 0 0 calc(var(--mac-w) * .0055) calc(var(--mac-w) * .0055);
}
.mac-notch::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 30%;
  width: calc(var(--mac-w) * .0048);
  height: calc(var(--mac-w) * .0048);
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #34476a, #0a0d14 70%);
}
/* hlinikove viko zvenku: jemny odlesk + svetla hrana */
.mac-viko__zadek {
  position: absolute;
  inset: 0;
  border-radius: var(--mac-r) var(--mac-r) calc(var(--mac-r) * .3) calc(var(--mac-r) * .3);
  transform: translateZ(calc(var(--mac-tv) * -1)) rotateY(180deg);
  background:
    linear-gradient(205deg, rgba(255, 255, 255, .22) 0%, rgba(255, 255, 255, .06) 30%, transparent 45%),
    radial-gradient(ellipse 70% 50% at 70% 20%, rgba(255, 255, 255, .10), transparent 70%),
    linear-gradient(160deg, var(--mac-al-1), var(--mac-al-2) 55%, var(--mac-al-3));
  box-shadow: inset 0 0 0 calc(var(--mac-w) * .0015) var(--mac-al-lesk), inset 0 0 calc(var(--mac-w) * .01) rgba(0, 0, 0, .12);
  backface-visibility: hidden;
}
.mac-viko__hrana { position: absolute; background: var(--mac-al-hrana); }
.mac-viko__hrana--horni {
  left: var(--mac-r);
  right: var(--mac-r);
  top: 0;
  height: var(--mac-tv);
  transform-origin: 50% 0;
  transform: rotateX(-90deg);
  background: linear-gradient(90deg, var(--mac-al-hrana), var(--mac-al-hrana-2) 50%, var(--mac-al-hrana));
}
.mac-viko__hrana--leva, .mac-viko__hrana--prava {
  top: var(--mac-r);
  bottom: 0;
  width: var(--mac-tv);
  background: linear-gradient(180deg, var(--mac-al-hrana-2), var(--mac-al-hrana));
}
.mac-viko__hrana--leva { left: 0; transform-origin: 0 50%; transform: rotateY(90deg); }
.mac-viko__hrana--prava { right: 0; transform-origin: 100% 50%; transform: rotateY(-90deg); }

/* ---------- Text bloku ----------
   Desktop: sloupec vlevo, svisle na stred; Mac (porad v plne velikosti) odjede doprava (JS).
   Mobil: pod Macem na stred. Pismo jako Apple: velke, plne, tezsi rez, tesne prostrkani.
   JS rozdeli texty na radky (.mac-radek) a kazdy radek najede zdola z rozostreni do ostra, postupne;
   kroky pri dalsim scrollu odjedou nahoru. */
.mac-text {
  position: absolute;
  left: var(--pmc-okraj, 40px);
  top: var(--pmc-lista-vyska, 0px);
  bottom: 0;
  width: 25vw;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: left;
  z-index: 2;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.mac-text__stitek {
  margin: 0 0 .7em;
  font-size: clamp(13px, calc(.62vw + 2px), 20px);
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--mac-text-tlumeny);
}
.mac-text__nadpis {
  margin: 0;
  font-size: clamp(34px, 3.1vw, 104px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 650;
  color: var(--mac-text);
}
.mac-text__perex {
  margin: .55em 0 0;
  font-size: clamp(18px, 1.2vw, 40px);
  line-height: 1.32;
  letter-spacing: -0.012em;
  font-weight: 500;
  color: var(--mac-text-tlumeny);
}
.mac-text__akce { margin: 1em 0 0; font-size: clamp(17px, 1.05vw, 34px); font-weight: 500; letter-spacing: -0.01em; }
.mac-text__odkaz { color: var(--mac-odkaz); text-decoration: none; }
.mac-text__odkaz:hover, .mac-text__odkaz:focus-visible { text-decoration: underline; }
.mac-radek { display: block; }
.mac-blok.is-ziva .mac-radek { opacity: 0; }

/* ---------- Kroky (volba 'kroky'): obrazovky v otevrenem Macu + text kroku ---------- */
.mac-blok--kroky.is-ziva .mac-drzak { height: calc(var(--mac-delka) + var(--mac-kroku, 0) * 80vh); }
.mac-displej__krok { opacity: 0; visibility: hidden; }
.mac-displej__krok--contain {
  object-fit: contain;
  background: radial-gradient(ellipse at 50% 40%, #2a2b30, #0b0b0d 75%);
}
.mac-blok:not(.is-ziva) .mac-displej__krok { display: none; }
.mac-krok {
  --mac-krok-barva: var(--mac-b1);
  margin: 0;
  padding: 0;
  list-style: none;
}
.mac-krok--b2 { --mac-krok-barva: var(--mac-b2); }
.mac-krok--b3 { --mac-krok-barva: var(--mac-b3); }
.mac-krok--b4 { --mac-krok-barva: var(--mac-b4); }
.mac-kroky {
  display: grid;
  gap: 1.2em;
  margin: .9em 0 0;
  padding: 0;
  list-style: none;
}
.mac-blok.is-ziva .mac-krok { grid-area: 1 / 1; align-self: start; }
.mac-krok__nadpis, .mac-krok__text {
  margin: 0;
  font-size: clamp(22px, 1.6vw, 54px);
  line-height: 1.14;
  letter-spacing: -0.03em;
  font-weight: 650;
}
.mac-krok__nadpis { color: var(--mac-krok-barva); }
.mac-krok__text { margin-top: .08em; color: var(--mac-text); }
.mac-text--kroky .mac-text__nadpis { font-size: clamp(18px, 1.15vw, 38px); letter-spacing: -0.01em; font-weight: 600; color: var(--mac-text-tlumeny); }

/* ---------- Plynuly prechod do sousednich sekci ----------
   Pas nad scenou a pod ni (mimo sticky cast, takze nikdy neprekryje Mac): barva sekce pred blokem
   -> pozadi sceny -> barva sekce za blokem. Barvy sousedu zjisti JS (--mac-pred / --mac-po);
   bez JS je pas v barve sceny (zadny skok). */
.mac-prechod {
  height: clamp(80px, 22vh, 320px);
  pointer-events: none;
}
.mac-prechod--pred { background: linear-gradient(180deg, var(--mac-pred, var(--mac-pozadi)), var(--mac-pozadi)); }
.mac-prechod--po { background: linear-gradient(0deg, var(--mac-po, var(--mac-pozadi)), var(--mac-pozadi)); }

/* ---------- Mobil a uzke okno ---------- */
@media (max-width: 899px) {
  .mac-blok {
    --mac-w: 92vw;
    --mac-delka: 260vh;
  }
  .mac-blok--kroky.is-ziva .mac-drzak { height: calc(var(--mac-delka) + var(--mac-kroku, 0) * 70vh); }
  .mac-model { transform: translate3d(0, 0, 0) scale(1) rotateX(-14deg); }
  .mac-text {
    left: var(--pmc-okraj, 16px);
    right: var(--pmc-okraj, 16px);
    top: auto;
    width: auto;
    display: block;
    bottom: clamp(20px, 5vh, 48px);
    text-align: center;
  }
  .mac-text__perex { font-size: 17px; }
  .mac-text__nadpis { font-size: clamp(30px, 8.6vw, 42px); }
  .mac-text--kroky .mac-text__nadpis { font-size: 15px; }
  .mac-krok__nadpis, .mac-krok__text { font-size: 22px; }
  .mac-kroky { margin-top: .5em; }
  .mac-prechod { height: 14vh; }
}

/* ---------- Bez pohybu ---------- */
@media (prefers-reduced-motion: reduce) {
  .mac-blok.is-ziva .mac-drzak { height: auto; }
  .mac-blok.is-ziva .mac-scena { position: relative; }
  .mac-displej__video { transition: none; }
}