/* Sekce pod herem – port Raw Structure (rozměry z podklady/rozbor/sections.json, efekty z raw_js) */
:root{--spr3:linear(0,.55 8%,.89 16%,1.043 32%,1.014 50%,.997 70%,1);--spr2:linear(0,.45 8%,.785 16%,.988 32%,1.014 50%,1.004 70%,1);--e44:cubic-bezier(.44,0,.56,1);--card1:#161614;--card2:#1C1C1A;--ease2:cubic-bezier(.22,1,.36,1)}

/* ---------- společné: hlavička sekce (Section Head) ---------- */
.sec{position:relative;padding:140px var(--pad) 160px}
.head{display:grid;grid-template-columns:320px 1fr;align-items:end;margin-bottom:72px}
.lbl{display:flex;align-items:center;gap:10px;color:var(--ac);font:500 12px/1.4 Mono;letter-spacing:.08em;text-transform:uppercase}
.lbl .tick{width:24px;height:1px;background:var(--ac)}
.h2{font:400 96px/.92 Anton;letter-spacing:-.04em;text-transform:uppercase;max-width:1000px}

/* efekt X (nadpisy): slova, blur 10, rotate 4, y80, spring .9 s, po .05 s, práh .4 */
.sw .w{display:inline-block;opacity:.001;filter:blur(10px);transform:translateY(80px) rotate(4deg)}
.sw.on .w{opacity:1;filter:none;transform:none;transition:opacity .5s ease,filter .9s var(--ease2),transform .9s var(--ease2);transition-delay:calc(var(--i)*.05s)}
/* efekt pi (odstavce): slova, blur 10, y40, .8 s */
.sp .w{display:inline-block;opacity:.001;filter:blur(10px);transform:translateY(40px)}
.sp.on .w{opacity:1;filter:none;transform:none;transition:opacity .45s ease,filter .8s var(--ease2),transform .8s var(--ease2);transition-delay:calc(var(--i)*.05s)}
/* Ni/Ri: bloky y60 → 0, 1 s [.22,1,.36,1] */
.up{opacity:0;transform:translateY(60px)}
.up.on{opacity:1;transform:none;transition:opacity 1s var(--ease2),transform 1s var(--ease2);transition-delay:var(--dl,0s)}

/* ---------- pásky ---------- */
.pasky{position:relative;height:296px;overflow:hidden}

/* ---------- (01) Statement ---------- */
.stmt{padding:180px var(--pad) 140px}
.stmt .row{display:grid;grid-template-columns:320px 1fr}
.stmt .lbl{flex-direction:column;align-items:flex-start;gap:0}
.stmt .lbl .scr3{display:block;margin-top:16px}
.stmt .big{font:400 64px/.95 Anton;letter-spacing:-.04em;text-transform:uppercase;max-width:1000px}
/* efekt Rt: slova, blur 10, rotate 6, y60 */
.stmt .big .w{display:inline-block;opacity:.001;filter:blur(10px);transform:translateY(60px) rotate(6deg)}
.stmt .big.on .w{opacity:1;filter:none;transform:none;transition:opacity .5s ease,filter .9s var(--ease2),transform .9s var(--ease2);transition-delay:calc(var(--i)*.05s)}
.logos{display:grid;grid-template-columns:320px 1fr;align-items:center;margin-top:120px}
.logos .mono{color:var(--mut);max-width:280px}
/* loga se pod 1440 px zmenšují s šířkou okna (jinak pás přetéká a stránka jde posouvat do strany) */
.logos ul{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:min(40px,2.78vw);min-width:0}
.logos .lg{position:relative;display:block;height:min(28px,1.94vw)}
.logos .lg.t{height:min(40px,2.78vw)}
.logos .lg img{display:block;height:100%;width:auto;opacity:.45;transition:opacity .45s var(--ease2)}
.logos .lg img.c{position:absolute;inset:0;opacity:0}
.logos li:hover .lg img{opacity:0}
.logos li:hover .lg img.c{opacity:1}

/* ---------- (02) Druhy podlah – Service Item ---------- */
.sl{border-bottom:1px solid var(--ln)}
.si{position:relative;display:flex;align-items:center;height:180px;border-top:1px solid var(--ln);background:var(--bg);color:var(--tx)}
.si .n{width:88px;font:500 13px/1.4 Mono;letter-spacing:.08em;color:var(--ac)}
.si .t{flex:1;min-width:0;font:400 72px/1 Anton;text-transform:uppercase;transition:color .55s var(--e)}
.si .im{width:0;height:120px;overflow:hidden;margin:0 28px;transform:rotate(-4deg);flex:none;transition:width .55s var(--e),transform .55s var(--e)}
.si .im img{width:220px;height:120px;object-fit:cover}
.si .sh{width:220px;margin-right:32px;color:var(--mut);flex:none}
.si .ar{width:64px;height:64px;flex:none;display:grid;place-items:center;border:1px solid var(--ln);color:var(--tx);background:transparent;transition:background .55s var(--e),transform .55s var(--e),color .55s var(--e),border-color .55s var(--e)}
.si .ar svg{width:24px;height:24px}
.si:hover .t,.si:focus-visible .t{color:var(--ac)}
.si:hover .im,.si:focus-visible .im{width:220px;transform:none}
.si:hover .ar,.si:focus-visible .ar{background:var(--ac);border-color:var(--ac);color:var(--bg);transform:rotate(45deg)}

/* ---------- (03) Postup – sticky Floor Cards ---------- */
.fc{position:sticky;display:grid;grid-template-columns:1fr 1fr;gap:48px;height:520px;padding:40px;margin-bottom:40px;background:var(--card1);border:1px solid var(--ln)}
.fc:nth-child(even){background:var(--card2)}
.fc .copy{display:flex;flex-direction:column;justify-content:space-between}
.fc .top{display:flex;justify-content:space-between}
.fc .top .a{color:var(--ac)}.fc .top .b{color:var(--mut)}
.fc .num{font:400 200px/.8 Anton;color:rgba(231,227,220,.04);-webkit-text-stroke:1px var(--ac);margin-top:-30px}
.fc h3{font:400 64px/.95 Anton;letter-spacing:-.04em;text-transform:uppercase}
.fc p{margin-top:13px;max-width:460px;font-size:16px;line-height:1.6;letter-spacing:-.02em;color:var(--mut)}
.fc .ph{background:var(--bg);overflow:hidden}
.fc .ph img{width:100%;height:100%;object-fit:cover;filter:contrast(1.15) grayscale(1);transition:transform .6s var(--ease2)}
.fc .ph:hover img{transform:scale(1.06)}

/* ---------- (04) Reference – jeřáb + galerie ---------- */
.prj{padding:140px 0 120px;overflow:hidden}
.prj .head{padding:0 var(--pad)}
.prj .head{margin-bottom:0}
.beam-z{position:relative;height:120px}
.beam{position:absolute;left:-200px;top:50px;width:1600px;height:22px;background:var(--ac);transform:rotate(-2deg);display:flex;align-items:center;justify-content:space-evenly}
.beam i{flex:none;width:8px;height:8px;border-radius:8px;background:var(--bg)}
.hook{position:absolute;top:72px;left:620px;display:flex;flex-direction:column;align-items:center;transform-origin:50% 0;animation:swing 2.4s cubic-bezier(.45,0,.55,1) infinite alternate}
@keyframes swing{from{transform:rotate(0)}to{transform:rotate(6deg)}}
.hook .cab{width:2px;height:40px;background:var(--mut)}
.hook .mono{font-size:11px;color:var(--tx);white-space:nowrap}
.ctrl{display:flex;justify-content:space-between;align-items:center;padding:0 var(--pad);height:64px}
.ctrl .scr2{font:400 12px/1.3 Mono;letter-spacing:.08em;color:var(--mut);text-transform:uppercase}
.ctrl .arr{display:flex;gap:8px}
.ctrl button{width:56px;height:56px;border:1px solid var(--ln);background:transparent;color:var(--tx);display:grid;place-items:center;cursor:pointer;transition:background .55s var(--e),color .55s var(--e),border-color .55s var(--e)}
.ctrl button:hover{background:var(--ac);color:var(--bg);border-color:var(--ac)}
.ctrl button svg{width:22px;height:22px}
.gal{display:flex;gap:28px;padding:24px 40px 16px;margin-bottom:-16px;overflow-y:hidden;scroll-padding-left:40px;overflow-x:auto;scrollbar-width:none;cursor:grab;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
.gal::-webkit-scrollbar{display:none}
.gal.drag{cursor:grabbing;scroll-snap-type:none}
.pc{flex:none;width:480px;scroll-snap-align:start;color:var(--tx);user-select:none}
.pc .md{position:relative;height:580px;overflow:hidden;background:var(--card2)}
.pc .md img{width:100%;height:100%;object-fit:cover;filter:grayscale(.6);transition:transform .7s var(--ease2),filter .7s var(--ease2);pointer-events:none}
.pc:hover .md img{transform:scale(1.08);filter:grayscale(0)}
.pc .cat{position:absolute;left:16px;top:16px;display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg);font:500 11px/1.4 Mono;letter-spacing:.08em;text-transform:uppercase}
.pc .cat i{width:6px;height:6px;background:var(--ac)}
.pc .pm{display:flex;justify-content:space-between;align-items:flex-start;margin-top:20px}
.pc h3{font:400 36px/1 Anton;text-transform:uppercase;transition:color .55s var(--e)}
.pc:hover h3{color:var(--ac)}
.pc .info{text-align:right;font:500 11px/1.4 Mono;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.pc .info b{display:block;font-weight:500;color:var(--ac)}

/* ---------- (05) Čísla – kostka + počítadla ---------- */
.stats{padding:140px var(--pad) 160px}
.stats .row{display:grid;grid-template-columns:420px 1fr;gap:64px;align-items:center}
.scene{height:480px;display:grid;place-items:center;perspective:1400px}
.cube{position:relative;width:240px;height:240px;transform-style:preserve-3d;transform:rotateX(-22deg) rotateY(32deg);animation:cube 16s linear infinite}
@keyframes cube{from{transform:rotateX(-22deg) rotateY(32deg)}to{transform:rotateX(-22deg) rotateY(392deg)}}
.cube>div{position:absolute;inset:0;backface-visibility:visible;border:1px solid rgba(246,244,240,.25)}
.cube img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.cube .fr{transform:translateZ(120px)}
.cube .bk{transform:rotateY(180deg) translateZ(120px)}
.cube .rt{background:var(--ac);transform:rotateY(90deg) translateZ(120px)}
.cube .lt{transform:rotateY(-90deg) translateZ(120px)}
.cube .tp,.cube .bt{background:#2A2926}
.cube .tp{transform:rotateX(90deg) translateZ(120px)}
.cube .bt{transform:rotateX(-90deg) translateZ(120px)}
.sg{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ln);border-left:1px solid var(--ln)}
.st{padding:32px;min-height:249px;border-right:1px solid var(--ln);border-bottom:1px solid var(--ln);display:flex;flex-direction:column}
.st{position:relative;transition:transform .3s var(--e44),background-color .3s var(--e44)}
.st:hover{transform:scale(1.1);background-color:var(--card2);z-index:2}
.st .mono{color:var(--mut)}
.st .v{margin-top:28px;font:400 96px/.9 Anton;color:var(--tx);font-variant-numeric:tabular-nums}
.st .v{white-space:nowrap}.st .v.sm{font-size:80px}
.st .v s{text-decoration:none;color:var(--ac)}
.st p{margin-top:28px;font-size:16px;line-height:1.6;letter-spacing:-.02em;color:var(--mut)}

/* ---------- Blueprint Reveal (výkres → podlaha) ---------- */
.bpr{position:relative;height:1440px}
.stage{position:sticky;top:0;height:100vh;min-height:640px;overflow:hidden;background:#0B1A2A}
.stage .plan{position:absolute;inset:0;width:100%;height:100%}
.stage .plan g{opacity:0;transition:opacity .9s ease calc(.2s + var(--k)*.16s)}
.stage.pl .plan g{opacity:1}
.stage .bp{z-index:1}
.stage .ph{position:absolute;inset:0;z-index:2;transform:scale(.3) rotate(-8deg);transition:transform 1.6s var(--e) .3s}
.stage .ph img{width:100%;height:100%;object-fit:cover}
.stage.on .ph{transform:none}
.stage .cp{position:absolute;left:40px;width:1120px;max-width:calc(100% - 80px);bottom:48px;z-index:3;display:flex;justify-content:space-between;align-items:flex-end;pointer-events:none}
.stage h2{font:400 96px/.92 Anton;letter-spacing:-.04em;text-transform:uppercase;color:var(--tx);text-shadow:0 2px 30px rgba(0,0,0,.35)}
.stage .cap{opacity:0;transform:translateY(20px);color:var(--tx);transition:opacity .8s var(--ease2) 1.6s,transform .8s var(--ease2) 1.6s}
.stage.capon .cap{opacity:1;transform:none}
.stage .dim{z-index:3;color:#A0C8FF}
.stage .dim i{background:#A0C8FF}

/* ---------- (06) Co dostanete – Quotes ---------- */
.q3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.qc{position:relative;min-height:346px;padding:32px;background:var(--card2);display:flex;flex-direction:column;z-index:0}
.qc.up.on.done{transition:transform .5s var(--spr3);transition-delay:0s}
.qc.done:hover{transform:translateY(-8px) rotate(-1deg) scale(1.1);z-index:2}
.qc.a.done:hover{transform:translateY(-8px) rotate(1deg) scale(1.1)}
.qc.a{background:var(--ac);color:var(--bg)}
.qc svg{width:36px;height:36px;color:var(--ac)}
.qc.a svg{color:var(--bg)}
.qc blockquote{margin-top:auto;font-size:21px;line-height:1.4;letter-spacing:-.01em;font-weight:500}
.qc .who{display:flex;align-items:center;gap:14px;margin-top:40px}
.qc .who .ic{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--bg);color:var(--ac);font:400 18px/1 Anton}
.qc.a .who .ic{background:var(--bg);color:var(--ac)}
.qc .who b{display:block;font-size:16px;font-weight:600}
.qc .who small{font:500 11px/1.4 Mono;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.qc.a .who small{color:var(--bg)}

/* ---------- (07) Desky v kostce – Journal Row ---------- */
.jl{border-bottom:1px solid var(--ln)}
.jr{display:grid;grid-template-columns:192px 152px 1fr 140px 40px;align-items:center;height:136px;border-top:1px solid var(--ln);color:var(--tx);transition:transform .5s var(--spr2)}
.jr .d{color:var(--mut)}
.jr .th{width:120px;height:80px;overflow:hidden}
.jr .th img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .5s var(--ease2)}
.jr:hover .th img{filter:grayscale(0)}
.jr h3{font:400 36px/1 Anton;letter-spacing:-.04em;text-transform:uppercase}
.jr .tg{color:var(--ac)}
.jr svg{width:28px;height:28px}
.jr:hover{transform:translateX(16px) scale(1.1)}

/* ---------- patička ---------- */
.foot{padding:140px var(--pad) 32px;overflow:clip;border-top:1px solid var(--ln)}
.fcta{display:flex;justify-content:space-between;align-items:flex-end;gap:40px}
.fcta .h2{max-width:760px}
.fg{display:grid;grid-template-columns:repeat(4,300px);justify-content:space-between;margin-top:96px;padding-top:40px;border-top:1px solid var(--ln)}
.fg>div{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.fg>div:nth-child(n+3){gap:10px}
.fg .mono{color:var(--mut);font-size:12px;line-height:1.4}
.fg p,.fg a{display:block;font-size:16px;line-height:1.6;color:var(--mut)}
.fg p.w{color:var(--tx)}
.fg a{transition:color .25s var(--e44)}
.fg a:hover{color:var(--tx)}
.fg a.cur{color:var(--tx)}
.fg a.w{color:var(--tx)}
.fg a.w:hover{color:var(--ac)}
.giant{display:flex;justify-content:center;margin:96px 0;padding-bottom:8px;overflow:clip;color:var(--tx)}
.giant svg{width:min(760px,90%);height:auto;fill:currentColor;transform:translateY(220px);filter:blur(10px)}
.giant.on svg{transform:none;filter:none;transition:transform 1.1s linear(0,.3 10%,.72 22%,.96 36%,1.02 50%,1.01 65%,1) .05s,filter 1.1s var(--ease2) .05s}
.bar{display:flex;justify-content:space-between;gap:20px;font:500 11px/1.4 Mono;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.bar .y{color:var(--ac)}

/* ---------- mobil ---------- */
@media (max-width:1199.98px){
  .logos{grid-template-columns:1fr;gap:28px}.logos ul{flex-wrap:wrap;justify-content:flex-start;gap:28px 40px}.logos .lg{height:28px}.logos .lg.t{height:40px}
  .h2{font-size:72px}
  .si .t{font-size:54px}
  .stats .row{grid-template-columns:1fr}
  .fg{grid-template-columns:repeat(2,1fr);gap:40px}
}
@media (max-width:809.98px){
  .sec,.stmt,.stats{padding:88px 20px 96px}
  .head,.stmt .row,.logos{grid-template-columns:1fr;gap:20px}
  .head{margin-bottom:40px}
  .h2{font-size:48px}
  .stmt .big{font-size:38px}
  .logos{margin-top:64px}.logos ul{flex-wrap:wrap;justify-content:flex-start;gap:24px 32px}
  .si{height:auto;padding:24px 0;flex-wrap:wrap;gap:12px 0}
  .si .n{width:40px}.si .t{font-size:34px}
  .si .im,.si .sh{display:none}
  .si .ar{width:44px;height:44px}
  .fc{grid-template-columns:1fr;height:auto;gap:24px;padding:20px}
  .fc .num{font-size:120px;margin-top:0}
  .fc h3{font-size:40px}
  .fc .ph{height:220px}
  .prj{padding:88px 0}
  .prj .head{padding:0 20px}
  .hook{left:40%}
  .ctrl{padding:0 20px}
  .gal{padding:24px 20px 16px;gap:16px;scroll-padding-left:20px}
  .pc{width:78vw}.pc .md{height:96vw}
  .pc h3{font-size:26px}
  .scene{height:300px;transform:scale(.72)}
  .sg{grid-template-columns:1fr}
  .st{min-height:0}.st .v{font-size:72px}
  .bpr{height:1100px}
  .stage .cp{left:20px;width:auto;max-width:none;right:20px;bottom:56px;flex-direction:column;align-items:flex-start;gap:14px}
  .stage h2{font-size:52px}
  .stage .plan g:nth-child(8){display:none}
  .q3{grid-template-columns:1fr}
  .qc.done:hover,.qc.a.done:hover,.st:hover{transform:none}
  .jr{grid-template-columns:96px 1fr 28px;height:auto;padding:20px 0;gap:8px 14px}
  .jr .th,.jr .tg{display:none}
  .jr h3{font-size:24px}
  .jr:hover{transform:none}
  .foot{padding:88px 20px 32px}
  .fcta{flex-direction:column;align-items:flex-start}
  .fg{grid-template-columns:1fr;margin-top:56px}
  .bar{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){
  .hook{animation:none}
  .sw .w,.sp .w,.stmt .big .w,.up{opacity:1!important;filter:none!important;transform:none!important;transition:none!important}
  .cube{animation:none}
  .giant svg{transform:none;filter:none}
  .st,.qc,.jr{transition:none!important}
  .stage .plan g{opacity:1;transition:none}.stage .ph{transform:none;transition:none}.stage .cap{opacity:1;transform:none;transition:none}
}
.go .stage .bp:not(.drawn) path{stroke-dashoffset:1;opacity:0;transition:none}
.go .stage .bp:not(.drawn) .dim{opacity:0}
