/* Roxfilm — web 2026 · podle Brand manuálu 2026 („Zaostřeno.“)
   Méně je víc: obraz je hlavní hrdina, text ustupuje. */
:root{
  --ink:#0F0F0E;      /* Inkoust */
  --coal:#1C1C1A;     /* Uhel */
  --graphite:#5F5D59; /* Grafit */
  --paper:#F2F0EB;    /* Papír */
  --screen:#E3E0D9;   /* Plátno */
  --tally:#E3361E;    /* Tally – jen jeden červený prvek */
  --g75:#484745; --g50:#80807C; --g25:#B9B8B4;
  --line:#2A2927; --line-l:#D6D2CA; --muted:#9C9993;
  --f-head:"Montserrat",system-ui,sans-serif;
  --f-body:"Inter",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,monospace;
  --gutter:clamp(18px,4vw,56px);
  --max:1280px;
  --ease:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overscroll-behavior-x:none}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--ink);color:var(--paper);font:400 16px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img,video,canvas{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:1px solid var(--paper);outline-offset:4px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}

/* ---------- typografie ---------- */
.t-display,.t-statement,.t-h2,.t-h3{font-family:var(--f-head);font-weight:800;margin:0;text-transform:uppercase;text-wrap:balance}
.t-display{font-size:clamp(38px,5.4vw,84px);line-height:.98;letter-spacing:-.03em}
.t-statement{font-size:clamp(30px,4.4vw,66px);line-height:1.04;letter-spacing:-.03em}
.t-h2{font-size:clamp(22px,2.2vw,34px);line-height:1.1;letter-spacing:-.015em}
.t-h3{font-size:clamp(17px,1.4vw,20px);line-height:1.2;letter-spacing:-.005em}
.label{display:inline-block;font:500 11px/1.4 var(--f-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.muted{color:var(--muted)}
.small{font-size:14px;line-height:1.55}
p{margin:0}
.rec-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--tally);margin-right:8px;vertical-align:1px}

/* šipka = polovina X z loga */
.arr{display:inline-block;width:7px;height:12px;flex:none;transition:transform .35s var(--ease)}
.more{display:inline-flex;align-items:center;gap:10px;font:600 14px/1 var(--f-body);text-decoration:none;color:var(--paper)}
.more:hover .arr,a:hover>.more .arr{transform:translateX(4px)}
.btn{display:inline-flex;align-items:center;gap:12px;padding:13px 18px;border:1px solid rgba(242,240,235,.5);font:600 14px/1 var(--f-body);text-decoration:none;transition:background .3s var(--ease),color .3s var(--ease),border-color .3s}
.btn:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn--solid{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn--solid:hover{background:transparent;color:var(--paper)}

/* ---------- navigace ---------- */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px var(--gutter);transition:background .4s,transform .5s var(--ease),padding .4s}
.nav.is-solid{background:rgba(15,15,14,.78);backdrop-filter:saturate(1.4) blur(18px);-webkit-backdrop-filter:saturate(1.4) blur(18px);padding-top:12px;padding-bottom:12px}
.nav.is-hidden{transform:translateY(-100%)}
.nav__logo img{height:30px;width:auto}
.nav__links{display:flex;align-items:center;gap:28px;list-style:none;margin:0;padding:0}
.nav__links a{text-decoration:none;font-size:13px;font-weight:600;color:var(--g25);transition:color .2s}
.nav__links a:hover{color:var(--paper)}
.nav__links .btn{color:var(--paper);padding:9px 14px;font-size:13px}
.nav__links .btn:hover{color:var(--ink)}
.nav__toggle{display:none;width:40px;height:40px;align-items:center;justify-content:center}
.nav__toggle span{display:block;width:20px;height:1.5px;background:var(--paper);box-shadow:0 6px 0 var(--paper),0 -6px 0 var(--paper)}
@media (max-width:860px){
  .nav__toggle{display:flex}
  .nav__links{position:fixed;inset:0;flex-direction:column;justify-content:center;gap:26px;background:var(--ink);transform:translateX(100%);transition:transform .5s var(--ease)}
  .nav__links a{font:800 24px/1 var(--f-head);text-transform:uppercase;color:var(--paper)}
  .nav__links .btn{font:600 15px/1 var(--f-body);text-transform:none;padding:14px 20px}
  .nav.is-open .nav__links{transform:none}
  .nav.is-open .nav__toggle{position:relative;z-index:2}
  .nav__logo img{height:26px}
}

/* ---------- HERO: scroll kamera ---------- */
.hero{position:relative;height:430vh;background:#000}
.hero__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#000}
.hero__cam{position:absolute;inset:-2%;z-index:1;will-change:transform}
.hero__canvas,.hero__poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__poster{transition:opacity .6s}
.hero.is-ready .hero__poster{opacity:0}
.hero__reel{position:absolute;inset:0;z-index:0;background:#000}
.hero__xc{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;visibility:hidden}
.hero__reel video{width:100%;height:100%;object-fit:cover}
.hero__shade{position:absolute;inset:0;z-index:3;background:linear-gradient(90deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,.15) 40%,rgba(0,0,0,0) 62%);pointer-events:none}
.bar{position:absolute;left:0;right:0;bottom:0;height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--gutter);color:var(--g50);z-index:3;font:500 10.5px/1 var(--f-mono);letter-spacing:.22em;text-transform:uppercase;background:linear-gradient(0deg,rgba(0,0,0,.7),transparent)}
.bar>span{flex:1}
.bar .rec{text-align:center}
.bar .tc{text-align:right}
.bar .rec .rec-dot{background:var(--g75);transition:background .15s,box-shadow .15s}
.hero.is-rec .bar .rec{color:var(--paper)}
.hero.is-rec .bar .rec .rec-dot{background:var(--tally);box-shadow:0 0 12px rgba(227,54,30,.8)}
.hero__copy{position:absolute;left:var(--gutter);bottom:clamp(96px,14vh,150px);z-index:4;max-width:min(640px,86vw)}
.hero__copy p{margin-top:18px;color:var(--screen);font-size:clamp(15px,1.2vw,17px);max-width:34ch}
.scrollhint{position:absolute;right:var(--gutter);bottom:clamp(96px,14vh,150px);z-index:4;display:flex;align-items:center;gap:12px}
.scrollhint i{display:block;width:1px;height:40px;background:linear-gradient(var(--g25),transparent);animation:hint 2.2s var(--ease) infinite}
@keyframes hint{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
/* značky ostření – polovinky X z loga zaostří na objektiv */
.focus{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0}
.fm{position:absolute;top:50%;width:clamp(22px,2.5vw,38px);height:auto;color:var(--paper);transform:translateY(-50%)}
.fm--l{left:var(--gutter)}
.fm--r{right:var(--gutter)}
.hero__end{position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(96px,13vh,140px);z-index:4;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;opacity:0;pointer-events:none}
.hero__end.is-on{pointer-events:auto}
@media (max-width:700px){
  .hero{height:380vh}
  .hero__shade{background:linear-gradient(0deg,rgba(0,0,0,.75) 0%,rgba(0,0,0,.15) 50%,rgba(0,0,0,0) 75%)}
  .bar__l,.scrollhint{display:none}
  .bar .rec{text-align:left}
  .hero__end{flex-direction:column;align-items:flex-start}
}

/* ---------- výplň sekcí ---------- */
.sec{padding:clamp(88px,11vw,170px) 0;position:relative}
.sec--tight{padding-top:0}
.sec--light{background:var(--paper);color:var(--ink)}
.sec--light .muted,.sec--light .label{color:var(--graphite)}
.head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px 64px;align-items:end;margin-bottom:clamp(36px,4.5vw,64px)}
.head .label{display:block;margin-bottom:16px}
.head p{color:var(--muted);max-width:46ch;justify-self:end;font-size:15px}
.sec--light .head p{color:var(--graphite)}
@media (max-width:860px){.head{grid-template-columns:1fr}.head p{justify-self:start}}

/* ---------- plynulé efekty při scrollu ---------- */
[data-reveal]{opacity:0;transform:translate3d(0,42px,0);transition:opacity 1.2s var(--ease),transform 1.4s var(--ease);transition-delay:var(--d,0s)}
[data-reveal].is-in{opacity:1;transform:none}
.px{overflow:hidden;position:relative}
.px__in{position:absolute;inset:-9% 0;will-change:transform}
.px__in>img,.px__in>video{width:100%;height:100%;object-fit:cover}
.js-off [data-reveal]{opacity:1;transform:none}

/* ---------- spolupráce: text, který se rozsvěcí ---------- */
.statement{position:relative;height:260vh;background:#000}
.statement__pin{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:flex-end;padding-bottom:12vh;overflow:hidden}
.statement__bg{position:absolute;inset:0;clip-path:inset(18% 22%);-webkit-clip-path:inset(18% 22%);will-change:clip-path}
.statement__bg img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;transform:scale(1.18);will-change:transform}
.statement__shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.5) 45%,rgba(0,0,0,.12) 75%),linear-gradient(90deg,rgba(0,0,0,.35),rgba(0,0,0,0) 60%);opacity:0;will-change:opacity}
.statement__copy{position:relative;z-index:2;width:100%;will-change:transform}
.statement__text{max-width:15ch}
.statement__text .w{color:rgba(242,240,235,.22);transition:color .25s linear}
.statement__text .w.on{color:var(--paper)}
.statement__sub{margin-top:clamp(24px,3vw,40px);max-width:44ch;color:var(--screen);font-size:clamp(15px,1.25vw,18px);opacity:0;transform:translateY(16px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.statement.is-done .statement__sub{opacity:1;transform:none}
@media (max-width:700px){.statement__bg img{object-position:34% 30%}.statement__shade{background:linear-gradient(0deg,rgba(0,0,0,.8) 0%,rgba(0,0,0,.45) 60%,rgba(0,0,0,.3) 100%)}}

/* ---------- pro koho ---------- */
.who{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:40px clamp(40px,6vw,96px);align-items:center}
.who__text p{color:var(--graphite);max-width:42ch;margin-top:20px}
.who__team{aspect-ratio:3/2}
.aud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px);margin-top:clamp(56px,7vw,110px)}
.aud figure{margin:0}
.aud .px{aspect-ratio:4/5}
.aud h3{margin-top:20px}
.aud p{margin-top:8px;color:var(--graphite);font-size:14px;max-width:34ch}
.clients__label{display:block;margin-top:clamp(64px,8vw,120px);padding-top:28px;border-top:1px solid var(--line-l)}
/* nekonečný pás (loga, fotky) */
.marquee{position:relative;overflow:hidden;margin-top:28px;height:calc(clamp(30px,3.4vw,46px) * 1.25 + 16px)}
.marquee::before,.marquee::after{content:"";position:absolute;top:0;bottom:0;width:8%;z-index:2;pointer-events:none}
.marquee::before{left:0;background:linear-gradient(90deg,var(--mq-bg,var(--paper)),transparent)}
.marquee::after{right:0;background:linear-gradient(-90deg,var(--mq-bg,var(--paper)),transparent)}
.marquee__track{position:relative;height:100%;list-style:none;margin:0;padding:0}
.marquee__track li{position:absolute;left:0;top:50%;transform:translate3d(-9999px,-50%,0);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.marquee__track img{height:calc(clamp(30px,3.4vw,46px) * var(--h,1));width:auto;display:block;opacity:.88}
.marquee--photos{margin-top:0;height:clamp(300px,34vw,520px)}
.marquee--photos::before,.marquee--photos::after{display:none}
.marquee--photos img{height:clamp(300px,34vw,520px);opacity:1;transition:transform 1s var(--ease)}
.marquee--photos button:hover img{transform:scale(1.02)}
@media (max-width:860px){.who{grid-template-columns:1fr}.aud{grid-template-columns:1fr 1fr}.aud figure:last-child{grid-column:span 2}.aud figure:last-child .px{aspect-ratio:16/10}}
@media (max-width:520px){.aud{grid-template-columns:1fr}.aud figure:last-child{grid-column:auto}.aud figure .px,.aud figure:last-child .px{aspect-ratio:4/5}}

/* ---------- deck: swipovací karusel ---------- */
.deck{position:relative;outline:none;user-select:none;-webkit-user-select:none}
.deck__stage{position:relative;height:clamp(460px,46vw,700px);perspective:1800px;overflow:hidden;touch-action:pan-y;cursor:grab}
.deck.is-drag .deck__stage{cursor:grabbing}
.deck__card{--w:clamp(220px,20vw,320px);position:absolute;left:50%;top:50%;width:var(--w);aspect-ratio:9/16;margin:0;transform:translate(-50%,-50%);background:var(--coal);overflow:hidden;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.deck__card .vp{position:absolute;inset:0}
.deck__card img,.deck__card video{width:100%;height:100%;object-fit:cover;pointer-events:none}
.deck__card video{opacity:0;transition:opacity .5s}
.deck__card .vp.is-playing video{opacity:1}
.deck__card::after{content:"";position:absolute;inset:0;background:#000;opacity:var(--dim,0);pointer-events:none}
.deck__card.is-active::before{content:"";position:absolute;z-index:2;right:12px;top:12px;width:7px;height:7px;border-radius:50%;background:var(--tally);box-shadow:0 0 10px rgba(227,54,30,.9)}
.deck__ui{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:24px;padding:0 var(--gutter)}
.deck__ui button{width:44px;height:44px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex:none;transition:border-color .2s}
.deck__ui button:hover{border-color:var(--paper)}
.deck__ui .arr{width:8px;height:13px}
.deck__prev .arr{transform:scaleX(-1)}
.deck__info{min-width:min(300px,56vw);text-align:center}
.deck__count{font:500 11px/1 var(--f-mono);letter-spacing:.2em;color:var(--g50)}
.deck__count b{color:var(--paper);font-weight:500}
.deck__label{display:block;margin-top:8px;font-size:14px;font-weight:600;min-height:1.4em}
.deck__hint{display:block;text-align:center;margin-top:14px}
@media (max-width:700px){.deck__stage{height:122vw;max-height:580px}.deck__card{--w:60vw}.deck__ui{gap:14px}}

/* ---------- case studies ---------- */
.cases{display:grid;gap:clamp(72px,9vw,140px)}
.case{display:block;text-decoration:none;color:inherit}
.case__media{aspect-ratio:2.39/1;background:#000}
.case__media .px__in{display:grid}
.case__media--reels .px__in{grid-template-columns:repeat(4,1fr);gap:4px}
.case__media .vp{position:relative;width:100%;height:100%}
.case__media .vp img,.case__media .vp video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.case__media .vp video{opacity:0;transition:opacity .5s}
.case__media .vp.is-playing video{opacity:1}
.case__meta{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) auto;gap:16px 48px;align-items:start;margin-top:22px}
.case__meta .label{display:block;margin-bottom:10px}
.case__meta p{color:var(--muted);font-size:15px;max-width:48ch}
.case__meta .more{margin-top:4px;white-space:nowrap}
.case__fig{display:block;margin-top:10px;font:500 11px/1.4 var(--f-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--g25)}
@media (max-width:860px){.case__media{aspect-ratio:16/11}.case__media--reels .px__in{grid-template-columns:repeat(3,1fr)!important}.case__media--reels .vp:nth-child(n+4){display:none}.case__meta{grid-template-columns:1fr}}

/* ---------- portfolio ---------- */
.filters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:32px}
.filters button{padding:8px 14px;border:1px solid var(--line);font-weight:600;font-size:13px;color:var(--g25);transition:all .25s}
.filters button[aria-pressed="true"]{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.filters button:hover{border-color:var(--paper);color:var(--paper)}
.filters button[aria-pressed="true"]:hover{color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 20px}
.item{display:block;text-align:left;width:100%}
.item[hidden]{display:none}
.item__frame{position:relative;aspect-ratio:16/9;background:var(--coal);overflow:hidden}
.item__frame .vp{position:absolute;inset:0}
.item__frame img,.item__frame video{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.item:hover .item__frame img,.item:hover .item__frame video{transform:scale(1.035)}
.item__frame video{position:absolute;inset:0;opacity:0;transition:opacity .4s,transform 1.2s var(--ease)}
.item__frame .vp.is-playing video{opacity:1}
.item__tc{position:absolute;right:10px;bottom:9px;color:var(--paper);font:500 10px/1 var(--f-mono);letter-spacing:.15em;text-shadow:0 1px 6px rgba(0,0,0,.7)}
.item__play{position:absolute;left:12px;bottom:9px;display:flex;align-items:center;color:var(--paper);opacity:0;transform:translateY(6px);transition:all .35s var(--ease);font:500 10px/1 var(--f-mono);letter-spacing:.18em;text-transform:uppercase}
.item:hover .item__play,.item:focus-visible .item__play{opacity:1;transform:none}
.item h3{font:600 15px/1.3 var(--f-body);margin:14px 0 4px}
.item p{color:var(--muted);font-size:13.5px;line-height:1.5}
@media (max-width:1000px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.grid{grid-template-columns:1fr}}

/* ---------- za kamerou ---------- */
.collage{columns:3;column-gap:12px}
.collage figure{margin:0 0 12px;break-inside:avoid;overflow:hidden;background:var(--coal)}
.collage button{display:block;width:100%;cursor:zoom-in}
.collage img{width:100%;height:auto;display:block;transition:transform 1.2s var(--ease),filter .6s}
.collage button:hover img{transform:scale(1.035)}
@media (max-width:760px){.collage{columns:2;column-gap:8px}.collage figure{margin-bottom:8px}}
/* fotka přes celou obrazovku */
.lightbox{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.94);padding:clamp(16px,4vw,56px);cursor:zoom-out}
.lightbox.is-open{display:flex}
.lightbox img{max-width:100%;max-height:100%;object-fit:contain;animation:lbIn .5s var(--ease)}
@keyframes lbIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}

/* ---------- o nás ---------- */
.about{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px clamp(40px,7vw,110px);align-items:end}
.about__img{aspect-ratio:4/5;max-width:440px}
.about__img img{filter:grayscale(1) contrast(1.04)}
.about h2{margin-top:14px}
.about__bio{margin-top:22px;color:var(--graphite);max-width:54ch}
.about blockquote{margin:30px 0 0;padding:0 0 0 18px;border-left:1px solid currentColor;font:600 clamp(16px,1.35vw,19px)/1.5 var(--f-body);max-width:46ch}
.about__team{margin-top:30px;font-size:14px;color:var(--graphite);max-width:54ch}
@media (max-width:860px){.about{grid-template-columns:1fr}.about__img{max-width:380px}}

/* ---------- kontakt ---------- */
.contact{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px clamp(40px,7vw,110px);align-items:start}
.contact p{margin-top:18px;color:var(--muted);max-width:34ch;font-size:15px}
.clist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.clist li{border-bottom:1px solid var(--line)}
.clist a{display:grid;grid-template-columns:9.5em 1fr auto;align-items:center;gap:16px;padding:20px 0;text-decoration:none}
.clist span{font:500 10.5px/1 var(--f-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--g50)}
.clist b{font:600 clamp(16px,1.4vw,19px)/1.3 var(--f-body);overflow-wrap:anywhere;transition:color .2s}
.clist a:hover b{color:#fff}
.clist a:hover .arr{transform:translateX(4px)}
@media (max-width:860px){.contact{grid-template-columns:1fr}}
@media (max-width:480px){.clist a{grid-template-columns:1fr auto}.clist span{grid-column:1/-1}}

/* ---------- patička ---------- */
.foot{border-top:1px solid var(--line);padding:32px 0 40px;color:var(--g50);font-size:13px}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px}
.foot img{height:24px;width:auto;opacity:.85}
.foot a{text-decoration:none}
.foot a:hover{color:var(--paper)}
.foot nav{display:flex;flex-wrap:wrap;gap:20px}

/* ---------- přehrávač ---------- */
.player{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.95);padding:clamp(16px,4vw,56px)}
.player.is-open{display:flex}
.player__box{position:relative;width:min(1400px,100%);max-height:100%;display:flex;flex-direction:column}
.player__box video{width:100%;max-height:calc(100vh - 120px);max-height:calc(100svh - 120px);background:#000}
.player.is-vertical .player__box{width:auto;align-items:center}
.player.is-vertical video{width:auto;height:calc(100vh - 120px);height:calc(100svh - 120px);aspect-ratio:9/16;max-width:100%}
.player__top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:0 0 12px;width:100%}
.player__top b{font:600 15px/1.3 var(--f-body)}
.player__close{width:40px;height:40px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex:none}
.player__close:hover{border-color:var(--paper)}
.player__close svg{width:14px;height:14px}

/* ---------- podstránky: case study ---------- */
.cs-hero{position:relative;padding-top:72px;background:#000}
.cs-hero__frame{aspect-ratio:2.39/1;max-height:78vh;width:100%}
.cs-hero__frame .px__in{display:grid}
.cs-hero__frame--reels .px__in{grid-template-columns:repeat(5,1fr);gap:4px}
.cs-hero__frame .vp{position:relative;width:100%;height:100%}
.cs-hero__frame .vp img,.cs-hero__frame .vp video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cs-hero__frame .vp video{opacity:0;transition:opacity .5s}
.cs-hero__frame .vp.is-playing video{opacity:1}
.cs-title{padding:clamp(56px,7vw,100px) 0 0}
.cs-title .t-display{font-size:clamp(36px,5vw,76px)}
.cs-title p{margin-top:22px;max-width:52ch;color:var(--screen);font-size:clamp(16px,1.35vw,19px)}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:clamp(44px,5vw,72px) 0 0;border-top:1px solid var(--line)}
.facts div{padding:20px 20px 0 0}
.facts div+div{padding-left:20px;border-left:1px solid var(--line)}
.facts dt{margin-bottom:8px}
.facts dd{margin:0;font-weight:600;font-size:15px}
@media (max-width:860px){.facts{grid-template-columns:repeat(2,minmax(0,1fr))}.facts div:nth-child(3){padding-left:0;border-left:0}.facts div:nth-child(n+3){margin-top:20px;border-top:1px solid var(--line)}.cs-hero__frame{aspect-ratio:16/11}.cs-hero__frame--reels .px__in{grid-template-columns:repeat(3,1fr)!important}.cs-hero__frame--reels .vp:nth-child(n+4){display:none}}
.cut{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,96px)}
.cut h2{margin:10px 0 16px}
.cut p{max-width:46ch}
.cut ul{margin:0;padding:0;list-style:none}
.cut li{padding:11px 0;border-top:1px solid var(--line-l);font-weight:600;font-size:15px}
@media (max-width:760px){.cut{grid-template-columns:1fr}}
.nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line-l);margin-top:clamp(48px,6vw,88px)}
.nums div{padding:22px 22px 0 0}
.nums div+div{padding-left:22px;border-left:1px solid var(--line-l)}
.nums b{display:block;font:800 clamp(34px,3.8vw,56px)/1 var(--f-head);letter-spacing:-.04em}
.nums span{display:block;margin-top:10px;font-size:14px;font-weight:600;max-width:26ch}
@media (max-width:760px){.nums{grid-template-columns:1fr}.nums div+div{padding-left:0;border-left:0;border-top:1px solid var(--line-l)}.nums div{padding:20px 0}}
.vgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 20px}
.rgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.reel{text-align:left;display:block;width:100%}
.reel__frame{position:relative;aspect-ratio:9/16;background:var(--coal);overflow:hidden}
.reel__frame .vp{position:absolute;inset:0}
.reel__frame img,.reel__frame video{width:100%;height:100%;object-fit:cover}
.reel__frame video{position:absolute;inset:0;opacity:0;transition:opacity .4s}
.reel__frame .vp.is-playing video{opacity:1}
.reel p{margin-top:10px;font-size:13.5px;color:var(--muted)}
@media (max-width:1000px){.rgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.rgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.vgrid{grid-template-columns:1fr}}
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pgrid figure{margin:0;aspect-ratio:4/5;background:var(--coal)}
.pgrid .px{height:100%}
@media (max-width:700px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.next{display:flex;justify-content:space-between;align-items:center;gap:24px;text-decoration:none;padding:clamp(44px,5vw,72px) 0;border-top:1px solid var(--line)}
.next .t-h2{display:block;margin-top:12px;font-size:clamp(28px,3.4vw,52px);transition:transform .5s var(--ease)}
.next:hover .t-h2{transform:translateX(10px)}
.next .arr{width:16px;height:28px}

/* ---------- půjčovna ---------- */
.rent{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 64px;margin-top:clamp(48px,6vw,80px)}
.rent__cat h2{margin-bottom:14px}
.rent table{width:100%;border-collapse:collapse;font-size:15px}
.rent td{padding:11px 0;border-top:1px solid var(--line);vertical-align:top}
.rent td+td{text-align:right;white-space:nowrap;padding-left:16px;font-family:var(--f-mono);font-size:13px}
.rent__set{display:flex;justify-content:space-between;align-items:center;gap:32px;margin-top:64px;padding:32px;background:var(--coal)}
.rent__price{text-align:right;flex:none}
.rent__price s{display:block;color:var(--g50)}
.rent__price b{display:block;font:800 clamp(32px,4vw,56px)/1 var(--f-head);letter-spacing:-.04em}
@media (max-width:860px){.rent{grid-template-columns:1fr}.rent__set{flex-direction:column;align-items:flex-start}.rent__price{text-align:left}}

/* ---------- omezení pohybu: bez parallaxy, scrub kamery zůstává (řídí ho uživatel) ---------- */
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1;transform:none;transition:none}
  .scrollhint i{animation:none}
}
/* pás log hned pod spoluprací */
.sec--clients{padding-top:clamp(56px,7vw,96px)}
.sec--clients .marquee{margin-top:22px}
.who-wrap{margin-top:clamp(72px,9vw,140px)}
/* 3D X před reels */
.xs{position:relative;z-index:1;height:400vh;margin-top:-100vh;background:var(--ink)}
/* světlá sekce nad X: spodek se rozpustí do tmy a X pod ní už je vidět */
#pro-koho{position:relative;z-index:2;background:linear-gradient(to bottom,var(--paper) 0,var(--paper) calc(100% - 46vh),rgba(242,240,235,.82) calc(100% - 30vh),rgba(242,240,235,.35) calc(100% - 14vh),rgba(242,240,235,0) 100%);padding-bottom:46vh}
.xs__pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.xs canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.xs__title{position:absolute;left:0;right:0;bottom:7vh;text-align:center;padding:0 var(--gutter);opacity:0;transform:translate3d(0,24px,0);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.xs.is-on .xs__title{opacity:1;transform:none}
.xs__title .label{display:block;margin-bottom:18px}
.xs__title .t-statement{font-size:clamp(30px,4.6vw,70px)}
.sec--reels{padding-top:clamp(40px,5vw,72px)}
.reels__lead{text-align:center;color:var(--muted);font-size:15px;max-width:46ch;margin:0 auto clamp(24px,3vw,40px)}