/* MeX Motion Productions – kópia Wix webu (desktop 980 px mriežka, mobil 320 px návrh) */
:root {
  --heavy: 'Figtree', 'Avenir Next', 'Avenir', 'Helvetica Neue', Arial, sans-serif;
  --light: 'Figtree', 'Avenir Next', 'Avenir', 'Helvetica Neue', Arial, sans-serif;
  --futura: 'Jost', 'Futura', 'Century Gothic', sans-serif;
  --helv: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --cyan: #a5f0ff;
  --gray: #808080;
  --hdr: 85px;
  color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0; background: #000; color: #fff;
  font: 300 16px/1.4 var(--light);
  -webkit-font-smoothing: antialiased; min-width: 980px;
}
img { display: block; max-width: none; }
a { color: inherit; text-decoration: none; }
p, h1, h2, h3, h6, figure, ul { margin: 0; padding: 0; }
ul { list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
mark { background: #000; color: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
svg { display: block; width: 100%; height: 100%; }

/* ---------- Hlavička (fixná, 85 px) ---------- */
.hdr { position: fixed; z-index: 60; inset: 0 0 auto 0; height: var(--hdr); background: #000; }
.logo { position: absolute; left: 55px; top: 24px; height: 27px; display: flex; align-items: center; }
.logo-ico { width: 27px; height: 27px; flex: none; }
.logo-txt { margin-left: 6px; font: 700 20px/27px var(--heavy); letter-spacing: -.01em; white-space: nowrap; }
.burger { position: absolute; right: 24px; top: 29px; width: 32px; height: 25px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; }
.burger span { display: block; height: 4.6px; background: #fff; }
.burger span:nth-child(1) { width: 13px; }
.burger span:nth-child(2) { width: 31px; }
.burger span:nth-child(3) { width: 24px; }
@media (hover: hover) {
  .burger:hover span:nth-child(1) { animation: bu1 1.72s linear infinite; }
  .burger:hover span:nth-child(2) { animation: bu2 1.72s linear infinite; }
  .burger:hover span:nth-child(3) { animation: bu3 1.72s linear infinite; }
}
@keyframes bu1 { 0%, 5% { width: 13px } 47%, 53% { width: 6px } 88%, 100% { width: 13px } }
@keyframes bu2 { 0%, 5% { width: 31px } 28% { width: 21px } 49%, 100% { width: 31px } }
@keyframes bu3 { 0%, 9% { width: 23px } 19% { width: 24px } 53% { width: 9px } 83%, 100% { width: 23px } }

/* Výber jazyka */
.lang { position: relative; }
.lang-hdr { position: absolute; right: 150px; top: 17px; width: 168px; }
.lang-btn, .lang-list a { display: flex; align-items: center; width: 100%; height: 50px; padding: 0 15px; background: #000; font: 700 15px/21px var(--heavy); }
.flag { width: 32px; height: 20px; flex: none; }
.flag svg { border-radius: 1px; }
.lang-code { margin-left: 8px; }
.lang-chev { width: 12px; height: 8px; margin-left: auto; margin-right: 1px; transition: transform .2s; }
.lang-btn[aria-expanded="true"] .lang-chev { transform: rotate(180deg); }
.lang-list { position: absolute; left: 0; right: 0; top: 100%; z-index: 2; }
.lang-list a:hover .lang-code, .lang-list a:focus-visible .lang-code { text-decoration: underline; }

/* Pravý pás so sociálnymi sieťami (fixný, 80 px) */
.strip { position: fixed; z-index: 52; top: 0; right: 0; width: 80px; height: 100%; background: #000; }
.socialbar { position: absolute; top: 141px; right: 28px; display: grid; gap: 12px; }
.socialbar a { display: block; width: 18px; height: 18px; transition: opacity .2s; }
.socialbar a:hover { opacity: .7; }

/* ---------- Menu (panel sprava) ---------- */
.menu { position: fixed; z-index: 80; top: 0; right: 0; bottom: 0; width: 300px; background: #000; padding-top: 80px;
  transform: translateX(100%); transition: transform .4s ease, visibility 0s .4s; visibility: hidden; }
.menu.open { transform: none; visibility: visible; transition: transform .4s ease; }
.menu-top { position: absolute; top: 0; left: 0; right: 0; height: 80px; }
.menu-close { position: absolute; left: 127px; top: 29px; width: 26px; height: 26px; color: #fff; }
.menu-close:hover { opacity: .7; }
.lang-menu { display: none; }
.menu-list { margin: 0 auto; width: 214px; text-align: center; }
.menu-list a { display: block; height: 57px; line-height: 57px; font: 300 21px/57px var(--light); color: var(--gray); transition: color .2s; }
.menu-list a:hover, .menu-list a[aria-current] { color: #fff; }

/* ---------- Spoločné ---------- */
main { padding-top: var(--hdr); }
section { position: relative; }
.grid { position: relative; width: 980px; margin-left: calc(50% - 490px); height: 100%; }
.wide { position: relative; width: 1120px; margin-left: calc(50% - 560px); height: 100%; }
h1, h2 { font-weight: 700; font-family: var(--heavy); }

.btn-all { display: inline-flex; align-items: center; justify-content: center; width: 173px; height: 49px; border: 2px solid #fff;
  font: 300 14px/1 var(--light); color: #fff; transition: background-color .4s ease, color .4s ease; }
.btn-all:hover { background: #fff; color: #000; }

/* ---------- Úvod ---------- */
.hero { height: 613px; margin-bottom: 8px; clip-path: inset(0); }
.hero-bg { position: absolute; inset: 0; }
.hero-bg img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 100%; }
/* Wix bgReveal beží len pri prefers-reduced-motion: no-preference, inak pozadie normálne scrolluje */
@media (prefers-reduced-motion: no-preference) {
  @supports (clip-path: inset(0)) { .hero-bg img { position: fixed; height: 100vh; } }
}
.hero-h { position: absolute; left: 200px; top: 407px; width: 780px; font: 700 60px/1 var(--heavy); letter-spacing: .05em; }
.h-name { display: block; line-height: 71px; }
.h-sub { display: block; margin-top: 3px; font-size: 25px; line-height: 30px; }
.h-tag { display: block; margin-top: 28px; font-size: 20px; line-height: 24px; }

.reel { height: 643px; }
.player { position: absolute; left: 24px; top: 56px; width: 931px; height: 530px; background: #000; overflow: hidden; }
.player video { width: 100%; height: 100%; object-fit: cover; display: block; background: #000; }
.player.playing video, .player.started video { object-fit: contain; }
.player-big { position: absolute; left: 50%; top: 50%; width: 50px; height: 50px; margin: -25px 0 0 -25px; transition: transform .2s; }
.player-big:hover { transform: scale(1.08); }
.player.started .player-big { display: none; }
.player-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 64px; padding: 26px 20px 0; display: none; align-items: center; gap: 12px;
  background: linear-gradient(transparent, rgba(0,0,0,.55)); transition: opacity .3s; font: 400 12px/1 var(--helv); }
.player.started .player-bar { display: flex; }
.player.playing.idle .player-bar { opacity: 0; }
.player.playing.idle { cursor: none; }
.player-progress { position: absolute; left: 20px; right: 20px; top: 12px; height: 3px; background: rgba(255,255,255,.3); }
.player-buf, .player-fill { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: rgba(255,255,255,.5); }
.player-fill { background: #fff; }
.player-progress input { position: absolute; inset: -8px 0; width: 100%; opacity: 0; cursor: pointer; margin: 0; }
.pb { width: 18px; height: 18px; flex: none; }
.pb svg { width: 16px; height: 16px; margin: auto; }
.pb-play svg:last-child, .playing .pb-play svg:first-child { display: none; }
.playing .pb-play svg:last-child { display: block; }
.pb-vol svg:last-child, .muted .pb-vol svg:first-child { display: none; }
.muted .pb-vol svg:last-child { display: block; }
.pb-time { margin-right: auto; white-space: nowrap; }

.services { height: 870px; }
.svc { position: absolute; width: 464px; overflow: hidden; text-align: center; }
.svc img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.svc-1 { left: 16px; top: 59px; height: 405px; }
.svc-2 { left: 500px; top: 59px; height: 386px; }
.svc-3 { left: 16px; top: 484px; height: 386px; }
.svc-4 { left: 500px; top: 465px; height: 405px; }
.svc h2 { position: absolute; left: 30px; top: 222px; width: 404px; font: 700 25px/35px var(--heavy); transition: all .2s ease-out; }
.svc p { position: absolute; left: 22px; top: 267px; width: 420px; font: 300 16px/19px var(--light); transition: all .4s ease-in-out; }
.svc b { font-weight: 700; }

/* Video galéria (slider na úvode) */
.gal { height: 500px; }
.gal > .gal-more { display: none; }
.slider { position: absolute; left: 0; right: 0; top: 94px; height: 297px; }
.sl-track { position: absolute; inset: 0 55px; display: flex; gap: 17px; padding: 4px 4px 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.sl-track::-webkit-scrollbar { display: none; }
.sl-item { flex: 0 0 320px; scroll-snap-align: start; }
.sl-prev, .sl-next { position: absolute; z-index: 53; top: 0; width: 55px; height: 180px; color: #fff; display: flex; align-items: center; justify-content: center; }
.sl-prev { left: 0; } .sl-next { right: 0; }
.sl-prev svg, .sl-next svg { width: 14px; height: 28px; }
/* Ako vo Wix Video: šípky sa ukážu až nad sliderom (0,8), nad šípkou naplno */
.sl-prev, .sl-next { opacity: 0; transition: opacity .2s; }
.slider:hover .sl-prev, .slider:hover .sl-next { opacity: .8; }
.slider .sl-prev:hover, .slider .sl-next:hover { opacity: 1; }
.vt-thumb { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #111; }
.vt-thumb img { width: 100%; height: 100%; object-fit: cover; }
.vt-play { position: absolute; left: 50%; top: 50%; width: 40px; height: 40px; margin: -20px 0 0 -20px; transition: opacity .2s; }
.vt-dur { position: absolute; right: 9px; bottom: 9px; font: 500 12px/1 var(--helv); text-shadow: 0 0 3px rgba(0,0,0,.6); }
.vt-hover { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: #000; font: 400 13px var(--helv); opacity: 0; transition: opacity .2s; }
.vt-info { padding: 24px 20px 0; text-align: center; }
.vt-info h3 { font: 700 14px/17px var(--futura); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vt-info p { margin-top: 13px; font: 400 12px/18px var(--futura); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sl-dots, .pj-play-l { display: none; }
.gal-btn { position: absolute; left: 0; top: 430px; height: auto; }
.gal-btn .btn-all { position: absolute; left: 403px; }

/* Klienti */
.clients { height: 424px; }
.clients h2 { position: absolute; left: 0; top: 70px; width: 980px; text-align: center; font: 700 56px/67px var(--heavy); }
.logos { position: absolute; left: 0; top: 173px; width: 980px; height: 176px; }
.logos img { position: absolute; object-fit: cover; }
.logo-1 { left: 22px; top: 15px; width: 150px; height: 150px; }
.logo-2 { left: 188px; top: 50px; width: 198px; height: 81px; }
.logo-3 { left: 427px; top: 30px; width: 116px; height: 116px; }
.logo-4 { left: 584px; top: 59px; width: 198px; height: 58px; }
.logo-5 { left: 803px; top: 56px; width: 155px; height: 69px; }

/* ---------- Pätička ---------- */
.ftr { position: relative; height: 278px; text-align: center; }
.ftr-h { position: absolute; left: 0; right: 0; top: 92px; font: 700 20px/25px var(--heavy); }
.ftr-t { position: absolute; left: 0; right: 0; top: 142px; font: 300 16px/22px var(--light); }
.ftr-t a:hover, .ab-v a:hover, .co-v a:hover { text-decoration: underline; }
.soc { display: flex; gap: 5px; }
.soc a { display: block; width: 23px; height: 23px; transition: opacity .2s; }
.soc a:hover { opacity: .75; }
.ftr-soc { position: absolute; top: 196px; left: calc(50% - 42px); }

.totop { display: none; }

/* ---------- Projekty ---------- */
.pj-head { height: 240px; }
.pj-head h1 { position: absolute; left: 0; right: 0; top: 53px; text-align: center; font: 700 65px/88px var(--heavy); }
.pj { padding: 0 67px 25px; }
.ch-bar { height: 43px; }
.gal-more { position: relative; display: inline-block; }
.ch-more { display: flex; align-items: center; height: 35px; gap: 19px; font: 400 13px/1 var(--helv); color: #fff; }
.ch-more svg { width: 3px; height: 15px; margin-left: 16px; }
.ch-more:hover span { text-decoration: underline; }
.ch-menu { position: absolute; z-index: 5; left: 0; top: 100%; min-width: 200px; background: #000; border: 1px solid rgba(255,255,255,.15); }
.ch-share { display: block; width: 100%; padding: 12px 20px; text-align: left; font: 400 13px/1 var(--helv); }
.ch-share:hover { background: #222; }
.pj-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 33px; }
.pj-item { height: 334px; }
.pj-item .vt-play, .pj-item .vt-dur { display: none; }
.pj-item .vt-info { padding: 24px 20px 0; }
.pj-item h3 { font: 700 20px/25px var(--heavy); }
.vt-info h3 .c { display: none; }
.pj-item p { margin-top: 10px; font: 300 10px/12px var(--light); }
@media (hover: hover) { .pj-item .vt-thumb:hover .vt-hover, .pj-item .vt-thumb:focus-visible .vt-hover { opacity: .92; } }

/* ---------- O mně ---------- */
.ab-intro { height: 558px; }
.ab-img { position: absolute; left: 0; top: 40px; width: 709px; height: 362px; object-fit: cover; }
.ab-box { position: absolute; left: 411px; top: 120px; width: 709px; height: 438px; background: #000; }
.ab-intro h1 { position: absolute; left: 455px; top: 208px; font: 700 56px/67px var(--heavy); white-space: nowrap; }
.ab-lead { position: absolute; left: 455px; top: 292px; width: 621px; font: 300 25px/45px var(--light); color: var(--cyan); }
.ab-me { height: 919px; }
html[lang="en"] .ab-me { height: 944px; }
.ab-me h2 { position: absolute; left: 22px; top: 70px; font: 700 56px/67px var(--heavy); }
.ab-name { position: absolute; left: 22px; top: 147px; font: 700 26px/31px var(--heavy); }
.ab-body { position: absolute; left: 22px; top: 218px; width: 637px; font: 300 18px/25.2px var(--light); }
.ab-body p + p { margin-top: 25.2px; }
.polaroid { position: absolute; left: 680px; top: 106px; width: 276px; height: 307px; padding: 6px 6px 36px; background: #fff; transform: rotate(6.71deg); }
.polaroid img { width: 264px; height: 265px; object-fit: cover; }
.ab-contact { height: 362px; }
.ab-col { position: absolute; top: 133px; text-align: center; }
.ab-c1 { left: 189px; width: 190px; } .ab-c2 { left: 424px; width: 271px; } .ab-c3 { left: 739px; width: 191px; }
.ab-k { font: 700 16px/19px var(--heavy); height: 48px; }
.ab-v { font: 300 16px/32px var(--light); }
.ab-c3 .soc { justify-content: center; gap: 7px; padding-top: 4px; }
.ab-c3 .soc a { width: 24px; height: 24px; }

/* ---------- Certifikáty ---------- */
.ct-head { height: 224px; }
.ct-head h1 { position: absolute; left: 0; right: 0; top: 91px; text-align: center; font: 700 56px/67px var(--heavy); }
.ct { height: 1373px; }
.ct-grid { display: grid; grid-template-columns: repeat(3, 306px); gap: 30px; align-content: start; padding-top: 61px; }
.ct-grid img { width: 306px; height: 226px; object-fit: cover; }

/* ---------- Kontakt ---------- */
.co-head { height: 228px; }
.co-head h1 { position: absolute; left: 0; right: 0; top: 113px; text-align: center; font: 700 56px/67px var(--heavy); }
.co { height: 540px; }
.co-in { position: absolute; left: 50%; top: 0; width: 0; height: 100%; }
.co-item { position: absolute; width: 280px; }
.co-addr { left: -544px; top: 84px; } .co-phone { left: -251px; top: 84px; }
.co-mail { left: -544px; top: 307px; } .co-soc { left: -251px; top: 307px; }
.co-ico { display: block; height: 27px; }
.co-ico svg { width: auto; height: 100%; }
.co-phone .co-ico { height: 24px; margin-top: 5px; margin-bottom: -2px; }
.co-mail .co-ico { height: 19px; margin-top: 3px; margin-bottom: 5px; }
.co-soc .co-ico { height: 25px; margin-bottom: 2px; }
.co-k { margin-top: 21px; font: 700 20px/28px var(--heavy); }
.co-v { margin-top: 20px; font: 300 16px/22px var(--light); }
.co-lines { margin-top: 16px; line-height: 28.8px; }
.co-lines span { display: block; }
.co-phone .co-v { margin-top: 25px; }
.co-soc .soc { margin-top: 18px; }
.co-form { position: absolute; left: 89px; top: 0; width: 460px; height: 100%; }
.co-fh { position: absolute; left: 145px; top: 28px; width: 170px; text-align: center; font: 700 20px/24px var(--heavy); }
.co-form label { position: absolute; display: block; }
.co-form label span { display: block; position: relative; top: -6px; height: 17px; padding-left: 2px; font: 300 14px/17px var(--light); }
.co-form input, .co-form textarea { display: block; width: 100%; margin: 0; border: 1px solid #fff; border-radius: 0; background: transparent; color: #fff;
  font: 300 14px/1.4 var(--light); padding: 6px 10px; outline: none; transition: border-color .2s; }
.co-form input:focus, .co-form textarea:focus { border-color: var(--cyan); }
.co-form input { height: 37px; }
.co-form textarea { height: 86px; resize: none; }
.f-first { left: 0; top: 87px; width: 220px; }
.f-last { left: 240px; top: 87px; width: 220px; }
.f-mail { left: 1px; top: 168px; width: 459px; }
.f-msg { left: 1px; top: 248px; width: 459px; }
.f-hp { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0; }
.f-send { position: absolute; left: 1px; top: 371px; width: 459px; height: 36px; background: var(--cyan); color: #000; font: 300 14px/36px var(--light); transition: opacity .2s; }
.f-send:hover { opacity: .85; }
.f-send:disabled { opacity: .5; cursor: wait; }
.f-status { position: absolute; left: 1px; top: 419px; width: 459px; text-align: center; font: 300 14px/17px var(--light); }

/* 404 */
.nf { padding: 120px 20px 160px; text-align: center; }
.nf h1 { font: 700 80px/1 var(--heavy); }
.nf p { margin-top: 24px; }

/* ---------- Video lightbox ---------- */
.lb { position: fixed; z-index: 100; inset: 0; background: #000; }
.lb-head { position: absolute; left: 0; right: 0; top: 0; height: 58px; }
.lb-title { position: absolute; left: 19px; top: 22px; font: 400 14px/1 var(--futura); }
.lb-close { position: absolute; right: 22px; top: 20px; width: 20px; height: 20px; color: #fff; }
.lb-close:hover, .lb-nav:hover { opacity: .7; }
.lb-stage { position: absolute; left: 90px; right: 90px; top: 58px; bottom: 170px; display: flex; align-items: center; justify-content: center; }
.lb-player { width: 100%; max-height: 100%; aspect-ratio: 16 / 9; max-width: calc((100vh - 228px) * 16 / 9); }
.lb-player iframe { width: 100%; height: 100%; border: 0; display: block; }
.lb-nav { position: absolute; top: calc(50% - 85px - 14px); width: 40px; height: 60px; color: #fff; display: flex; align-items: center; justify-content: center; }
.lb-nav svg { width: 14px; height: 28px; }
.lb-prev { left: 22px; } .lb-next { right: 22px; }
.lb-strip { position: absolute; left: 0; right: 0; bottom: 0; height: 150px; }
.lb-strip-track { display: flex; gap: 3px; height: 100%; overflow-x: auto; scrollbar-width: none; scroll-behavior: smooth; }
.lb-strip-track::-webkit-scrollbar { display: none; }
.lb-thumb { position: relative; flex: 0 0 266px; height: 150px; }
.lb-thumb img { width: 100%; height: 100%; object-fit: cover; }
.lb-thumb-t { position: absolute; inset: 0; padding: 16px; text-align: left; font: 400 13px/1.3 var(--futura); background: rgba(0,0,0,.55); opacity: 0; transition: opacity .2s; }
.lb-thumb:hover .lb-thumb-t, .lb-thumb.current .lb-thumb-t { opacity: 1; }
.lb-strip-next { position: absolute; right: 0; top: 0; width: 40px; height: 150px; color: #fff; display: flex; align-items: center; justify-content: center; background: linear-gradient(90deg, transparent, rgba(0,0,0,.6)); }
.lb-strip-next svg { width: 12px; height: 24px; }

/* Zdieľanie */
.share { position: fixed; z-index: 110; inset: 0; background: rgba(0,0,0,.7); display: flex; align-items: center; justify-content: center; }
.share-box { position: relative; width: 360px; padding: 36px 30px 30px; background: #111; border: 1px solid #333; text-align: center; }
.share-close { position: absolute; right: 14px; top: 14px; width: 16px; height: 16px; }
.share-h { font: 700 18px/1.3 var(--heavy); }
.share-links { margin-top: 22px; display: grid; gap: 10px; }
.share-links a, .share-links button { display: block; padding: 10px; border: 1px solid #fff; font: 300 14px/1 var(--light); transition: background .2s, color .2s; }
.share-links a:hover, .share-links button:hover { background: #fff; color: #000; }

body.noscroll { overflow: hidden; }

/* =====================================================================
   Mobil (< 768 px): Wix návrh 320 px škálovaný na šírku zariadenia
   ===================================================================== */
@media (max-width: 767.98px) {
  :root { --u: calc(100vw / 320); --hdr: calc(71 * var(--u)); }
  body { min-width: 0; font-size: calc(16 * var(--u)); }
  .strip, .lang-hdr { display: none; }
  .hdr { position: absolute; }
  .logo { left: calc(14 * var(--u)); top: calc(21 * var(--u)); height: calc(20 * var(--u)); }
  .logo-ico { width: calc(20 * var(--u)); height: calc(20 * var(--u)); }
  .logo-txt { margin-left: calc(6 * var(--u)); font-size: calc(16 * var(--u)); line-height: calc(20 * var(--u)); }
  .burger { right: calc(20 * var(--u)); top: calc(19 * var(--u)); width: calc(22 * var(--u)); height: calc(21 * var(--u)); }
  .burger span, .burger span:nth-child(n) { width: 100%; height: max(1px, calc(1.3 * var(--u))); background: #bdbdbd; animation: none !important; }

  .menu { width: 100%; padding-top: calc(80 * var(--u)); transition: opacity .3s, visibility 0s .3s; transform: none; opacity: 0; }
  .menu.open { opacity: 1; transition: opacity .3s; }
  .menu-top { height: calc(80 * var(--u)); }
  .menu-close { left: auto; right: calc(20 * var(--u)); top: calc(33 * var(--u)); width: calc(14 * var(--u)); height: calc(14 * var(--u)); }
  .lang-menu { display: block; position: absolute; right: calc(52 * var(--u)); top: calc(22 * var(--u)); width: calc(88 * var(--u)); }
  .lang-menu .lang-btn, .lang-menu .lang-list a { height: calc(36 * var(--u)); padding: 0 calc(6 * var(--u)); font-size: calc(10 * var(--u)); }
  .lang-menu .flag { width: calc(23 * var(--u)); height: calc(14 * var(--u)); }
  .lang-menu .lang-code { margin-left: calc(6 * var(--u)); }
  .lang-menu .lang-chev { width: calc(8 * var(--u)); height: calc(6 * var(--u)); }
  .menu-list { width: calc(132 * var(--u)); }
  .menu-list li { border-bottom: 1px solid #555; }
  .menu-list a { height: auto; font-size: calc(14 * var(--u)); line-height: calc(35 * var(--u)); }

  .grid, .wide { width: auto; margin-left: 0; }
  .totop { position: fixed; z-index: 70; left: 0; bottom: calc(26 * var(--u)); width: calc(44 * var(--u)); height: calc(44 * var(--u)); display: flex; align-items: center; justify-content: center;
    border: 1px solid #fff; border-left: 0; background: #000; color: #fff; opacity: 0; visibility: hidden; transition: opacity .3s, visibility 0s .3s; }
  .totop.show { opacity: 1; visibility: visible; transition: opacity .3s; }
  .totop svg { width: calc(21 * var(--u)); height: calc(11 * var(--u)); }

  /* Úvod */
  .hero { height: calc(142 * var(--u)); margin-bottom: 0; clip-path: none; }
  html[lang="en"] .hero { height: calc(128 * var(--u)); }
  html[lang="en"] .h-tag { margin-top: 0; }
  html[lang="en"] .reel { height: calc(228 * var(--u)); }
  .hero-bg { overflow: hidden; }
  .hero-bg img { position: absolute; height: 100%; }
  .hero-h { left: calc(20 * var(--u)); top: calc(70 * var(--u)); width: calc(285 * var(--u)); font-size: calc(18 * var(--u)); }
  .h-name { line-height: calc(21 * var(--u)); }
  .h-sub { margin-top: 0; font-size: calc(12 * var(--u)); line-height: calc(14 * var(--u)); }
  .h-tag { margin-top: calc(4 * var(--u)); font-size: calc(10 * var(--u)); line-height: calc(13 * var(--u)); }
  .reel { height: calc(214 * var(--u)); }
  .player { left: calc(20 * var(--u)); top: calc(32 * var(--u)); width: calc(280 * var(--u)); height: calc(159 * var(--u)); }
  .player-big { width: calc(30 * var(--u)); height: calc(30 * var(--u)); margin: calc(-15 * var(--u)) 0 0 calc(-15 * var(--u)); }
  .player-bar { height: 44px; padding: 16px 10px 0; gap: 8px; }
  .player-progress { left: 10px; right: 10px; top: 8px; }
  .pb-pip { display: none; }
  .services { height: auto; padding: calc(20 * var(--u)) 0 calc(9 * var(--u)); }
  .services .grid { display: grid; gap: calc(20 * var(--u)); }
  .svc, .svc-1, .svc-2, .svc-3, .svc-4 { position: relative; left: 0; top: 0; width: 100%; height: auto; padding: calc(20 * var(--u)) calc(20 * var(--u)) calc(20 * var(--u)); }
  .svc h2, .svc p { position: relative; left: 0; top: 0; width: 100%; }
  .svc h2 { font-size: calc(19 * var(--u)); line-height: calc(26.6 * var(--u)); }
  .svc p { margin-top: calc(9 * var(--u)); font-size: calc(16 * var(--u)); line-height: calc(19 * var(--u)); }

  .gal { height: auto; padding-top: calc(33 * var(--u)); }
  .gal > .gal-more { display: block; position: absolute; right: 0; top: calc(4 * var(--u)); }
  .gal-more .ch-more { width: calc(42 * var(--u)); height: calc(42 * var(--u)); justify-content: center; gap: 0; }
  .gal-more .ch-more svg { width: calc(4 * var(--u)); height: calc(18 * var(--u)); margin: 0; }
  .gal-more .ch-menu { left: auto; right: 0; }
  .slider { position: relative; top: 0; height: calc(180 * var(--u)); margin-top: calc(19 * var(--u)); }
  .sl-prev, .sl-next { display: none; }
  .sl-track { inset: 0; gap: 0; padding: 0; }
  .sl-item { flex: 0 0 100%; height: calc(180 * var(--u)); }
  .sl-item .vt-thumb { height: 100%; aspect-ratio: auto; }
  .sl-item .vt-play { width: calc(30 * var(--u)); height: calc(30 * var(--u)); margin: calc(-15 * var(--u)) 0 0 calc(-15 * var(--u)); }
  .sl-item .vt-dur, .sl-item .vt-info { display: none; }
  .sl-dots { display: flex; justify-content: center; align-items: center; gap: calc(6 * var(--u)); height: calc(44 * var(--u)); }
  .sl-dots i { display: block; width: calc(6 * var(--u)); height: calc(6 * var(--u)); border-radius: 50%; background: #999; transition: all .2s; }
  .sl-dots i.on { background: #fff; }
  .sl-dots i.s1 { transform: scale(.75); } .sl-dots i.s2 { transform: scale(.5); opacity: .6; }
  .gal-btn { position: relative; top: 0; padding: calc(8 * var(--u)) 0 calc(25 * var(--u)); }
  .gal-btn .btn-all { position: relative; left: calc(40 * var(--u)); }
  .btn-all { width: calc(240 * var(--u)); height: calc(42 * var(--u)); font-size: calc(16 * var(--u)); }
  .clients { display: none; }

  .ftr { height: calc(164 * var(--u)); }
  .ftr-h { top: calc(23 * var(--u)); font-size: calc(18 * var(--u)); line-height: calc(20 * var(--u)); }
  .ftr-t { top: calc(63 * var(--u)); font-size: calc(14 * var(--u)); line-height: calc(19.6 * var(--u)); }
  .ftr-soc { top: calc(112 * var(--u)); left: calc(120 * var(--u)); }
  .soc a { width: calc(23 * var(--u)); height: calc(23 * var(--u)); }
  .soc { gap: calc(5 * var(--u)); }

  /* Projekty */
  .pj-head { height: calc(100 * var(--u)); }
  .pj-head h1 { top: calc(20 * var(--u)); font-size: calc(30 * var(--u)); line-height: calc(40.5 * var(--u)); }
  .pj { padding: 0; }
  .ch-bar { height: calc(35 * var(--u)); text-align: right; }
  .ch-bar .ch-more { width: calc(42 * var(--u)); height: calc(42 * var(--u)); justify-content: center; }
  .ch-bar .ch-more svg { width: calc(4 * var(--u)); height: calc(18 * var(--u)); margin: 0; }
  .ch-bar .ch-more span { display: none; }
  .ch-bar .ch-menu { left: auto; right: 0; text-align: left; }
  .pj-grid { display: flex; gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .pj-grid::-webkit-scrollbar { display: none; }
  .pj-item { flex: 0 0 100%; height: calc(180 * var(--u)); scroll-snap-align: start; position: relative; }
  .pj-item .vt-thumb { height: 100%; aspect-ratio: auto; }
  .pj-item .vt-hover { display: none; }
  .pj-item .vt-thumb::after { content: ''; position: absolute; inset: 0; background: rgba(0,0,0,.35); }
  .pj-item .vt-info { position: absolute; z-index: 1; left: 0; right: 0; top: calc(56 * var(--u)); padding: 0 calc(20 * var(--u)); pointer-events: none; }
  .pj-item h3 { font: 700 calc(18 * var(--u))/calc(22 * var(--u)) var(--helv); text-decoration: underline; text-underline-offset: 2px; }
  .pj-item h3 .t { display: none; } .pj-item h3 .c { display: inline; }
  .pj-item p { display: none; }
  .pj-item .vt-play { display: block; position: absolute; z-index: 1; left: calc(103 * var(--u)); top: calc(99 * var(--u)); margin: 0; width: calc(25 * var(--u)); height: calc(25 * var(--u)); }
  .pj-item .pj-play-l { display: block; }
  .pj-play-l { position: absolute; z-index: 1; left: calc(134 * var(--u)); top: calc(99 * var(--u)); font: 400 calc(14 * var(--u))/calc(25 * var(--u)) var(--helv); pointer-events: none; }
  .pj .sl-dots { margin-bottom: calc(-10 * var(--u)); }

  /* O mně */
  .ab-intro { height: auto; }
  .ab-intro .wide { display: flex; flex-direction: column; align-items: center; }
  .ab-img { position: relative; top: 0; width: 100%; height: calc(200 * var(--u)); }
  .ab-box { display: none; }
  .ab-intro h1 { position: relative; left: 0; top: 0; margin-top: calc(21 * var(--u)); font-size: calc(23 * var(--u)); line-height: calc(28 * var(--u)); white-space: normal; text-align: center; }
  .ab-lead { position: relative; left: 0; top: 0; width: calc(280 * var(--u)); margin: calc(16 * var(--u)) 0 calc(22 * var(--u)); text-align: center; font-size: calc(17 * var(--u)); line-height: calc(30.6 * var(--u)); }
  .ab-me { height: auto; padding: calc(20 * var(--u)) calc(20 * var(--u)) calc(20 * var(--u)) calc(19 * var(--u)); }
  .ab-me .grid { display: flex; flex-direction: column; }
  .ab-me h2, .ab-name, .ab-body, .polaroid { position: relative; left: 0; top: 0; }
  .ab-me h2 { font-size: calc(33 * var(--u)); line-height: calc(40 * var(--u)); }
  .ab-name { margin-top: calc(10 * var(--u)); font-size: calc(19 * var(--u)); line-height: calc(23 * var(--u)); }
  .polaroid { align-self: center; margin: calc(22 * var(--u)) 0 calc(36 * var(--u)); width: calc(156 * var(--u)); height: calc(173 * var(--u)); padding: calc(4 * var(--u)) calc(4 * var(--u)) calc(21 * var(--u)); }
  .polaroid img { width: 100%; height: calc(148 * var(--u)); }
  .ab-body { width: 100%; font-size: calc(18 * var(--u)); line-height: calc(25.2 * var(--u)); }
  .ab-body p + p { margin-top: calc(25.2 * var(--u)); }
  .ab-contact { display: none; }

  /* Certifikáty */
  .ct-head { height: calc(120 * var(--u)); }
  .ct-head h1 { top: calc(42 * var(--u)); font-size: calc(30 * var(--u)); line-height: calc(36 * var(--u)); }
  .ct { height: auto; }
  .ct-grid { grid-template-columns: 1fr; gap: calc(20 * var(--u)); padding: calc(20 * var(--u)) calc(20 * var(--u)) calc(16 * var(--u)); }
  .ct-grid img { width: 100%; height: calc(196 * var(--u)); }

  /* Kontakt */
  .co-head { height: calc(137 * var(--u)); }
  .co-head h1 { top: calc(60 * var(--u)); font-size: calc(30 * var(--u)); line-height: calc(36 * var(--u)); }
  .co { height: auto; padding: calc(21 * var(--u)) calc(20 * var(--u)) calc(52 * var(--u)); }
  .co-in { position: static; width: auto; display: flex; flex-direction: column-reverse; }
  .co-form { position: relative; left: 0; width: 100%; height: auto; display: flex; flex-direction: column; }
  .co-fh, .co-form label, .f-send, .f-status { position: relative; left: 0; top: 0; width: 100%; }
  .co-fh { font-size: calc(18 * var(--u)); line-height: calc(22 * var(--u)); margin-bottom: calc(28 * var(--u)); }
  .co-form label { margin-bottom: calc(12 * var(--u)); }
  .co-form label span { top: 0; height: auto; margin-bottom: calc(3 * var(--u)); font-size: calc(14 * var(--u)); line-height: calc(30 * var(--u)); }
  .co-form input { height: calc(44 * var(--u)); font-size: 16px; }
  .co-form textarea { height: calc(75 * var(--u)); font-size: 16px; }
  .f-send { width: calc(160 * var(--u)); height: calc(40 * var(--u)); margin: 0 auto; font-size: calc(14 * var(--u)); line-height: calc(40 * var(--u)); }
  .f-status { margin-top: calc(15 * var(--u)); font-size: calc(14 * var(--u)); min-height: calc(17 * var(--u)); }
  .co-info { margin-top: calc(85 * var(--u)); display: flex; flex-direction: column; gap: calc(21 * var(--u)); }
  .co-addr .co-k { margin-top: calc(10 * var(--u)); }
  .co-mail { margin-top: calc(-9 * var(--u)); }
  .co-item { position: relative; left: 0 !important; top: 0 !important; width: 100%; }
  .co-addr { order: 1; } .co-mail { order: 2; } .co-phone { order: 3; } .co-soc { order: 4; }
  .co-ico { height: calc(27 * var(--u)); }
  .co-k { margin-top: calc(16 * var(--u)); font-size: calc(19 * var(--u)); line-height: calc(26.6 * var(--u)); }
  .co-v, .co-phone .co-v { margin-top: calc(10 * var(--u)); font-size: calc(16 * var(--u)); line-height: calc(22.4 * var(--u)); }
  .co-lines { line-height: calc(28.8 * var(--u)); }
  .co-soc .soc { margin: calc(10 * var(--u)) 0 0 calc(-7 * var(--u)); }

  /* Lightbox na mobile */
  .lb-stage { left: 0; right: 0; top: 48px; bottom: 96px; }
  .lb-player { max-width: 100%; }
  .lb-nav { display: none; }
  .lb-strip { height: 90px; }
  .lb-thumb { flex-basis: 160px; height: 90px; }
  .lb-strip-next { height: 90px; }
  .share-box { width: calc(100% - 40px); }
  .nf { padding: 60px 20px 80px; }
}

/* Wix animácie nevypína ani pri systémovom „obmedziť pohyb“, kópia sa správa rovnako. */