/* ===== MJ Web Studio – DEMO úprav (porovnání s TwoStack) ===== */
:root{--marcel:url("ref-marcel.jpg");--kp:#3F6BF5;--kt-petrol:#0F3036;--kt-yellow:#F2C230}

/* ---------- 1) hlavička: jen to podstatné ---------- */
.nav .btn-sm{gap:6px}
.nav .btn-sm b{font-weight:700}

/* ---------- 2) hero: skutečné weby klientů v telefonech ---------- */
.hero{padding:40px 0 0}
.hero .status b{color:var(--ink);font-weight:600}
.hero-top .cta-row{margin-bottom:18px}
.facts .free{display:inline-flex;align-items:center;gap:8px;background:color-mix(in srgb,var(--lemon) 85%,transparent);color:#0E1B33;font-weight:700;padding:4px 12px;border-radius:999px;margin-bottom:10px}
.facts .free svg{width:16px;height:16px}
.hero-phones{--pw:258px;--pws:224px;position:relative;height:calc(var(--pw) * 1.78);margin-top:40px;--hp:0}
.hero-top h1{font-size:clamp(50px,8.2vw,120px);margin-bottom:18px}
.hero-top .lead{margin-bottom:26px}
.ph-slot{position:absolute;bottom:calc(var(--pw) * -0.3);left:50%;width:0}
.ph-slot .lay{position:absolute;bottom:0;left:0;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.ph-c{z-index:3}
.ph-l,.ph-r{z-index:2}
.phone{--w:var(--pws);position:absolute;bottom:0;width:var(--w);aspect-ratio:9 / 19;border-radius:calc(var(--w) * .16);background:#0A1120;padding:calc(var(--w) * .034);box-shadow:0 50px 90px -30px rgba(7,14,29,.55),0 0 0 1px rgba(255,255,255,.08) inset,0 0 0 2px #1d2740;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.phone::before{content:"";position:absolute;z-index:5;top:calc(var(--w) * .055);left:50%;width:28%;height:calc(var(--w) * .07);border-radius:999px;background:#05080F;transform:translateX(-50%)}
.ph-c .phone{--w:var(--pw);left:calc(var(--w) * -.5);transform:translateY(calc(var(--hp) * -26px))}
.ph-l .phone{right:calc(var(--pw) * .34);transform:translateY(calc(26px - var(--hp) * 10px)) translateX(calc(var(--hp) * -36px)) rotate(calc(-9deg - var(--hp) * 4deg));transform-origin:100% 100%}
.ph-r .phone{left:calc(var(--pw) * .34);transform:translateY(calc(26px - var(--hp) * 10px)) translateX(calc(var(--hp) * 36px)) rotate(calc(9deg + var(--hp) * 4deg));transform-origin:0 100%}
.phone:hover{transition-duration:.5s}
.ph-l .phone:hover{transform:translateY(0) rotate(-6deg)}
.ph-r .phone:hover{transform:translateY(0) rotate(6deg)}
.ph-screen{position:relative;height:100%;border-radius:calc(var(--w) * .13);overflow:hidden;container-type:inline-size;background:#fff}
.ph-tag{position:absolute;z-index:6;white-space:nowrap;display:inline-flex;align-items:center;gap:8px;background:var(--surface);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:999px;padding:7px 14px 7px 8px;font-size:13px;font-weight:600;text-decoration:none;animation:bob 6s ease-in-out infinite}
.ph-tag i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:800;color:#fff}
.ph-tag small{color:var(--muted);font-weight:500}
.ph-l .ph-tag{right:calc(var(--pw) * 1.12);bottom:calc(var(--pw) * 1.5)}
.ph-r .ph-tag{left:calc(var(--pw) * 1.3);bottom:calc(var(--pw) * 1.38);animation-delay:-2s}
.ph-c .ph-tag{left:calc(var(--pw) * .3);bottom:calc(var(--pw) * 1.9);animation-delay:-4s}
.ph-perk{position:absolute;z-index:7;display:flex;align-items:center;gap:10px;background:var(--lemon);color:#0E1B33;border-radius:16px;padding:10px 14px;font-size:14px;font-weight:700;box-shadow:0 20px 40px -18px rgba(14,27,51,.5);animation:bob 5s ease-in-out infinite}
.ph-perk small{display:block;font-weight:500;font-size:12px;opacity:.75}
.ph-perk svg{width:22px;height:22px;flex:none}
.ph-perk.p1{left:calc(50% - var(--pw) * 2.2);bottom:calc(var(--pw) * .62)}
.ph-perk.p2{left:calc(50% + var(--pw) * 1.38);bottom:calc(var(--pw) * .5);background:var(--surface);color:var(--ink);border:1px solid var(--line);animation-delay:-2.5s}
.ph-perk.p2 svg{color:var(--accent)}
@media (max-width:1100px){.ph-perk{display:none}}
@media (max-width:760px){
  .hero-phones{--pw:178px;--pws:150px;margin-top:34px}
  .ph-l .phone{right:calc(var(--pw) * .22)}
  .ph-r .phone{left:calc(var(--pw) * .22)}
  .ph-tag{font-size:11.5px;padding:5px 10px 5px 6px}
  .ph-tag i{width:18px;height:18px;font-size:9px}
  .ph-tag small{display:none}
  .ph-tag{display:none}
  .ph-c .ph-tag{display:none}
}
@media (max-width:400px){.hero-phones{--pw:160px;--pws:136px}}

/* obsah telefonů — mobilní verze webů klientů */
.ps{position:absolute;inset:0;font-family:var(--body);font-size:4.4cqw;line-height:1.35;display:flex;flex-direction:column;overflow:hidden}
.ps-nav{display:flex;align-items:center;justify-content:space-between;padding:15cqw 6cqw 4cqw;position:relative;z-index:2}
.ps-burger{width:9cqw;height:9cqw;border-radius:50%;position:relative;display:block;background:currentColor}
.ps-burger::before,.ps-burger::after{content:"";position:absolute;left:28%;right:28%;height:.9cqw;background:var(--bb,#fff);top:38%;border-radius:2px}
.ps-burger::after{top:56%}
.ps-btn{display:inline-block;font-style:normal;font-weight:700;border-radius:2.4cqw;padding:3.4cqw 5cqw;font-size:3.9cqw;white-space:nowrap}
/* Ševčík */
.ps-ms{background:#EFEEEB;color:#0B2157}
.ps-ms .ps-alert{position:absolute;top:0;left:0;right:0;z-index:3;background:#D7202E;color:#fff;font-size:2.9cqw;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:13.6cqw 6cqw 2.2cqw;display:flex;justify-content:space-between}
.ps-ms .ps-nav{padding-top:24cqw;--bb:#EFEEEB}
.ps-ms .ps-nav b{font-family:var(--display);font-weight:800;letter-spacing:.1em;font-size:5.4cqw}
.ps-ms-copy{padding:2cqw 6cqw 0;position:relative;z-index:2}
.ps-ms .k{display:block;font-size:3.2cqw;letter-spacing:.22em;text-transform:uppercase;color:#7A8299;margin-bottom:2cqw}
.ps-ms .badge-v{display:inline-block;background:#E1101F;color:#fff;font-weight:800;font-size:3.1cqw;letter-spacing:.1em;text-transform:uppercase;padding:1.4cqw 3cqw;border-radius:1.6cqw}
.ps-ms h4{font-family:"Barlow Condensed","Arial Narrow",var(--display),sans-serif;font-weight:800;font-stretch:75%;text-transform:uppercase;font-size:15.5cqw;line-height:.88;margin:3cqw 0 2cqw;letter-spacing:-.01em}
.ps-ms h4 i{font-style:normal;color:#E1101F}
.ps-ms p{color:#5A6379;font-size:3.9cqw;margin-bottom:4cqw}
.ps-ms .ps-btn{background:#E1101F;color:#fff;text-transform:uppercase;letter-spacing:.06em}
.ps-ms .cd{display:flex;gap:1.6cqw;margin-top:5cqw;width:60cqw;position:relative;z-index:3}
.ps-ms .cd i{font-style:normal;flex:1;background:#0B2157;color:#fff;border-radius:2cqw;text-align:center;padding:1.6cqw 0;font-size:2.3cqw;letter-spacing:.1em;text-transform:uppercase}
.ps-ms .cd i:nth-child(odd){background:#E1101F}
.ps-ms .cd b{display:block;font-family:var(--display);font-size:5.6cqw;line-height:1;font-variant-numeric:tabular-nums}
.ps-ms-photo{position:absolute;right:-8cqw;top:84cqw;width:66cqw;height:120cqw;background:var(--marcel) center top / cover no-repeat #E4E2DD;border-radius:5cqw 5cqw 0 0;z-index:1;-webkit-mask-image:linear-gradient(90deg,transparent,#000 22%);mask-image:linear-gradient(90deg,transparent,#000 22%)}
.ps-ms .vote{position:absolute;z-index:3;left:6cqw;bottom:6cqw;width:20cqw;height:20cqw;border-radius:50%;background:#D7202E;color:#fff;display:grid;place-content:center;text-align:center;line-height:1;box-shadow:0 2cqw 5cqw rgba(18,42,99,.3)}
.ps-ms .vote small{font-size:2.4cqw;letter-spacing:.14em;text-transform:uppercase;font-weight:800}
.ps-ms .vote b{font-family:var(--display);font-size:9cqw;font-weight:800}
/* KAPE */
.ps-kp{background:#07101E;color:#fff}
.ps-kp .bg{position:absolute;inset:0;background:linear-gradient(180deg,#07101E 0%,rgba(5,12,24,.9) 48%,rgba(5,12,24,.25) 70%,rgba(5,12,24,.1) 100%),repeating-linear-gradient(99deg,rgba(158,200,255,.22) 0 2.4cqw,rgba(9,22,44,.62) 2.4cqw 6cqw),repeating-linear-gradient(6deg,rgba(198,228,255,.1) 0 3cqw,transparent 3cqw 7cqw),linear-gradient(196deg,#3A6FB8 0%,#16305A 46%,#0A1730 100%)}
.ps-kp .ps-nav{--bb:#07101E;color:#EAF5FF}
.kpl{display:inline-flex;align-items:center;gap:2cqw;font-family:var(--display);font-weight:800;letter-spacing:.08em;color:#4FA8F0;font-size:5cqw}
.kpl i{width:7cqw;height:7cqw;border-radius:1.6cqw;background:#2F8BE0;position:relative}
.kpl i::after{content:"";position:absolute;left:50%;top:22%;width:38%;height:56%;background:#EAF5FF;transform:translateX(-50%) rotate(45deg);border-radius:60% 0 60% 60%}
.ps-kp-copy{position:relative;z-index:2;padding:8cqw 6cqw 0}
.ps-kp h4{font-family:var(--display);font-weight:800;font-size:9.2cqw;line-height:1.02;letter-spacing:-.02em;margin-bottom:3cqw}
.ps-kp p{color:#BACBE8;font-size:3.9cqw;margin-bottom:5cqw}
.ps-kp p b{color:#fff}
.ps-kp .ps-btn{background:var(--kp);color:#fff;box-shadow:0 3cqw 8cqw -2cqw rgba(63,107,245,.7)}
.ps-kp .rate{position:absolute;z-index:3;right:5cqw;top:132cqw;background:rgba(11,22,42,.82);border:1px solid rgba(140,175,235,.3);border-radius:2.6cqw;padding:2.4cqw 3.4cqw;font-size:2.9cqw;color:#A8BEE0;line-height:1.2}
.ps-kp .rate b{display:block;color:#fff;font-size:5cqw}
.ps-kp .drops i{position:absolute;z-index:1;top:-6cqw;width:1.6cqw;height:5cqw;border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;background:linear-gradient(#BFE3FF,#4FA8F0);opacity:.75;animation:kpdrop 3.2s linear infinite}
.ps-kp .drops i:nth-child(1){left:18%;animation-delay:-.4s}
.ps-kp .drops i:nth-child(2){left:44%;animation-delay:-1.7s;animation-duration:2.6s}
.ps-kp .drops i:nth-child(3){left:71%;animation-delay:-2.4s}
.ps-kp .drops i:nth-child(4){left:86%;animation-delay:-.9s;animation-duration:3.8s}
@keyframes kpdrop{0%{transform:translateY(0)}100%{transform:translateY(240cqw)}}
/* KATO */
.ps-kt{background:var(--kt-petrol);color:#F3F5EE}
.ps-kt .ps-nav{--bb:var(--kt-petrol)}
.ps-kt .ps-nav b{font-family:"Archivo",var(--display);font-weight:900;font-stretch:125%;font-size:6.4cqw;letter-spacing:-.02em}
.ps-kt .call{background:var(--kt-yellow);color:var(--kt-petrol);font-weight:800;font-size:3.3cqw;padding:2cqw 3.4cqw;border-radius:999px}
.ps-kt .big{font-family:"Archivo",var(--display);font-weight:900;font-stretch:125%;font-size:31cqw;line-height:.8;letter-spacing:-.04em;color:#F5F4EF;padding:6cqw 4cqw 0;position:relative;z-index:2}
.ps-kt .big span{color:var(--kt-yellow)}
.ps-kt-copy{padding:7cqw 6cqw 0;position:relative;z-index:2}
.ps-kt h4{font-family:"Archivo",var(--display);font-weight:800;font-stretch:115%;font-size:7.4cqw;line-height:1.02;letter-spacing:-.01em;border-top:1.6cqw solid var(--kt-yellow);padding-top:3.4cqw;margin-bottom:3cqw}
.ps-kt p{color:#A9C0BC;font-size:3.7cqw;margin-bottom:5cqw}
.ps-kt .ps-btn{background:var(--kt-yellow);color:var(--kt-petrol);border-radius:999px}
.ps-kt .bub i{position:absolute;z-index:1;bottom:-20cqw;border-radius:50%;border:.5cqw solid rgba(255,255,255,.45);background:radial-gradient(circle at 32% 30%,rgba(255,255,255,.7) 0 8%,transparent 9%),radial-gradient(circle,transparent 55%,rgba(242,194,48,.25));animation:ktbub 7s linear infinite}
.ps-kt .bub i:nth-child(1){left:8%;width:14cqw;height:14cqw}
.ps-kt .bub i:nth-child(2){left:62%;width:9cqw;height:9cqw;animation-delay:-2.5s;animation-duration:6s}
.ps-kt .bub i:nth-child(3){left:78%;width:18cqw;height:18cqw;animation-delay:-4.6s;animation-duration:9s}
.ps-kt .bub i:nth-child(4){left:36%;width:7cqw;height:7cqw;animation-delay:-1s;animation-duration:5.5s}
@keyframes ktbub{0%{transform:translateY(0) translateX(0)}50%{transform:translateY(-110cqw) translateX(4cqw)}100%{transform:translateY(-230cqw) translateX(-2cqw)}}

/* ---------- 3) před/po + měřitelné výsledky ---------- */
.ba{padding:110px 0 70px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:30px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px 14px 12px}
.stat b{display:block;font-family:var(--display);font-weight:780;font-stretch:80%;font-size:30px;line-height:1;letter-spacing:-.02em}
.stat span{display:block;font-size:13px;color:var(--muted);margin-top:6px;line-height:1.3}
.todo{position:relative;outline:2px dashed #E0A800;outline-offset:3px;border-radius:12px}
.todo-n{display:inline-block;font-family:var(--body);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background:#FFE45C;color:#0E1B33;border-radius:6px;padding:2px 6px;margin-top:8px}
.stats-note{font-size:13px;color:var(--muted);margin-top:12px}
@media (max-width:420px){.stats{grid-template-columns:1fr 1fr 1fr;gap:8px}.stat{padding:10px}.stat b{font-size:24px}}

/* ---------- 4) mezery kolem věty ---------- */
.statement{padding:90px 0 30px}
@media (max-width:760px){.statement{padding:64px 0 10px}}
.statement .sig{margin-top:26px}
.show-sticky{padding:80px 0 60px}

/* ---------- 5) karty ukázek: žádný šedý posuvník ---------- */
.track{scrollbar-width:none;scroll-padding-inline:20px}
.hscroll .show-sticky .sec-head p{font-size:16px}
.hscroll .show-sticky{padding:84px 0 20px}
.hscroll .demo{width:min(460px,34vw,44vh)}
.track::-webkit-scrollbar{display:none}
.show-nav{display:none;align-items:center;gap:14px;margin-top:6px;padding:0 20px 20px}
.show-nav button{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:border-color .2s,transform .3s cubic-bezier(.3,1.6,.4,1)}
.show-nav button:hover{border-color:var(--ink)}
.show-nav button:active{transform:scale(.92)}
.show-nav button svg{width:18px;height:18px}
.show-dots{display:flex;gap:7px;flex:1}
.show-dots i{width:8px;height:8px;border-radius:999px;background:var(--line);transition:width .4s cubic-bezier(.2,.8,.2,1),background .3s}
.show-dots i.on{width:26px;background:var(--accent)}
html:not(.hscroll) .show-nav{display:flex}
@media (min-width:861px){html:not(.hscroll) .show-nav{padding-left:max(20px,calc((100vw - 1180px)/2))}}
/* KATO karta */
.kt-hero{position:relative;flex:1;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:3cqw;padding:2cqw 4.5cqw 4cqw;overflow:hidden}
.kt-word{font-family:"Archivo",var(--display);font-weight:900;font-stretch:125%;font-size:17cqw;line-height:.8;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:.35cqw #F5F4EF;background:linear-gradient(var(--kt-yellow),var(--kt-yellow)) no-repeat 0 100% / 100% 46%;-webkit-background-clip:text;background-clip:text}
.kt-copy h4{font-family:"Archivo",var(--display);font-weight:800;font-stretch:115%;font-size:3.9cqw;line-height:1.05;border-top:.8cqw solid var(--kt-yellow);padding-top:1.6cqw;margin-bottom:2cqw}
.kt-copy p{font-size:1.9cqw;color:#A9C0BC;margin-bottom:2.4cqw;max-width:none}
.kt-copy em{display:inline-block;font-style:normal;background:var(--kt-yellow);color:var(--kt-petrol);font-weight:800;font-size:1.9cqw;padding:1.3cqw 2.4cqw;border-radius:999px}
.demo .label-client{border-color:var(--accent);color:var(--accent);font-weight:700}

/* ---------- 6) zařízení: web KATO ---------- */
.dev-screen{background:#F5F4EF}
.kd{font-family:var(--body);color:var(--kt-petrol);background:#F5F4EF;font-size:15px}
.kd-nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px clamp(16px,5cqi,44px);background:var(--kt-petrol);color:#F3F5EE}
.kd-nav b{font-family:"Archivo",var(--display);font-weight:900;font-stretch:125%;font-size:24px;letter-spacing:-.03em}
.kd-nav b small{font-weight:500;font-stretch:100%;font-size:13px;letter-spacing:0;margin-left:8px;opacity:.8}
.kd-links{display:flex;gap:22px;font-weight:600;font-size:14px}
.kd-call{background:var(--kt-yellow);color:var(--kt-petrol);font-weight:800;font-size:14px;padding:9px 16px;border-radius:999px;white-space:nowrap}
.kd-hero{background:var(--kt-petrol);color:#F3F5EE;padding:10px clamp(16px,5cqi,44px) 40px;position:relative;overflow:hidden}
.kd-word{font-family:"Archivo",var(--display);font-weight:900;font-stretch:125%;font-size:clamp(80px,27cqi,280px);line-height:.8;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:2px #F5F4EF;background:linear-gradient(var(--kt-yellow),var(--kt-yellow)) no-repeat 0 100% / 100% 40%;-webkit-background-clip:text;background-clip:text}
.kd-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,4cqi,48px);margin-top:26px}
.kd-grid h3{font-family:"Archivo",var(--display);font-weight:800;font-stretch:115%;font-size:clamp(24px,3.6cqi,40px);line-height:1;border-top:5px solid var(--kt-yellow);padding-top:14px}
.kd-grid p{color:#A9C0BC;margin-bottom:16px}
.kd-btn{display:inline-block;background:var(--kt-yellow);color:var(--kt-petrol);font-weight:800;padding:12px 20px;border-radius:999px}
.kd-sec{padding:34px clamp(16px,5cqi,44px)}
.kd-sec h4{font-family:"Archivo",var(--display);font-weight:800;font-stretch:120%;font-size:clamp(26px,4.4cqi,44px);line-height:1;margin-bottom:18px}
.kd-svc{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.kd-svc div{border:1.5px solid rgba(15,48,54,.16);border-radius:10px;padding:16px;font-weight:700;line-height:1.2}
.kd-svc small{display:block;font-weight:500;color:#4A5F5C;margin-top:6px;font-size:13px}
.kd-svc div:nth-child(2){background:var(--kt-petrol);color:#F3F5EE;border-color:var(--kt-yellow)}
.kd-svc div:nth-child(2) small{color:#A9C0BC}
.kd-rows div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid rgba(15,48,54,.16)}
.kd-rows b{background:linear-gradient(rgba(242,194,48,.55),rgba(242,194,48,.55)) no-repeat 0 90% / 100% 38%;padding:0 4px;white-space:nowrap}
.kd-tel{font-family:"Archivo",var(--display);font-weight:900;font-stretch:125%;font-size:clamp(34px,7cqi,70px);letter-spacing:-.02em;line-height:1}
@container (max-width:640px){.kd-svc{grid-template-columns:1fr 1fr}}
@container (max-width:420px){.kd-links{display:none}.kd-nav b small{display:none}.kd-grid{grid-template-columns:1fr}.kd-svc{grid-template-columns:1fr}}

/* ---------- 7) postup se 4 kroky a časy ---------- */
.step-time{display:inline-block;font-family:var(--display);font-weight:780;font-stretch:80%;font-size:clamp(34px,4vw,52px);line-height:1;letter-spacing:-.02em;color:var(--muted);transition:color .4s}
.step.on .step-time{color:var(--accent)}
.step h3{margin-top:4px}
.step .free-tag{display:inline-block;vertical-align:middle;margin-left:10px;background:var(--lemon);color:#0E1B33;font-family:var(--body);font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;letter-spacing:.02em}
.step{padding-bottom:70px}

/* ---------- 8) ceník bez blikajících čísel ---------- */
.plans .price{opacity:0;transform:translateY(14px);transition:opacity .7s cubic-bezier(.2,.8,.2,1) var(--pd,0s),transform .7s cubic-bezier(.2,.8,.2,1) var(--pd,0s)}
.plans .plan.in-view .price,.plans.in-view .price,html:not(.js) .plans .price{opacity:1;transform:none}
.free-line{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 26px;padding:14px 18px;border-radius:16px;background:color-mix(in srgb,var(--lemon) 22%,var(--surface));border:1px solid color-mix(in srgb,var(--lemon) 60%,var(--line))}
.free-line svg{width:22px;height:22px;color:#B58A00;flex:none}
.free-line b{font-weight:700}
.is-dark .free-line svg{color:var(--lemon)}

/* ---------- 9) tým: lidi s tváří ---------- */
.team-sec .head-row{margin-bottom:44px}
.founders{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.founder{--gx:50%;--gy:50%;position:relative;display:grid;grid-template-columns:112px 1fr;gap:22px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:26px;overflow:hidden;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.founder::before{content:"";position:absolute;inset:0;background:radial-gradient(320px circle at var(--gx) var(--gy),color-mix(in srgb,var(--accent) 16%,transparent),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.founder:hover::before{opacity:1}
.founder.dark{background:#0E1B33;color:#fff;border-color:transparent}
.founder.dark .f-role,.founder.dark li{color:#AEB8CE}
.founder.dark li{border-color:rgba(255,255,255,.12)}
.founder .por{border-radius:50%;overflow:hidden;box-shadow:7px 8px 0 var(--ink)}
.founder.dark .por{box-shadow:7px 8px 0 #2448F0}
.founder .por svg{display:block;width:100%;height:auto}
.f-name{font-family:var(--display);font-weight:760;font-stretch:84%;font-size:34px;line-height:1;letter-spacing:-.02em}
.f-role{color:var(--muted);font-size:15px;margin:4px 0 14px}
.founder ul{list-style:none;font-size:15px}
.founder li{padding:8px 0;border-top:1px solid var(--line)}
.f-tel{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-family:var(--display);font-weight:700;font-size:19px;text-decoration:none;padding:4px 8px}
.f-tel svg{width:18px;height:18px}
.promises{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:34px;border-top:1px solid var(--line)}
.promises div{padding:22px 22px 0 0}
.promises strong{display:block;font-family:var(--display);font-size:20px;font-weight:720;letter-spacing:-.01em;line-height:1.15;margin-bottom:8px}
.promises span{color:var(--muted);font-size:15px;display:block}
@media (max-width:960px){.founders{grid-template-columns:1fr}.promises{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.founder{grid-template-columns:76px 1fr;gap:16px;padding:20px}.f-name{font-size:28px}.promises{grid-template-columns:1fr}}

/* ---------- 10) FAQ ---------- */
.faq{padding:110px 0}
.qa .ans p .todo-n{margin:0 0 0 6px;vertical-align:middle}

/* ---------- 11) závěrečná výzva ---------- */
.final-box .cta-row{justify-content:center;margin:0}
.final-box .btn-tel{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.5)}
.final-box .btn-tel:hover{border-color:#fff}
.final-box .mail{display:block;margin-top:22px;font-size:15px;opacity:.85;color:#fff}

/* ---------- 12) přilepená lišta ---------- */
.sticky-cta{position:fixed;z-index:95;left:auto;right:22px;bottom:18px;display:flex;gap:8px;padding:8px;border-radius:999px;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);box-shadow:0 24px 50px -18px rgba(7,14,29,.45);transform:translateY(160%);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.sticky-cta.show{transform:none}
.sticky-cta .btn{padding:12px 20px;font-size:15px}
.sticky-cta .btn svg{width:17px;height:17px}
@media (max-width:560px){.sticky-cta{left:12px;right:12px;bottom:12px}.sticky-cta.show{transform:none}.sticky-cta .btn{flex:1}.sticky-cta .btn-ghost{flex:0 0 auto}}

/* ---------- patička ---------- */
.foot-lang{display:flex;gap:10px;margin-top:10px;font-size:14px}
.foot-lang a{border:1px solid var(--line);border-radius:999px;padding:3px 10px;text-decoration:none}
.foot-lang a[aria-current]{border-color:var(--ink);color:var(--ink)}

/* ---------- DEMO: přepínač „ukázat změny" ---------- */
.demo-pill{position:fixed;z-index:96;left:16px;bottom:18px;display:flex;align-items:center;gap:10px;background:#0E1B33;color:#fff;border-radius:999px;padding:7px 8px 7px 14px;font-size:13px;font-weight:600;box-shadow:0 14px 30px -12px rgba(0,0,0,.5)}
.demo-pill button{border:0;border-radius:999px;background:#FFE45C;color:#0E1B33;font:700 12px var(--body);padding:6px 11px;cursor:pointer}
.show-changes [data-change]{position:relative;outline:2px dashed #FFB800;outline-offset:-6px}
.show-changes [data-change]::before{content:attr(data-change);position:absolute;z-index:60;top:12px;left:12px;max-width:min(520px,80vw);background:#FFE45C;color:#0E1B33;font:600 12.5px/1.35 var(--body);padding:7px 11px;border-radius:10px;box-shadow:0 10px 24px -10px rgba(0,0,0,.45);pointer-events:none;white-space:normal}
@media (max-width:860px){.demo-pill{bottom:84px;left:12px;padding:4px 5px 4px 10px;font-size:11px}.demo-pill button{font-size:11px;padding:5px 9px}}
@media (max-width:560px){.demo-pill span{display:none}}
.is-dark .founder.dark{background:#17275A}

/* ===== KOLO 2: případovka, audit, recenze, formulář ===== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.case-kicker{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
/* případová studie */
.case{padding:40px 0 110px}
.case-box{background:#0B1220;color:#EAF0FF;border-radius:32px;padding:clamp(26px,5vw,64px);position:relative;overflow:hidden;isolation:isolate}
.case-box::before{content:"";position:absolute;inset:-30% -10% auto auto;width:60%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(63,107,245,.35),transparent);z-index:-1}
.case-box .case-kicker{color:#7FB4FF}
.case-head{max-width:720px}
.case-head h2{color:#fff}
.case-head p{color:#AFC0E0;font-size:18px}
.case-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,64px);margin-top:44px;align-items:start}
.case-shot .demo-frame{border-color:rgba(255,255,255,.1);background:#0E1830;transform:rotate(-1.5deg)}
.case-shot .demo-bar{border-color:rgba(255,255,255,.1);color:#8FA3C8}
.case-steps{list-style:none;display:grid;gap:26px;min-width:0}
.cs-n{display:block;font-family:var(--display);font-weight:760;font-stretch:84%;font-size:24px;letter-spacing:-.01em;color:#fff;margin-bottom:8px}
.case-steps p{color:#AFC0E0}
.case-list{list-style:none;display:grid;gap:8px}
.case-list li{display:flex;gap:10px;align-items:flex-start;color:#DCE6FA;font-size:15.5px;line-height:1.4}
.case-list svg{width:18px;height:18px;flex:none;color:#4FA8F0;margin-top:2px}
.case .stats{margin-top:4px}
.case .stat{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12);color:#fff}
.case .stat span{color:#AFC0E0}
.case .todo{outline-color:#FFB800}
@media (max-width:960px){.case-grid{grid-template-columns:1fr}.case-shot .demo-frame{transform:none}}
/* audit */
.audit{padding:110px 0;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--sky) 55%,transparent))}
.audit-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,80px);align-items:center}
.audit-grid>*{min-width:0}
.audit-lead{color:var(--muted);font-size:18px;max-width:46ch;margin-bottom:26px}
.audit-form{display:flex;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:6px;max-width:520px;box-shadow:var(--shadow)}
.audit-form input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:500 17px var(--body);padding:0 16px;outline:none}
.audit-form:focus-within{border-color:var(--accent)}
.audit-form .btn{padding:13px 22px}
.audit-err{color:#E5484D;font-size:14px;margin-top:10px}
.audit-checks{list-style:none;display:grid;gap:12px}
.audit-checks li{display:grid;grid-template-columns:1fr 110px;grid-template-rows:auto auto;column-gap:18px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px 20px}
.audit-checks b{font-family:var(--display);font-size:19px;font-weight:720;letter-spacing:-.01em}
.audit-checks span{grid-column:1;color:var(--muted);font-size:14.5px}
.ac-meter{grid-column:2;grid-row:1 / 3;height:8px;border-radius:999px;background:var(--line);overflow:hidden}
.ac-meter u{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#E5484D,#F3B806 60%,#1FB36B);transition:width 1.4s cubic-bezier(.2,.8,.2,1)}
.audit-checks.in-view .ac-meter u,html:not(.js) .ac-meter u{width:var(--v)}
@media (max-width:860px){.audit-grid{grid-template-columns:1fr}}
@media (max-width:480px){.audit-form{flex-direction:column;border-radius:20px}.audit-form input{padding:12px 14px}.audit-checks li{grid-template-columns:1fr 70px}}
/* recenze */
.reviews{padding:110px 0}
.g-badge{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:12px 16px}
.g-stars{color:#F3B806;letter-spacing:2px;font-size:18px}
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rev{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:26px;display:flex;flex-direction:column;justify-content:space-between;gap:26px}
.rev blockquote{font-family:var(--display);font-weight:600;font-size:21px;line-height:1.3;letter-spacing:-.01em;padding:6px}
.rev blockquote .todo-n{display:block;width:max-content}
.rev figcaption{display:flex;align-items:center;gap:12px}
.rev figcaption b{display:block;font-size:16px}
.rev figcaption small{color:var(--muted);font-size:13.5px}
.rev-av{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:14px;flex:none}
@media (max-width:960px){.rev-grid{grid-template-columns:1fr}}
/* formulář */
.lead-box{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);text-align:left;align-items:center}
.lead-box>*{min-width:0}
.lead-box h2{margin:0;max-width:11ch;font-size:clamp(40px,5.6vw,82px)}
.lead-box .lead-copy>p{margin:20px 0 22px;max-width:40ch}
.lead-perks{list-style:none;display:grid;gap:8px;margin-bottom:24px;font-weight:600}
.lead-perks li{display:flex;gap:10px;align-items:center}
.lead-perks svg,.lf-ok svg{width:18px;height:18px;color:#FFE45C}
.lead-alt{font-size:15px;opacity:.85}
.lead-alt a{color:#fff;font-weight:600}
.lead-form{position:relative;background:#fff;color:#0E1B33;border-radius:24px;padding:clamp(20px,3vw,32px);display:grid;gap:14px;box-shadow:0 30px 60px -24px rgba(7,14,29,.55)}
.lf-switch{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:#EEF2FF;border-radius:999px;padding:5px}
.lf-switch label{position:relative;cursor:pointer}
.lf-switch input{position:absolute;opacity:0;inset:0;cursor:pointer}
.lf-switch span{display:block;text-align:center;font-weight:600;font-size:14.5px;padding:10px 8px;border-radius:999px;color:#56617A;transition:background .3s,color .3s}
.lf-switch input:checked+span{background:#2448F0;color:#fff;box-shadow:0 8px 20px -10px rgba(36,72,240,.8)}
.lf-switch input:focus-visible+span{outline:3px solid #2448F0;outline-offset:2px}
.lf-field{display:grid;gap:6px}
.lf-field label{font-size:14px;font-weight:600;color:#3A4660}
.lf-field input{font:500 16.5px var(--body);color:#0E1B33;background:#F5F6F9;border:1.5px solid #DDE2EC;border-radius:14px;padding:13px 15px;transition:border-color .2s,background .2s;width:100%}
.lf-field input:focus{outline:none;border-color:#2448F0;background:#fff}
.lf-field.err input{border-color:#E5484D}
.lf-msg{color:#C2272D;font-size:13px;min-height:0}
.lf-submit{background:#2448F0 !important;color:#fff !important;width:100%;padding:17px 24px !important;font-size:17px !important;margin-top:4px}
.lf-submit:hover{box-shadow:0 16px 34px -12px rgba(36,72,240,.7)}
.lf-note{font-size:12.5px;color:#7A859C;margin:0 !important;opacity:1 !important;text-align:center}
.lf-done{position:absolute;inset:0;background:#fff;border-radius:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;animation:fadeup .5s cubic-bezier(.2,.8,.2,1) both}
.lf-done[hidden]{display:none}
.lf-ok{width:64px;height:64px;border-radius:50%;background:#2448F0;display:grid;place-items:center;margin-bottom:14px}
.lf-ok svg{width:30px;height:30px}
.lf-done h3{font-family:var(--display);font-size:32px;letter-spacing:-.02em}
.lf-done p{color:#56617A;margin:8px 0 0 !important;font-size:16px !important;opacity:1 !important}
.lf-done em{display:block;font-size:13px;margin-top:8px}
@media (max-width:900px){.lead-box{grid-template-columns:1fr}.lead-box h2{max-width:none}}

/* ===== KOLO 3: filmový průlet weby klientů (místo telefonů) ===== */
.hero{padding-bottom:30px}
.reel{padding:0;position:relative;height:330vh}
.reel-pin{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;gap:clamp(12px,2.4vh,26px);overflow:hidden;padding:84px 0 22px}
.reel-head,.reel-cap{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.reel-k{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.reel-count{font-family:var(--display);font-weight:700;font-size:18px;color:var(--muted);font-variant-numeric:tabular-nums}
.reel-count b{color:var(--ink)}
.reel-stage{--W:min(1040px,90vw,calc((100vh - 310px) * 1.6));position:relative;height:calc(var(--W) / 1.6 + 34px);perspective:1500px;perspective-origin:50% 20%}
.reel-deck{position:absolute;left:50%;top:0;width:var(--W);height:100%;transform-style:preserve-3d;transform:translateX(-50%) rotateX(var(--tx,0deg)) rotateY(var(--ty,0deg));transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.win{position:absolute;inset:0;display:block;text-decoration:none;color:inherit;border-radius:16px;overflow:hidden;background:#0B1220;border:1px solid rgba(255,255,255,.08);box-shadow:0 60px 120px -40px rgba(7,14,29,.6),0 0 0 1px rgba(14,27,51,.06);transform-origin:50% 100%;will-change:transform,opacity;backface-visibility:hidden}
.win::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.14),transparent 32%,transparent 70%,rgba(255,255,255,.05));opacity:var(--gl,.6)}
.win-bar{height:34px;display:flex;align-items:center;gap:6px;padding:0 14px;background:#141C2E;color:#8FA3C8;font-size:12px}
.win-bar i{width:10px;height:10px;border-radius:50%;background:#2A3550}
.win-bar i:nth-child(1){background:#FF6159}.win-bar i:nth-child(2){background:#FFBD2E}.win-bar i:nth-child(3){background:#28C941}
.win-bar span{margin-left:12px;background:#0B1220;border-radius:7px;padding:3px 12px;flex:0 1 320px}
.win-screen{position:relative;height:calc(100% - 34px);container-type:inline-size;overflow:hidden}
.reel-cap b{display:block;font-family:var(--display);font-weight:760;font-stretch:84%;font-size:clamp(26px,3vw,40px);line-height:1;letter-spacing:-.02em}
.reel-cap span{color:var(--muted);font-size:15px}
.reel-cap>div:first-child{min-width:0}
.reel-cap .swap{animation:swap .5s cubic-bezier(.2,.8,.2,1)}
@keyframes swap{0%{opacity:0;transform:translateY(12px)}100%{opacity:1;transform:none}}
.reel-prog{display:flex;gap:8px;flex:none}
.reel-prog i{width:48px;height:4px;border-radius:4px;background:var(--line);overflow:hidden;position:relative}
.reel-prog i::after{content:"";position:absolute;inset:0;background:var(--accent);transform:scaleX(var(--f,0));transform-origin:0 50%}
.reel.static{height:auto}
.reel.static .reel-pin{position:relative;height:auto}
.reel.static .reel-stage{height:auto;perspective:none}
.reel.static .reel-deck{position:relative;left:auto;transform:none;margin:0 auto;display:grid;gap:24px;height:auto}
.reel.static .win{position:relative;aspect-ratio:1.6}
@media (max-width:760px){.reel{height:280vh}.reel-pin{padding-top:76px}.reel-stage{--W:92vw;perspective:900px}.win{border-radius:10px}.win-bar{height:24px}.win-bar span{display:none}.win-screen{height:calc(100% - 24px)}.reel-stage{height:calc(var(--W) / 1.6 + 24px)}.reel-prog i{width:28px}}

/* --- společné pro makety --- */
.mkwrap{position:relative;display:block;padding:0 !important}
.mk{position:absolute;inset:0;overflow:hidden;font-family:var(--body);line-height:1.3}
.mk em{font-style:normal}
.mk-nav{position:relative;z-index:5;display:flex;align-items:center;gap:2.6cqw;padding:2.2cqw 3.6cqw;font-size:1.35cqw;font-weight:500}
.mk-nav>b{margin-right:auto}
.mk-nav>em{font-weight:700;padding:1cqw 2cqw;border-radius:999px}
.mk-ms .mz-site{position:absolute;inset:0;height:auto}

/* --- KAPE --- */
.mk-kape{background:#060D1A;color:#EAF2FF}
.kk-sky{position:absolute;inset:0;background:radial-gradient(60% 70% at 78% 30%,rgba(63,140,255,.38),transparent 70%),radial-gradient(40% 50% at 10% 100%,rgba(79,168,240,.18),transparent 70%),linear-gradient(180deg,#071226,#060D1A)}
.kk-facade{position:absolute;right:-6cqw;top:-4cqw;width:56cqw;height:78cqw;transform:perspective(60cqw) rotateY(-24deg) rotateZ(2deg);transform-origin:100% 50%;background:linear-gradient(90deg,rgba(6,13,26,.9) 0 .35cqw,transparent .35cqw) 0 0/7cqw 100%,linear-gradient(0deg,rgba(6,13,26,.9) 0 .35cqw,transparent .35cqw) 0 0/100% 9cqw,linear-gradient(200deg,#7DB6FF 0%,#2F6CC8 28%,#0F2D5C 58%,#08172F 100%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 30%);mask-image:linear-gradient(90deg,transparent,#000 30%);overflow:hidden}
.kk-facade::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(100deg,rgba(255,255,255,.07) 0 1.2cqw,transparent 1.2cqw 5cqw)}
.kk-shine{position:absolute;top:-20%;bottom:-20%;width:16cqw;left:-30cqw;background:linear-gradient(100deg,transparent,rgba(210,235,255,.55),transparent);filter:blur(.6cqw);animation:kkshine 4.8s cubic-bezier(.6,0,.3,1) infinite}
@keyframes kkshine{0%,15%{transform:translateX(0)}70%,100%{transform:translateX(110cqw)}}
.kk-wipe{position:absolute;left:0;right:0;height:1.2cqw;top:20%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.8),transparent);box-shadow:0 0 2cqw rgba(160,210,255,.8);animation:kkwipe 3.6s ease-in-out infinite}
@keyframes kkwipe{0%,100%{top:16%}50%{top:72%}}
.kk-rain i{position:absolute;top:-8cqw;width:.25cqw;height:5cqw;background:linear-gradient(transparent,rgba(170,215,255,.7));animation:kkrain 1.6s linear infinite;z-index:2}
.kk-rain i:nth-child(1){left:52%;animation-delay:-.2s}.kk-rain i:nth-child(2){left:61%;animation-delay:-.9s;animation-duration:1.3s}.kk-rain i:nth-child(3){left:70%;animation-delay:-.5s}.kk-rain i:nth-child(4){left:79%;animation-delay:-1.2s;animation-duration:1.9s}.kk-rain i:nth-child(5){left:88%;animation-delay:-.1s;animation-duration:1.4s}.kk-rain i:nth-child(6){left:94%;animation-delay:-.7s}.kk-rain i:nth-child(7){left:66%;animation-delay:-1.4s;animation-duration:2s}.kk-rain i:nth-child(8){left:84%;animation-delay:-.4s;animation-duration:1.7s}
@keyframes kkrain{to{transform:translateY(80cqw)}}
.kk-logo{display:inline-flex;align-items:center;gap:1cqw;font-family:var(--display);font-weight:800;letter-spacing:.08em;font-size:1.9cqw;color:#fff}
.kk-logo i{width:3.2cqw;height:3.2cqw;border-radius:.8cqw;background:linear-gradient(145deg,#4FA8F0,#1F6FD0);position:relative;box-shadow:0 .6cqw 1.6cqw rgba(47,139,224,.5)}
.kk-logo i::after{content:"";position:absolute;left:50%;top:22%;width:40%;height:56%;background:#EAF5FF;transform:translateX(-50%) rotate(45deg);border-radius:60% 0 60% 60%}
.kk-logo small{display:block;font-family:var(--body);font-weight:500;letter-spacing:.04em;font-size:.95cqw;color:#7FA4D8}
.mk-kape .mk-nav span{color:#A9BEDD}
.mk-kape .mk-nav em{background:#3F6BF5;color:#fff;box-shadow:0 .8cqw 2cqw -.4cqw rgba(63,107,245,.8)}
.kk-copy{position:relative;z-index:4;padding:3.6cqw 3.6cqw 0;max-width:52cqw}
.kk-eye{display:inline-flex;align-items:center;gap:.9cqw;font-size:1.25cqw;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#7FB4FF;background:rgba(63,107,245,.14);border:1px solid rgba(127,180,255,.25);border-radius:999px;padding:.6cqw 1.4cqw}
.kk-eye i{width:.8cqw;height:.8cqw;border-radius:50%;background:#4FA8F0;box-shadow:0 0 1cqw #4FA8F0}
.mk-kape h4{font-family:var(--display);font-weight:800;font-stretch:82%;font-size:5.6cqw;line-height:.96;letter-spacing:-.03em;margin:2cqw 0 1.6cqw;color:#fff}
.mk-kape h4 span{background:linear-gradient(90deg,#9FD2FF,#4FA8F0 50%,#9FD2FF);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:kkgrad 4s linear infinite}
@keyframes kkgrad{to{background-position:-200% 0}}
.mk-kape p{font-size:1.5cqw;color:#A9BEDD;max-width:36cqw;margin:0}
.kk-btns{display:flex;gap:1.2cqw;margin-top:2.2cqw}
.kk-btns em{background:#3F6BF5;color:#fff;font-weight:700;font-size:1.35cqw;padding:1.3cqw 2.2cqw;border-radius:1cqw;box-shadow:0 1cqw 2.4cqw -.6cqw rgba(63,107,245,.9)}
.kk-btns em.g{background:rgba(255,255,255,.06);box-shadow:none;border:1px solid rgba(190,215,255,.3);color:#DCE8FF}
.kk-team{display:flex;align-items:center;margin-top:2.6cqw}
.kk-team i{width:3.6cqw;height:3.6cqw;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:800;font-size:1.2cqw;background:#EAF5FF;color:#0B2A55;border:.3cqw solid #060D1A}
.kk-team i+i{margin-left:-1cqw;background:#4FA8F0;color:#fff}
.kk-team span{margin-left:1.2cqw;font-size:1.1cqw;color:#7FA4D8;line-height:1.25}
.kk-team b{display:block;color:#fff;font-size:1.3cqw}
.kk-drop{position:absolute;z-index:3;left:62%;top:22%;width:14cqw;height:24cqw}
.kk-drop b{position:absolute;left:50%;top:0;width:11cqw;height:11cqw;margin-left:-5.5cqw;border-radius:0 50% 50% 50%;transform:rotate(45deg);background:radial-gradient(circle at 30% 30%,#fff 0 6%,rgba(255,255,255,.0) 7%),radial-gradient(circle at 70% 70%,#1F6FD0,#4FA8F0 55%,#BFE3FF 100%);box-shadow:inset -1cqw -1cqw 2cqw rgba(8,40,90,.55),0 2cqw 5cqw rgba(79,168,240,.45);animation:kkfloat 3.4s ease-in-out infinite}
.kk-drop b u{position:absolute;inset:18%;border-radius:inherit;border:.3cqw solid rgba(255,255,255,.35);border-right-color:transparent;border-bottom-color:transparent}
@keyframes kkfloat{0%,100%{transform:rotate(45deg) translate(0,0)}50%{transform:rotate(45deg) translate(-1cqw,-1cqw)}}
.kk-drop .rp{position:absolute;left:50%;bottom:0;width:14cqw;height:3.4cqw;margin-left:-7cqw;border-radius:50%;border:.25cqw solid rgba(127,190,255,.6);animation:kkrip 2.4s ease-out infinite;opacity:0}
.kk-drop .r2{animation-delay:.8s}.kk-drop .r3{animation-delay:1.6s}
@keyframes kkrip{0%{transform:scale(.2);opacity:.9}100%{transform:scale(1.5);opacity:0}}
.kk-chip{position:absolute;z-index:4;display:flex;flex-direction:column;gap:.2cqw;font-size:1.05cqw;color:#9FB8DC;background:rgba(10,22,44,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(140,180,240,.28);border-radius:1.2cqw;padding:1cqw 1.4cqw;animation:bob 5s ease-in-out infinite}
.kk-chip b{color:#fff;font-size:1.7cqw;letter-spacing:-.01em}
.kk-chip.c1{left:79%;top:20%}.kk-chip.c2{left:82%;top:45%;animation-delay:-1.7s}.kk-chip.c3{left:58%;top:63%;animation-delay:-3.2s}
.kk-svc{position:absolute;z-index:4;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(140,180,240,.18);background:rgba(6,13,26,.72);backdrop-filter:blur(4px)}
.kk-svc span{padding:1.5cqw 3.6cqw;font-size:1.25cqw;font-weight:600;color:#DCE8FF;border-right:1px solid rgba(140,180,240,.14)}
.kk-svc span::before{content:"";display:inline-block;width:.8cqw;height:.8cqw;margin-right:.9cqw;border-radius:50% 0 50% 50%;transform:rotate(-45deg);background:#4FA8F0}

/* --- KATO --- */
.mk-kato{background:#0F3036;color:#F3F5EE}
.mk-kato::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 85% 10%,rgba(242,194,48,.16),transparent 70%),radial-gradient(60% 60% at 0% 100%,rgba(30,90,100,.6),transparent 70%)}
.kt-logo{font-family:"Archivo",var(--display);font-weight:900;font-stretch:125%;font-size:2.3cqw;letter-spacing:-.03em;color:#F3F5EE;display:flex;align-items:baseline;gap:1cqw}
.kt-logo small{font-family:var(--body);font-weight:500;font-size:1cqw;letter-spacing:0;color:#A9C0BC}
.mk-kato .mk-nav span{color:#C9D6D3;font-weight:600}
.mk-kato .mk-nav em{background:#F2C230;color:#0F3036;font-weight:800}
.kt-big{position:relative;z-index:2;height:19cqw;margin:-.5cqw 0 0 3cqw;font-family:"Archivo",var(--display);font-weight:900;font-stretch:125%;font-size:24cqw;line-height:.78;letter-spacing:-.045em}
.kt-big span{position:absolute;left:0;top:0;white-space:nowrap}
.kt-big .o{color:transparent;-webkit-text-stroke:.22cqw rgba(243,245,238,.85)}
.kt-big .f{color:#F2C230;clip-path:inset(var(--kf,60%) 0 0 0);animation:ktfill 5s cubic-bezier(.6,0,.3,1) infinite}
@keyframes ktfill{0%{clip-path:inset(100% 0 0 0)}45%,80%{clip-path:inset(8% 0 0 0)}100%{clip-path:inset(100% 0 0 0)}}
.kt-row{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1fr;gap:4cqw;padding:2.4cqw 3.6cqw 0;align-items:start}
.kt-row h4{font-family:"Archivo",var(--display);font-weight:800;font-stretch:115%;font-size:3cqw;line-height:1.02;letter-spacing:-.01em;border-top:.6cqw solid #F2C230;padding-top:1.4cqw;margin:0}
.kt-row p{font-size:1.4cqw;color:#A9C0BC;margin:0 0 1.8cqw}
.kt-btns{display:flex;gap:1.2cqw}
.kt-btns em{background:#F2C230;color:#0F3036;font-weight:800;font-size:1.35cqw;padding:1.3cqw 2.2cqw;border-radius:999px}
.kt-btns em.g{background:transparent;color:#F3F5EE;border:.2cqw solid rgba(243,245,238,.6)}
.kt-price{position:absolute;z-index:4;right:3.6cqw;top:9.5cqw;background:#F5F4EF;color:#0F3036;border-radius:1.2cqw;padding:1.2cqw 1.8cqw;display:flex;flex-direction:column;font-size:1.1cqw;box-shadow:0 1.6cqw 3cqw rgba(0,0,0,.3);transform:rotate(3deg);animation:bob 5s ease-in-out infinite}
.kt-price b{font-family:"Archivo",var(--display);font-weight:900;font-stretch:115%;font-size:2.2cqw;background:linear-gradient(rgba(242,194,48,.7),rgba(242,194,48,.7)) no-repeat 0 90%/100% 40%}
.kt-tapes{position:absolute;z-index:3;left:-6cqw;right:-6cqw;bottom:-1cqw;height:13cqw}
.tp{position:absolute;left:0;right:0;overflow:hidden;white-space:nowrap;font-family:"Archivo",var(--display);font-weight:800;font-stretch:110%;font-size:1.9cqw;padding:1.3cqw 0;box-shadow:0 1cqw 2.4cqw rgba(0,0,0,.25)}
.tp::before,.tp::after{content:"";position:absolute;left:0;right:0;height:.6cqw;background:repeating-linear-gradient(-45deg,#0F3036 0 1cqw,#F2C230 1cqw 2cqw)}
.tp::before{top:0}.tp::after{bottom:0}
.tp span{display:inline-block;animation:kttape 22s linear infinite}
.tp.a{top:0;transform:rotate(-4deg);background:#F2C230;color:#0F3036}
.tp.b{top:5.6cqw;transform:rotate(2.5deg);background:#F5F4EF;color:#0F3036}
.tp.b span{animation-direction:reverse;animation-duration:26s}
@keyframes kttape{to{transform:translateX(-50%)}}
.kt-bub i{position:absolute;z-index:1;bottom:-12cqw;border-radius:50%;border:.2cqw solid rgba(255,255,255,.4);background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.75) 0 7%,transparent 8%),radial-gradient(circle,transparent 58%,rgba(242,194,48,.22));animation:ktbub2 9s linear infinite}
.kt-bub i:nth-child(1){left:8%;width:6cqw;height:6cqw}.kt-bub i:nth-child(2){left:30%;width:3cqw;height:3cqw;animation-delay:-3s;animation-duration:7s}.kt-bub i:nth-child(3){left:55%;width:8cqw;height:8cqw;animation-delay:-5.5s;animation-duration:11s}.kt-bub i:nth-child(4){left:72%;width:4cqw;height:4cqw;animation-delay:-1.5s}.kt-bub i:nth-child(5){left:90%;width:5cqw;height:5cqw;animation-delay:-7s;animation-duration:10s}.kt-bub i:nth-child(6){left:44%;width:2.4cqw;height:2.4cqw;animation-delay:-4.2s;animation-duration:6s}
@keyframes ktbub2{0%{transform:translate(0,0)}50%{transform:translate(1.5cqw,-40cqw)}100%{transform:translate(-1cqw,-80cqw)}}

/* showcase/case: makety místo starých */
.demo-site.mkwrap{aspect-ratio:16 / 10.5}
.case-shot .demo-site.mkwrap{aspect-ratio:16 / 10.5}
@media (prefers-reduced-motion:reduce){.mk *{animation:none !important}}

/* ===== KOLO 4 ===== */
/* WebGL pozadí */
.hero-gl{position:absolute;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none;opacity:0;transition:opacity 1.2s ease}
.gl-on .hero-gl{opacity:1}
.gl-on .hero .aurora{display:none}
/* dva kurzory = logo */
.mp{position:absolute;inset:0;pointer-events:none;z-index:4}
.mp-cur{position:absolute;left:0;top:0;display:flex;align-items:flex-start;gap:4px;opacity:0;transition:opacity .5s;will-change:transform}
.mp-cur svg{width:30px;height:33px;filter:drop-shadow(0 6px 10px rgba(14,27,51,.3));transition:transform .15s}
.mp-cur.click svg{transform:scale(.82)}
.mp-cur span{margin-top:24px;font:700 12.5px var(--body);color:#fff;padding:4px 9px;border-radius:7px 7px 7px 2px;white-space:nowrap;box-shadow:0 6px 14px -6px rgba(14,27,51,.5)}
.mp-seb .mc-b{fill:#2448F0;stroke:#2448F0}
.mp-seb span{background:#2448F0}
.mp-fil .mc-b{fill:#F3B806;stroke:#F3B806}
.mp-fil .lm-m{stroke:#0E1B33}
.mp-fil .lm-j{stroke:#fff}
.mp-fil span{background:#E0A800;color:#0E1B33}
.mp-sel{position:absolute;left:0;top:0;width:0;height:0;border:1.5px solid #2448F0;background:rgba(36,72,240,.07);opacity:0;transition:opacity .3s}
.mp-sel i{position:absolute;width:8px;height:8px;background:#fff;border:1.5px solid #2448F0}
.mp-sel i:nth-child(1){left:-5px;top:-5px}.mp-sel i:nth-child(2){right:-5px;top:-5px}.mp-sel i:nth-child(3){left:-5px;bottom:-5px}.mp-sel i:nth-child(4){right:-5px;bottom:-5px}
.mp-sel span{position:absolute;left:-1.5px;top:-26px;background:#2448F0;color:#fff;font:600 11.5px var(--body);padding:3px 8px;border-radius:5px 5px 0 0;white-space:nowrap}
.mp-toast{position:absolute;left:0;top:0;background:#1FB36B;color:#fff;font:700 13px var(--body);padding:6px 12px;border-radius:999px;opacity:0;transform:translateY(6px) scale(.9);transition:opacity .3s,transform .4s cubic-bezier(.3,1.6,.4,1);box-shadow:0 10px 24px -10px rgba(31,179,107,.8)}
.mp-toast.show{opacity:1;transform:none}
.btn.mp-press{transform:scale(.95) !important;transition:transform .15s !important}
.btn.mp-press::before{transform:none !important}
@media (max-width:860px),(pointer:coarse){.mp{display:none}}
@media (prefers-reduced-motion:reduce){.mp,.hero-gl{display:none}}
/* kurzor: při najetí na odkaz ukáže logo */
.cursor::after{content:"";position:absolute;inset:0;margin:auto;width:22px;height:24px;opacity:0;transform:scale(.4);transition:opacity .25s,transform .35s cubic-bezier(.3,1.6,.4,1);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='4 0 60 66'%3E%3Cpath d='M9 6L57 31.5 37 37.5 48.5 56.5 39.5 61.5 28 42 9 55z' fill='%232448F0' stroke='%232448F0' stroke-width='7' stroke-linejoin='round'/%3E%3Cpath d='M14.5 42V25l6.2 7.4L27 25v17' fill='none' stroke='%23fff' stroke-width='4.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M34.5 25v9.6a5 5 0 0 1-8.2 3.8' fill='none' stroke='%23F3B806' stroke-width='4.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.cursor.big::after{opacity:1;transform:none}

/* mobil: průlet zblízka */
.mkz{position:absolute;inset:0}
.reel-right{display:flex;align-items:center;gap:22px;flex-wrap:wrap;justify-content:flex-end}
.reel-more{font-size:15px}
@media (max-width:760px){
  .reel{height:230vh}
  .reel-stage{--W:92vw;height:calc(var(--W) / 1.02 + 24px)}
  .win{bottom:auto;height:calc(var(--W) / 1.02 + 24px)}
  .mkz{inset:0 auto auto 0;width:162%;height:auto;aspect-ratio:1.6;container-type:inline-size;animation:mkpan 11s ease-in-out infinite alternate}
  .reel-more{display:none}
}
@keyframes mkpan{0%,8%{transform:translateX(0)}92%,100%{transform:translateX(-38.3%)}}
@media (prefers-reduced-motion:reduce){.mkz{animation:none}}

/* detaily: tlačítka se plní barvou */
.btn{overflow:hidden;isolation:isolate}
.btn::before{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:inherit;background:var(--fill,#0E1B33);transform:translateY(102%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.btn:hover::before,.btn:focus-visible::before{transform:none}
.btn-primary{--fill:#0E1B33}
.is-dark .btn-primary{--fill:#EEF2FA}
.is-dark .btn-primary:hover{color:#070E1D}
.btn-ghost{--fill:var(--ink);transition:color .35s,border-color .35s}
.btn-ghost:hover{color:var(--bg);border-color:var(--ink)}
.final-box .btn{--fill:#FFE45C}
.final-box .btn-tel{--fill:#fff}
.final-box .btn-tel:hover{color:#2448F0}
.lf-submit{--fill:#0E1B33}
.audit-form .btn{--fill:#0E1B33}
/* WhatsApp */
.btn-wa svg{width:18px;height:18px;color:#25D366;transition:color .3s}
.btn-wa:hover svg{color:#fff}
@media (max-width:560px){.btn-wa span{display:none}.sticky-cta .btn-ghost{padding:12px 14px}}
@media (max-width:430px){.sticky-cta .btn-ghost span{display:none}.sticky-cta .btn-ghost{padding:12px 13px}.sticky-cta .btn-primary{padding:12px 14px;font-size:14.5px;min-width:0}}
.wa-link{display:inline-flex;align-items:center;gap:8px;margin-top:14px;background:#25D366;color:#073B1E;font-weight:700;text-decoration:none;padding:10px 16px;border-radius:999px;font-size:15px}
.wa-link svg{width:18px;height:18px}

/* ===== VÍCESTRÁNKOVÉ DEMO: nové prvky podstránek ===== */
.page-hero .free-tag,.tl .free-tag{display:inline-block;vertical-align:middle;margin-left:8px;background:var(--lemon);color:#0E1B33;font-family:var(--body);font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px}
.case-link{font-weight:600;color:var(--accent);white-space:nowrap}
/* služby: dvě nabídky zdarma */
.free-two{padding-top:40px}
.ft-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ft-card{position:relative;display:flex;flex-direction:column;gap:12px;text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:26px;padding:clamp(24px,3.4vw,40px);overflow:hidden;transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.ft-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.ft-card.dark{background:#0E1B33;color:#fff;border-color:transparent}
.ft-card.dark p,.ft-card.dark .ft-list li{color:#AEB8CE}
.ft-card.dark .ref-go{color:#FFE45C}
.ft-tag{align-self:flex-start;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--lemon);color:#0E1B33;padding:4px 10px;border-radius:999px}
.ft-card h3{font-family:var(--display);font-weight:760;font-stretch:84%;font-size:clamp(30px,3.2vw,44px);line-height:1;letter-spacing:-.02em}
.ft-card p{color:var(--muted);max-width:44ch}
.ft-list{list-style:none;display:grid;gap:6px;margin-bottom:6px}
.ft-list li{display:flex;gap:9px;align-items:center;font-weight:600;font-size:15px}
.ft-list svg{width:17px;height:17px;color:#1FB36B;flex:none}
.ft-card .ref-go{margin-top:auto}
@media (max-width:820px){.ft-grid{grid-template-columns:1fr}}
/* služby: obory */
.obor-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.obor-grid a{display:flex;flex-direction:column;gap:4px;text-decoration:none;color:inherit;background:var(--bg);border:1px solid var(--line);border-radius:18px;padding:18px 20px;transition:border-color .25s,transform .35s cubic-bezier(.2,.8,.2,1),background .25s}
.obor-grid a:hover{border-color:var(--accent);transform:translateY(-3px)}
.obor-grid b{font-family:var(--display);font-weight:720;font-size:19px;letter-spacing:-.01em}
.obor-grid span{color:var(--muted);font-size:14px}
.obor-grid .obor-cta{background:var(--accent);color:var(--accent-ink);border-color:transparent}
.obor-grid .obor-cta span{color:inherit;opacity:.85}
@media (max-width:960px){.obor-grid{grid-template-columns:1fr 1fr}}
@media (max-width:420px){.obor-grid{grid-template-columns:1fr}}
/* ceník: kalkulačka */
.roi{padding:110px 0}
.roi-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,70px);align-items:center}
.roi-grid>*{min-width:0}
.roi-lead{color:var(--muted);font-size:18px;max-width:44ch;margin-bottom:26px}
.roi-f{display:grid;gap:8px;margin-bottom:20px;max-width:460px}
.roi-f label{font-weight:600;font-size:15px;display:flex;justify-content:space-between;gap:12px}
.roi-f output{font-family:var(--display);font-weight:760;color:var(--accent);font-variant-numeric:tabular-nums}
.roi-f select{font:500 16px var(--body);color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:13px 14px}
.roi-f input[type=range]{width:100%;accent-color:var(--accent);height:30px}
.roi-out{background:#0E1B33;color:#fff;border-radius:28px;padding:clamp(26px,4vw,44px);position:relative;overflow:hidden}
.roi-out::before{content:"";position:absolute;right:-20%;top:-40%;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(36,72,240,.55),transparent)}
.roi-out>*{position:relative}
.roi-out p{color:#AEB8CE}
.roi-out b{display:block;font-family:var(--display);font-weight:780;font-stretch:80%;font-size:clamp(48px,6vw,84px);line-height:1;letter-spacing:-.03em;color:#FFE45C;margin:6px 0 18px;font-variant-numeric:tabular-nums}
.roi-bar{display:flex;flex-wrap:wrap;gap:6px;min-height:22px;margin-bottom:16px;align-items:center}
.roi-bar i{width:18px;height:18px;border-radius:5px;background:#2448F0;animation:roiIn .4s cubic-bezier(.3,1.6,.4,1) both;animation-delay:calc(var(--k) * 35ms)}
.roi-bar b{font-size:16px !important;margin:0 0 0 6px !important;color:#fff !important}
@keyframes roiIn{from{opacity:0;transform:scale(.3)}}
.roi-note{min-height:3em;margin-bottom:20px}
.roi-out .btn{background:#fff;color:#2448F0;--fill:#FFE45C}
@media (max-width:860px){.roi-grid{grid-template-columns:1fr}}
/* časté dotazy: hledání */
.faq-search{display:flex;align-items:center;gap:10px;background:var(--surface);border:1.5px solid var(--line);border-radius:999px;padding:6px 8px 6px 18px;max-width:560px;margin-bottom:22px;transition:border-color .2s}
.faq-search:focus-within{border-color:var(--accent)}
.faq-search svg{width:20px;height:20px;color:var(--muted);flex:none}
.faq-search input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:500 17px var(--body);padding:10px 4px;outline:none}
.faq-empty{color:var(--muted);margin:10px 0 0}
.faq-empty a{color:var(--accent);font-weight:600}
.qa[hidden]{display:none}
/* o nás */
.about-say{margin-top:44px;max-width:900px}
.about-say h2{font-size:clamp(28px,3.4vw,46px);line-height:1.08}
/* kontakt */
.cf-switch{margin-bottom:18px;max-width:420px}
.c-wa .icon{background:#DDF7E6;color:#128C4A}
.c-wa .icon svg{width:18px;height:18px}
.is-dark .cf-switch{background:#18264A}
.is-dark .cf-switch span{color:#AEB8CE}

/* ===== HOTOVÁ VERZE: carousel, dock, drobnosti ===== */
.showcase2{padding:110px 0 40px}
.showcase2 .head-row{margin-bottom:34px}
.sc-ctrl{display:flex;gap:10px}
.sc-btn{width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:border-color .2s,background .25s,color .25s,transform .3s cubic-bezier(.3,1.6,.4,1)}
.sc-btn:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.sc-btn:active{transform:scale(.92)}
.sc-btn svg{width:20px;height:20px}
.sc-viewport{position:relative;display:grid;outline:none;isolation:isolate}
/* Přechod mezi ukázkami: prolnutí s lehkým přiblížením.
   Nový snímek se vynoří zezadu (0.965) do své velikosti, starý odchází
   dopředu (1.02) a mizí. Žádný posun do stran, směr tedy nehraje roli
   a obě třídy from-* dělají totéž. */
.sc-slide{grid-area:1/1;margin:0;opacity:0;visibility:hidden;transform:scale(1.02);transition:opacity .75s cubic-bezier(.4,0,.2,1),transform .95s cubic-bezier(.4,0,.2,1),visibility 0s .95s;display:grid;grid-template-columns:1fr;gap:20px}
.sc-slide.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .75s cubic-bezier(.4,0,.2,1),transform .95s cubic-bezier(.4,0,.2,1),visibility 0s;z-index:1}
.sc-slide.from-right,.sc-slide.from-left{animation:scFade .95s cubic-bezier(.4,0,.2,1)}
.sc-slide.out-left,.sc-slide.out-right{transform:scale(1.02)}
@keyframes scFade{from{opacity:0;transform:scale(.965)}to{opacity:1;transform:none}}
/* Rám ukázky nejde přes celou šířku obsahu. Na širokém monitoru byl
   přes 1180 px a vysoký skoro 740 px, takže zabral celou obrazovku
   a působil spíš jako pozadí než jako ukázka v okně prohlížeče.
   Pozor na margin-inline:auto - v gridu by rám smrskl na šířku obsahu,
   proto justify-self:center spolu s width:100%. */
.sc-frame{position:relative;width:100%;max-width:920px;justify-self:center;border-radius:18px;overflow:hidden;background:#0B1220;border:1px solid var(--line);box-shadow:var(--shadow)}
.sc-bar{height:36px;display:flex;align-items:center;gap:6px;padding:0 14px;background:#141C2E;color:#8FA3C8;font-size:12px}
.sc-bar i{width:10px;height:10px;border-radius:50%;background:#2A3550}
.sc-bar i:nth-child(1){background:#FF6159}.sc-bar i:nth-child(2){background:#FFBD2E}.sc-bar i:nth-child(3){background:#28C941}
.sc-bar span{margin-left:12px;background:#0B1220;border-radius:7px;padding:3px 12px;flex:0 1 320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sc-screen{position:relative;aspect-ratio:16 / 10;container-type:inline-size;overflow:hidden;pointer-events:none;isolation:isolate}
.sc-screen .mk{z-index:0}
.sc-screen .mk-nav{z-index:1}
.sc-slide figcaption{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px}
.sc-slide figcaption b{font-family:var(--display);font-weight:760;font-stretch:84%;font-size:clamp(26px,3vw,36px);line-height:1;letter-spacing:-.02em}
.sc-meta{color:var(--muted);font-size:15px}
.sc-label{flex-basis:100%;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.sc-slide .ref-go{margin:0 0 0 auto}
.sc-dots{display:flex;align-items:center;gap:8px;margin-top:22px}
.sc-dots [role=tab]{width:10px;height:10px;padding:0;border:0;border-radius:999px;background:var(--line);cursor:pointer;transition:width .4s cubic-bezier(.2,.8,.2,1),background .3s}
.sc-dots [role=tab][aria-selected=true]{width:34px;background:var(--accent)}
.sc-dots [role=tab]:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.sc-more{margin-left:auto;font-size:15px}
@media (max-width:760px){
  .showcase2 .head-row{flex-direction:column;align-items:flex-start}
  .sc-screen{aspect-ratio:1 / 1.02}
  .sc-screen .mkz{inset:0 auto auto 0;width:162%;height:auto;aspect-ratio:1.6;container-type:inline-size;animation:mkpan 11s ease-in-out infinite alternate}
  .sc-slide .ref-go{margin:0}
  .sc-dots [role=tab]{width:12px;height:12px}
  .sc-more{flex-basis:100%;margin:10px 0 0}
}
@media (min-width:761px){.sc-screen .mkz{position:absolute;inset:0}}
@media (prefers-reduced-motion:reduce){.sc-slide,.sc-slide.is-on{transition:none;animation:none !important;transform:none}}
/* případová studie: výsledky */
.case-res .stat b{color:#FFE45C}
.case-res .stat span{font-size:13.5px}
/* tým */
.f-say{font-size:15px;line-height:1.45;margin:-6px 0 12px;color:inherit;opacity:.85}
/* spodní dock: jen na užších obrazovkách, na desktopu stačí CTA v hlavičce */
@media (min-width:1100px){.sticky-cta{display:none !important}}
@media (max-width:1099px){body{padding-bottom:96px}}
@media (max-width:560px){body{padding-bottom:84px}}
/* ceny: mezera před Kč */
.price .cur-label{margin-left:.18em}

/* ===== ZOOM ANIMACE (scroll) ===== */
.zoom-in{transform:scale(var(--zs,1));transform-origin:50% 30%;border-radius:calc(18px + (1 - var(--zp,1)) * 40px);will-change:transform}
.hero .hero-top{transform:scale(var(--hz,1));opacity:var(--ho,1);transform-origin:50% 40%;will-change:transform,opacity}
/* Ukázka klientského webu se už nepřibližuje.
   Dřív tu běžel scZoom: obrazovka startovala na 112 % a sedm vteřin se
   vracela na sto procent. Dvě věci na tom nehrály. Karusel se přetáčí po
   6,5 s, takže animace nikdy nedojela. A protože se zvětšovala přímo
   obrazovka, rám jí celou tu dobu ořezával okraje - nadpis klienta byl
   vlevo useknutý. Přiblížení při přechodu dělá teď .sc-slide (0,965 -> 1),
   kde se zmenšuje celý snímek najednou, takže se nic neřeže. */
.sc-slide.is-on .sc-screen .mkz{animation:none}
@media (max-width:760px){.sc-slide.is-on .sc-screen .mkz{animation:mkpan 11s ease-in-out infinite alternate}}
@media (prefers-reduced-motion:reduce){.zoom-in,.hero .hero-top{transform:none !important;opacity:1 !important}}
.case-shot .demo-frame.zoom-in{transform:rotate(-1.5deg) scale(var(--zs,1))}
.browser.zoom-in{transform:scale(var(--zs,1)) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
@media (max-width:960px){.case-shot .demo-frame.zoom-in{transform:scale(var(--zs,1))}}

/* ===== ZOOM SKRZ LOGO (pinned scroll) ===== */
.zt{position:relative;height:280vh;padding:0}
.zt-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#060D1A}
.zt-scene{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:90px 20px 30px;background:radial-gradient(60% 60% at 50% 40%,rgba(36,72,240,.35),transparent 70%),#060D1A}
.zt-frame{width:min(1100px,92vw,calc((100vh - 230px) * 1.6));border-radius:18px;overflow:hidden;background:#0B1220;border:1px solid rgba(255,255,255,.1);box-shadow:0 60px 120px -40px rgba(0,0,0,.8);transform:scale(var(--zf,1.6));transform-origin:50% 45%;will-change:transform}
.zt-screen{position:relative;aspect-ratio:16 / 10;container-type:inline-size;overflow:hidden;pointer-events:none}
.zt-cap{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:8px 20px;color:#fff;opacity:var(--zc,0);transform:translateY(calc((1 - var(--zc,0)) * 20px))}
.zt-cap span{font-family:var(--display);font-weight:760;font-stretch:84%;font-size:clamp(24px,3vw,40px);letter-spacing:-.02em}
.zt-cap .link-arrow{color:#FFE45C;border-color:#FFE45C}
.zt-mask{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.zt-mask #ztCover{fill:var(--bg)}
.zt-intro{position:absolute;left:0;right:0;bottom:12vh;text-align:center;padding:0 20px;opacity:var(--zi,1);transform:translateY(calc((1 - var(--zi,1)) * -20px));pointer-events:none}
.zt-intro p{font-family:var(--display);font-weight:700;font-stretch:84%;font-size:clamp(22px,2.6vw,34px);letter-spacing:-.015em;color:var(--ink);max-width:24ch;margin:0 auto}
.zt.static{height:auto}
.zt.static .zt-pin{position:relative;height:auto}
.zt.static .zt-scene{position:relative;padding:80px 20px}
.zt.static .zt-mask,.zt.static .zt-intro{display:none}
.zt.static .zt-frame{transform:none}
.zt.static .zt-cap{opacity:1;transform:none}
@media (max-width:760px){.zt{height:240vh}.zt-frame{width:94vw}}

/* sticky/scroll spolehlivě i ve vloženém rámu: žádný scroll-kontejner na body */
html,body{overflow-x:clip !important}
body{overflow-y:visible !important}
.cursor{display:none !important}
/* logo-díra musí být vidět i v tmavém režimu */
.zt-scene{background:radial-gradient(42% 46% at 50% 42%,#3B63FF 0%,#1C3BC9 38%,#0B1A55 70%,#060D1A 100%)}
#ztOutline path{stroke:var(--accent)}

/* ===== kolo 4: případové studie, lokální stránka, návody, obchodní podmínky ===== */
.hero-call{margin:16px 0 18px;font-size:15px;color:var(--muted)}
.hero-call a{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--accent);margin-left:4px;white-space:nowrap}
.hero-call svg{width:15px;height:15px;color:var(--accent)}
.case-more{margin:28px 0 0;text-align:center}
.copy-links{display:flex;gap:20px;flex-wrap:wrap}
.chips span em{font-style:normal;font-weight:500;opacity:.65;margin-left:6px;white-space:nowrap}
.lf-note b{display:block;margin-bottom:4px;font-weight:600}
.x-hero .case-kicker{display:block}
.x-hero h1{max-width:20ch}

/* případová studie */
.cp-stage-sec{padding:20px 0 60px}
.cp-stage{position:relative;max-width:1060px;margin:0 auto;padding-right:clamp(40px,9vw,120px)}
.cp-stage .cp-desk{transform:none;box-shadow:0 60px 120px -50px rgba(14,27,51,.45)}
.cp-phone{position:absolute;right:0;bottom:-40px;width:clamp(120px,22vw,230px);aspect-ratio:9/19}
.cp-phone .phone{--pws:clamp(120px,22vw,230px);right:0;left:auto;transform:rotate(4deg)}
.cp-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:90px 0 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cp-facts div{padding:22px 20px 22px 0}
.cp-facts div+div{border-left:1px solid var(--line);padding-left:20px}
.cp-facts dt{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:6px}
.cp-facts dd{margin:0;font-weight:700;font-size:17px}
.cp-story{padding-top:40px}
.cp-story .wrap{display:grid;gap:0}
.cp-block{display:grid;grid-template-columns:220px 1fr;gap:40px;padding:48px 0;border-bottom:1px solid var(--line)}
.cp-tag{font-family:var(--display);font-weight:800;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);padding-top:6px}
.cp-big{font-size:clamp(20px,2.2vw,27px);line-height:1.45;margin:0;max-width:40ch;font-weight:500}
.cp-did{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px 30px}
.cp-did li{display:flex;gap:12px;align-items:flex-start;font-size:17px;font-weight:500}
.cp-did svg{flex:0 0 22px;width:22px;height:22px;padding:4px;border-radius:50%;background:var(--accent);color:#fff;margin-top:1px}
.cp-res{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cp-res-i{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:24px}
.cp-res-i b{display:block;font-family:var(--display);font-size:clamp(38px,4.4vw,58px);line-height:1;letter-spacing:-.02em;color:var(--accent);margin-bottom:10px}
.cp-res-i span{font-size:15px;color:var(--muted)}
.cp-quote{margin:60px 0 0;padding:0 0 0 30px;border-left:4px solid var(--accent)}
.cp-quote p{font-family:var(--display);font-size:clamp(22px,2.6vw,34px);line-height:1.3;font-weight:700;margin:0 0 14px;max-width:34ch}
.cp-quote footer{font-size:14px;color:var(--muted);background:none;padding:0;border:0}
.cp-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:none}
.cp-steps li{background:var(--bg);border:1px solid var(--line);border-radius:20px;padding:26px}
.cp-n{display:block;font-family:var(--display);font-weight:800;font-size:30px;color:var(--accent);margin-bottom:12px}
.cp-steps h3{font-size:19px;margin:0 0 8px}
.cp-steps p{margin:0;color:var(--muted);font-size:15px}
.cp-next{padding:80px 0 20px}
.cp-next-card{display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding:40px 44px;border-radius:28px;background:var(--ink);color:var(--bg);text-decoration:none;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.cp-next-card .case-kicker{margin:0;width:100%}
.cp-next-card b{font-family:var(--display);font-size:clamp(30px,5vw,64px);line-height:1;letter-spacing:-.02em}
.cp-next-go{margin-left:auto;width:64px;height:64px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.cp-next-go svg{width:28px;height:28px}
.cp-next-card:hover{transform:translateY(-4px)}
.cp-next-card:hover .cp-next-go{transform:translateX(8px) rotate(-8deg)}

/* lokální stránka */
.lc-towns-sec{padding:0 0 20px}
.lc-towns{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.lc-towns span{padding:10px 18px;border-radius:999px;border:1.5px solid var(--line);font-weight:700;font-size:15px;background:var(--surface)}
.lc-towns span:first-child{background:var(--accent);border-color:var(--accent);color:#fff}
.lc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.lc-ref{display:flex;flex-direction:column;text-decoration:none;color:inherit}
.lc-ref .demo-frame{transform:none;margin-bottom:18px;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.lc-ref:hover .demo-frame{transform:translateY(-6px) rotate(-.6deg)}
.lc-place{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.lc-ref h3{font-size:22px;margin:6px 0 4px}
.lc-ref p{margin:0 0 14px;color:var(--muted)}
.lc-why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.lc-why-i{background:var(--bg);border:1px solid var(--line);border-radius:22px;padding:28px}
.lc-num{display:block;font-family:var(--display);font-weight:800;font-size:15px;color:var(--accent);margin-bottom:28px}
.lc-why-i h3{font-size:19px;margin:0 0 8px}
.lc-why-i p{margin:0;color:var(--muted);font-size:15px}

/* návody */
.nv-list{padding-top:30px}
.nv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.nv-grid-main{grid-template-columns:repeat(3,1fr)}
.nv-card{display:flex;flex-direction:column;gap:10px;padding:30px;border-radius:24px;background:var(--surface);border:1px solid var(--line);text-decoration:none;color:inherit;transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .3s;min-height:260px}
.nv-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--accent)}
.nv-card h3{font-size:22px;line-height:1.2;margin:0}
.nv-card p{margin:0;color:var(--muted);font-size:15px}
.nv-card .ref-go{margin-top:auto}
.nv-meta{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted)}
.nv-meta svg{width:15px;height:15px}
.nv-feat{grid-column:1/-1;background:var(--ink);color:var(--bg);border-color:var(--ink);padding:44px;min-height:0}
.nv-feat h3{font-family:var(--display);font-size:clamp(28px,4vw,48px);max-width:20ch;letter-spacing:-.01em}
.nv-feat p{color:inherit;opacity:.75;font-size:17px;max-width:60ch}
.nv-feat .nv-meta{color:inherit;opacity:.7}
.nv-grid-main .nv-card:nth-child(n+2){grid-column:span 1}
.nv-grid-main{grid-template-columns:repeat(3,1fr)}

/* článek a obchodní podmínky */
.art-sec{padding-top:40px}
.art-wrap{display:grid;grid-template-columns:240px minmax(0,1fr);gap:64px;align-items:start}
.art-toc{position:sticky;top:100px;font-size:14px}
.art-toc b{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.art-toc ol{list-style:none;margin:0;padding:0;border-left:2px solid var(--line)}
.art-toc li a{display:block;padding:7px 0 7px 16px;margin-left:-2px;border-left:2px solid transparent;color:var(--muted);text-decoration:none;font-weight:600;transition:color .2s,border-color .2s}
.art-toc li a:hover,.art-toc li a.on{color:var(--ink);border-left-color:var(--accent)}
.art-side-cta{margin-top:28px;padding:20px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}
.art-side-cta p{margin:0 0 12px;font-weight:700}
.art{max-width:70ch;font-size:18px;line-height:1.7}
.art h2{font-size:clamp(24px,2.6vw,32px);margin:48px 0 14px;scroll-margin-top:100px;line-height:1.2}
.art h2:first-of-type{margin-top:8px}
.art-by + h2,.art-by + p + h2{margin-top:30px}
.art p{margin:0 0 16px}
.art a{color:var(--accent);font-weight:600}
.art-by{display:flex;align-items:center;gap:12px;font-size:14px;line-height:1.35;color:var(--muted);padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:28px !important}
.art-by b{color:var(--ink)}
.art-av{width:44px;height:44px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800;font-size:15px}
.art-list{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:12px}
.art-list li{display:flex;gap:12px;align-items:flex-start}
.art-list svg{flex:0 0 22px;width:22px;height:22px;padding:4px;border-radius:50%;background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent);margin-top:4px}
.art-steps{margin:0 0 20px;padding:0;list-style:none;counter-reset:s;display:grid;gap:14px}
.art-steps li{counter-increment:s;position:relative;padding:18px 20px 18px 64px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.art-steps li::before{content:counter(s);position:absolute;left:18px;top:16px;width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800;font-size:15px}
.art-cmp{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 20px}
.art-cmp div{padding:20px;border-radius:18px;border:1px solid var(--line);background:var(--surface);font-size:15px;line-height:1.55}
.art-cmp div.hl{border:2px solid var(--accent)}
.art-cmp h3{font-size:17px;margin:0 0 8px;line-height:1.25}
.art-cmp p{margin:0}
.art-table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:16px}
.art-table th{text-align:left;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:10px 12px;border-bottom:2px solid var(--line)}
.art-table td{padding:14px 12px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.45}
.art-table td:last-child{white-space:nowrap;font-weight:800;text-align:right}
.art-check{display:grid;gap:10px;margin:0 0 20px}
.art-check label{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:16px;border:1.5px solid var(--line);background:var(--surface);cursor:pointer;font-size:16px;line-height:1.5;transition:border-color .2s,background .2s}
.art-check input{appearance:none;-webkit-appearance:none;flex:0 0 24px;width:24px;height:24px;margin:0;border-radius:8px;border:2px solid var(--line);background:var(--bg);display:grid;place-items:center;transition:all .2s;cursor:pointer}
.art-check input:checked{background:var(--accent);border-color:var(--accent)}
.art-check input:checked::after{content:"";width:10px;height:6px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;transform:translateY(-2px) rotate(-45deg)}
.art-check label:has(input:checked){border-color:var(--accent)}
.art-check label:has(input:checked) span{opacity:.6}
.art-note{font-size:14px;color:var(--muted)}
.art-tip{padding:18px 22px;border-radius:16px;background:color-mix(in srgb,#FFE45C 30%,var(--bg));border:1px solid color-mix(in srgb,#F3B806 50%,transparent);font-size:16px;margin:0 0 20px}
.art-end{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:50px;padding:30px;border-radius:24px;background:var(--ink);color:var(--bg)}
.art-end div{flex:1 1 280px}
.art-end b{font-size:20px;display:block;margin-bottom:6px}
.art-end p{margin:0;opacity:.75;font-size:16px}
.op h2{font-size:22px;margin:40px 0 12px}
.op p{font-size:17px}
.op-n{color:var(--accent);font-weight:800;margin-right:4px}
.op p .op-n{font-size:14px}

@media (max-width:1000px){
  .art-wrap{grid-template-columns:1fr;gap:20px}
  .art-toc{position:static}
  .art-toc ol{display:flex;flex-wrap:wrap;gap:6px;border:0}
  .art-toc li a{border:1.5px solid var(--line);border-radius:999px;padding:6px 12px;margin:0}
  .art-side-cta{display:none}
  .cp-steps,.lc-why-grid{grid-template-columns:1fr 1fr}
  .lc-grid,.nv-grid,.nv-grid-main{grid-template-columns:1fr 1fr}
  .cp-block{grid-template-columns:1fr;gap:14px}
}
@media (max-width:700px){
  .cp-facts{grid-template-columns:1fr 1fr;margin-top:70px}
  .cp-facts div:nth-child(3){border-left:0;padding-left:0}
  .cp-facts div:nth-child(n+3){border-top:1px solid var(--line)}
  .cp-did,.cp-res,.art-cmp,.cp-steps,.lc-why-grid,.lc-grid,.nv-grid,.nv-grid-main{grid-template-columns:1fr}
  .cp-stage{padding-right:50px}
  .cp-block{padding:34px 0}
  .cp-next-card{padding:28px}
  .cp-next-go{width:52px;height:52px}
  .nv-feat{padding:30px}
  .art{font-size:17px}
  .art-table th:nth-child(2),.art-table td:nth-child(2){display:none}
  .art-end{padding:24px}
}
[data-theme="dark"] .cp-next-card,[data-theme="dark"] .nv-feat,[data-theme="dark"] .art-end{background:#13213F;color:#EEF2FF;border-color:#22345E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cp-next-card,:root:not([data-theme="light"]) .nv-feat,:root:not([data-theme="light"]) .art-end{background:#13213F;color:#EEF2FF;border-color:#22345E}}
.art a.btn,.art-end a.btn{color:#fff}

/* ===== HERO v2 ===== */
.nav-cta{white-space:nowrap}
.mm-cta{margin-top:auto;align-self:stretch;justify-content:center;font-size:18px !important;padding:16px 22px !important}
@media (min-width:961px){.mm-cta{display:none}}
.hero-top .cta-row{margin-bottom:34px !important}
.typer{display:inline-block;text-align:left;color:var(--accent);white-space:nowrap;min-height:1.3em}
.typer-c{display:inline-block;width:3px;height:.95em;margin-left:3px;vertical-align:-.1em;background:currentColor;border-radius:2px;animation:typerBlink 1s steps(1) infinite}
@keyframes typerBlink{50%{opacity:0}}
.hero-notes{display:flex;flex-direction:column;align-items:center;gap:18px}
.hero-notes p{margin:0}
.hero-call{font-size:16px;color:var(--muted)}
.hero-call a{margin-left:6px}
.hero-free .free{display:inline-flex;align-items:center;gap:8px;background:color-mix(in srgb,var(--lemon) 85%,transparent);color:#0E1B33;font-weight:700;font-size:15px;padding:6px 14px;border-radius:999px;line-height:1.35;text-align:left}
.hero-free .free svg{width:16px;height:16px;flex:none}
.hero-meta{font-size:14px;color:var(--muted);letter-spacing:.01em}
.hero-meta i{font-style:normal;opacity:.5;margin:0 6px}
/* ukázka KAPE */
.hero-show{display:block !important;margin-top:64px;perspective:1600px}
.hs-stage{--ht:0;position:relative;margin:0 auto;max-width:960px;padding:0 70px 0 0;transform-style:preserve-3d}
.hs-laptop{transform:rotateX(calc(var(--ht) * 14deg)) translateY(calc(var(--ht) * 30px));transform-origin:50% 100%;transition:transform .1s linear;will-change:transform}
.hs-lid{position:relative;background:#0B1222;border-radius:18px 18px 6px 6px;padding:2.4% 2.4% 2.8%;box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 50px 100px -40px rgba(7,14,29,.55)}
.hs-cam{position:absolute;top:1%;left:50%;width:6px;height:6px;border-radius:50%;background:#26324D;transform:translateX(-50%)}
.hs-screen,.hs-ph-screen{position:relative;overflow:hidden;background:#101A30}
.hs-screen{aspect-ratio:16/10;border-radius:6px}
.hs-base{position:relative;height:16px;margin:0 -6%;background:linear-gradient(#D9DEE8,#A9B1C2);border-radius:0 0 18px 18px;box-shadow:0 30px 40px -24px rgba(7,14,29,.5)}
.hs-base i{position:absolute;top:0;left:50%;width:14%;height:6px;transform:translateX(-50%);background:#BCC3D1;border-radius:0 0 8px 8px}
.hs-phone{position:absolute;right:0;bottom:-24px;width:22%;max-width:200px;aspect-ratio:9/19;background:#0A1120;border-radius:28px;padding:9px;box-shadow:0 0 0 2px #1d2740,0 40px 80px -30px rgba(7,14,29,.6);transform:translateY(calc(var(--ht) * 70px)) rotate(calc(3deg + var(--ht) * 3deg));will-change:transform}
.hs-ph-screen{height:100%;border-radius:21px}
.hs-screen img,.hs-ph-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.shot-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:10px;color:#9FB0D4;background:repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 12px,transparent 12px 24px),linear-gradient(160deg,#16244A,#0C1530);border:2px dashed rgba(159,176,212,.35);border-radius:inherit}
.shot-ph b{font-family:var(--display);font-size:clamp(13px,2vw,24px);letter-spacing:.12em;color:#DCE4F7}
.shot-ph span{font-size:clamp(10px,1.1vw,13px)}
.hs-phone .shot-ph b{font-size:clamp(9px,1.2vw,13px);letter-spacing:.06em}
.hs-phone .shot-ph span{display:none}
.hs-cap{margin:46px 0 0;text-align:center;font-size:14px;color:var(--muted)}
.hs-cap a{color:var(--accent);font-weight:600}
@media (max-width:760px){
  .hero-show{margin-top:44px}
  .hs-stage{max-width:420px;padding-right:44px}
  .hs-phone{width:28%;border-radius:18px;padding:5px;bottom:-16px}
  .hs-ph-screen{border-radius:14px}
  .hs-lid{border-radius:12px 12px 4px 4px}
  .hs-base{height:10px;border-radius:0 0 12px 12px}
  .hs-cap{margin-top:34px}
  .hero-free .free{font-size:14px}
  .hero-meta i{margin:0 4px}
}
/* běžící pás: poloviční výška, plné písmo */
.band{padding:13px 0 !important}
.band span{font-size:clamp(17px,2.4vw,30px) !important;padding-right:28px !important;gap:28px !important;font-stretch:90%}
.band span:nth-child(even){color:var(--ink) !important;-webkit-text-stroke:0 !important}
.band span::after{width:9px !important;height:9px !important}
.nv-grid-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){.nv-grid-4{grid-template-columns:1fr 1fr}}
@media (max-width:700px){.nv-grid-4{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.typer-c{animation:none}.hs-laptop,.hs-phone{transform:none !important}}
.mmenu a.mm-cta{font-family:var(--body);font-weight:700;font-stretch:100%;letter-spacing:0;line-height:1.2;display:flex;margin-top:32px;color:#fff;border-radius:999px}
@media (min-width:861px){.mmenu a.mm-cta{display:none}}
.hero{padding-bottom:96px !important}
.hs-stage{max-width:880px}
.hs-base{margin:0 -4%}
.hs-phone{transform:translateY(calc(var(--ht) * 40px)) rotate(calc(3deg + var(--ht) * 2deg))}
@media (max-width:1000px){.hs-stage{max-width:600px;padding-right:56px}.hs-cap{margin-top:54px}}
@media (max-width:760px){.hero{padding-bottom:64px !important}.hs-stage{max-width:380px;padding-right:40px}.hs-phone{transform:translateY(calc(var(--ht) * 18px)) rotate(3deg)}.hs-cap{margin-top:48px;padding:0 8px}}
.hs-dev{position:relative}
.hs-phone{bottom:-18px}
.hs-cap,.hs-stage .hs-cap{margin-top:48px}
@media (max-width:1000px){.hs-cap,.hs-stage .hs-cap{margin-top:36px}}
@media (max-width:760px){.hs-phone{bottom:-10px}.hs-cap,.hs-stage .hs-cap{margin-top:30px}}

/* ===== HERO v3: živé ukázky KAPE / Ševčík / KATO ===== */
.hs-lid{padding:1.6% 1.8% 2.2%}
.hs-bar{display:flex;align-items:center;gap:6px;height:clamp(18px,2.6vw,30px);padding:0 4px 0 6px;margin-bottom:1%}
.hs-bar i{width:8px;height:8px;border-radius:50%;background:#2A3550;flex:none}
.hs-bar i:nth-child(1){background:#FF6159}.hs-bar i:nth-child(2){background:#FFBD2E}.hs-bar i:nth-child(3){background:#28C840}
.hs-url{margin:0 auto;display:inline-flex;align-items:center;gap:6px;padding:3px 14px;border-radius:999px;background:#141C2E;color:#B9C6E4;font-size:clamp(9px,1.05vw,12px);min-width:34%;justify-content:center}
.hs-url svg{width:11px;height:11px;color:#28C840}
.hs-url em{font-style:normal;white-space:nowrap}
.hs-screen{container-type:inline-size;isolation:isolate}
.hs-slide,.hs-pslide{position:absolute;inset:0;container-type:inline-size;visibility:hidden;z-index:0;clip-path:inset(0 0 100% 0)}
.hs-slide.was-on,.hs-pslide.was-on{visibility:visible;clip-path:inset(0)}
.hs-slide.is-on,.hs-pslide.is-on{visibility:visible;z-index:2;clip-path:inset(0);transition:clip-path 1s cubic-bezier(.77,0,.18,1)}
.hs-slide.is-on .mk,.hs-pslide.is-on .ps{animation:hsIn 1.4s cubic-bezier(.2,.8,.2,1) both}
@keyframes hsIn{from{transform:scale(1.08)}to{transform:none}}
.hs-wipe{position:absolute;left:0;right:0;top:0;height:3px;z-index:5;opacity:0;background:linear-gradient(90deg,transparent,#7FB4FF 20%,#fff 50%,#7FB4FF 80%,transparent);box-shadow:0 0 24px 6px rgba(90,150,255,.55);pointer-events:none}
.hs-stage.swap .hs-wipe{animation:hsWipe 1s cubic-bezier(.77,0,.18,1)}
@keyframes hsWipe{0%{top:0;opacity:1}90%{opacity:1}100%{top:100%;opacity:0}}
.hs-ph-screen{container-type:inline-size;isolation:isolate}
.hs-tag{position:absolute;left:-3%;top:16%;z-index:4;display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center;padding:12px 18px 12px 14px;border-radius:16px;background:color-mix(in srgb,var(--surface) 82%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);box-shadow:0 24px 50px -24px rgba(7,14,29,.45);text-align:left;transform:translateY(calc(var(--ht) * -40px)) rotate(-2deg);transition:opacity .3s,filter .3s}
.hs-tag b{font-size:15px;line-height:1.2;color:var(--ink)}
.hs-tag small{grid-column:2;font-size:12px;color:var(--muted)}
.hs-dot{grid-row:span 2;width:12px;height:12px;border-radius:50%;background:var(--c,#4F8BFF);box-shadow:0 0 0 5px color-mix(in srgb,var(--c,#4F8BFF) 25%,transparent);animation:hsPulse 2s ease-in-out infinite}
@keyframes hsPulse{50%{box-shadow:0 0 0 9px color-mix(in srgb,var(--c,#4F8BFF) 0%,transparent)}}
.hs-tag.sw{opacity:0;filter:blur(6px)}
.hs-tabs{display:flex;justify-content:center;gap:10px;margin:64px auto 0;max-width:760px}
.hs-tab{position:relative;flex:1 1 0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:14px 18px 16px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 70%,transparent);color:var(--muted);font:inherit;text-align:left;cursor:pointer;overflow:hidden;transition:border-color .3s,color .3s,background .3s,transform .3s}
.hs-tab b{font-size:15px;color:inherit}
.hs-tab span{font-size:12.5px;opacity:.8}
.hs-tab:hover{transform:translateY(-2px)}
.hs-tab.is-on{color:var(--ink);border-color:color-mix(in srgb,var(--accent) 55%,var(--line));background:var(--surface)}
.hs-prog{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left}
.hs-tab.is-on .hs-prog{transform:scaleX(1)}
.hs-stage.run .hs-tab.is-on .hs-prog{animation:hsProg 5.5s linear both}
.hs-stage.paused .hs-tab.is-on .hs-prog{animation-play-state:paused}
@keyframes hsProg{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hs-stage .hs-cap{margin-top:22px}
@media (max-width:1000px){.hs-tabs{margin-top:46px}.hs-tag{left:-1%;top:8%}}
@media (max-width:760px){
  .hs-tag{top:-14px;left:-2px;padding:8px 12px 8px 10px;column-gap:8px;border-radius:12px}
  .hs-tag b{font-size:12.5px}.hs-tag small{font-size:10.5px}
  .hs-dot{width:9px;height:9px}
  .hs-tabs{gap:6px;margin-top:34px;flex-wrap:wrap}
  .hs-tab{padding:10px 10px 12px;border-radius:12px;flex:1 1 30%;min-width:0}
  .hs-tab b{overflow-wrap:anywhere}
  .hs-tab b{font-size:12.5px}.hs-tab span{display:none}
  .hs-bar i{width:5px;height:5px}.hs-bar{gap:3px}
  .hs-url{padding:1px 8px;font-size:8.5px}.hs-url svg{width:8px;height:8px}
}
@media (prefers-reduced-motion:reduce){.hs-slide.is-on,.hs-pslide.is-on{transition:none}.hs-slide.is-on .mk,.hs-pslide.is-on .ps,.hs-wipe,.hs-dot{animation:none !important}}

/* ===== STAVBA WEBU (místo průletu logem) ===== */
.bld{position:relative;height:330vh;padding:0;background:var(--bg)}
.bld-pin{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;overflow:hidden}
.bld-pin::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 70% 50%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%);opacity:calc(.4 + var(--br,0) * .6);pointer-events:none}
.bld-grid{position:relative;display:grid;grid-template-columns:.78fr 1.22fr;gap:60px;align-items:center}
.bld-copy h2{font-size:clamp(32px,4vw,58px);line-height:1.02;letter-spacing:-.025em;margin:0 0 30px;max-width:13ch}
.bld-steps{list-style:none;margin:0;padding:0 0 0 18px;display:grid;gap:6px;position:relative}
.bld-steps::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:2px;border-radius:2px;background:var(--line)}
.bld-steps::after{content:"";position:absolute;left:0;top:6px;width:2px;height:calc((100% - 12px) * var(--bp,0));border-radius:2px;background:var(--accent);box-shadow:0 0 12px var(--accent)}
.bld-steps li{display:flex;gap:14px;align-items:baseline;padding:8px 0;opacity:.38;transition:opacity .4s}
.bld-steps li.is-on,.bld-steps li.done{opacity:1}
.bld-steps li.done:not(.is-on){opacity:.62}
.bld-steps b{font-family:var(--display);font-size:14px;color:var(--accent);min-width:22px}
.bld-steps strong{display:block;font-family:var(--display);font-size:clamp(19px,1.8vw,24px);letter-spacing:-.01em;color:var(--ink)}
.bld-steps small{display:block;font-size:15px;color:var(--muted);max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.2,.8,.2,1),margin .5s}
.bld-steps li.is-on small{max-height:3em;margin-top:4px}
.bld-win{position:relative;border-radius:18px;overflow:hidden;background:#0B1220;border:1px solid rgba(255,255,255,.08);box-shadow:0 60px 120px -50px rgba(7,14,29,.6);transform:perspective(1400px) rotateY(calc((1 - var(--bs,1)) * -40deg)) scale(calc(.9 + var(--bs,1) * .1));transition:box-shadow .6s}
.bld.live .bld-win{box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 70%,transparent),0 60px 140px -40px color-mix(in srgb,var(--accent) 70%,transparent)}
.bld-url{margin:0 auto;display:inline-flex;align-items:center;min-width:40%;justify-content:center;padding:4px 14px;border-radius:999px;background:#0B1220;color:#DCE4F7;font-size:12.5px;height:22px}
.bld-url em{font-style:normal}
.bld-url u{display:inline-block;width:1.5px;height:12px;margin-left:2px;background:#7FB4FF;text-decoration:none;animation:typerBlink 1s steps(1) infinite}
.bld.live .bld-url u{display:none}
.bld-live{position:absolute;right:12px;top:50%;display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 8px;border-radius:999px;background:#12391F;color:#7CF29C;font-size:11.5px;font-weight:700;transform:translateY(-50%) scale(.6);opacity:0;transition:transform .5s cubic-bezier(.3,1.6,.5,1),opacity .3s}
.bld-live::before{content:"";width:7px;height:7px;border-radius:50%;background:#28C840;box-shadow:0 0 8px #28C840}
.bld.live .bld-live{transform:translateY(-50%) scale(1);opacity:1}
.bld-win .sc-bar{position:relative}
.bld-screen{position:relative;aspect-ratio:16/10;container-type:inline-size;overflow:hidden;background:var(--surface);isolation:isolate}
.bld-wire{position:absolute;inset:0;z-index:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:5% 8%;background-position:-1px -1px}
.bld-real{position:absolute;inset:0;z-index:1;container-type:inline-size;clip-path:inset(0 calc(100% - var(--br,0) * 100%) 0 0)}
.bw{position:absolute;display:block;border:1.5px dashed color-mix(in srgb,var(--ink) 38%,transparent);border-radius:.8cqw;transform:scaleX(var(--d,0));transform-origin:left center;transition:background .7s cubic-bezier(.2,.8,.2,1),border-color .7s,border-radius .7s}
.bw em{position:absolute;left:.7cqw;top:.45cqw;font-style:normal;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:max(8px,1.05cqw);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);white-space:nowrap;transition:opacity .4s}
.w-img em{left:50%;top:50%;transform:translate(-50%,-50%)}
.bld.s2 .bw{border-style:solid;border-color:transparent}
.bld.s2 .bw em{opacity:0}
.bld.s2 .w-logo,.bld.s2 .w-btn,.bld.s2 .w-c1{background:#3B63FF;border-radius:999px}
.bld.s2 .w-logo{border-radius:1cqw}
.bld.s2 .w-l1,.bld.s2 .w-l2,.bld.s2 .w-l3,.bld.s2 .w-p1,.bld.s2 .w-p2{background:color-mix(in srgb,var(--ink) 22%,transparent)}
.bld.s2 .w-kick{background:color-mix(in srgb,#3B63FF 22%,transparent);border-radius:999px}
.bld.s2 .w-h1,.bld.s2 .w-h2,.bld.s2 .w-h3{background:var(--ink)}
.bld.s2 .w-h3{background:#3B63FF}
.bld.s2 .w-c2{border:1.5px solid color-mix(in srgb,var(--ink) 40%,transparent);border-radius:999px}
.bld.s2 .w-img{background:radial-gradient(circle at 50% 40%,#9CC7FF 0 6%,transparent 6.5%),linear-gradient(160deg,#3A6FB8,#16305A 55%,#0A1730);border-radius:1.4cqw}
.bld.s2 .w-strip{background:#0B1A33;border-radius:0}
.bld-scan{position:absolute;top:0;bottom:0;z-index:3;left:calc(var(--br,0) * 100%);width:2px;margin-left:-1px;background:linear-gradient(transparent,#BFD8FF 20%,#fff 50%,#BFD8FF 80%,transparent);box-shadow:0 0 30px 8px rgba(90,150,255,.55);opacity:var(--so,0);pointer-events:none}
.bld-note{margin:16px 0 0;font-size:14px;color:var(--muted);text-align:right}
.bld-note a{color:var(--accent);font-weight:600}
@media (max-width:900px){
  .bld{height:300vh}
  .bld-grid{grid-template-columns:1fr;gap:22px}
  .bld-copy h2{font-size:clamp(28px,7.4vw,40px);margin-bottom:16px;max-width:none}
  .bld-steps{grid-template-columns:repeat(4,1fr);gap:6px;padding:0}
  .bld-steps::before,.bld-steps::after{display:none}
  .bld-steps li{flex-direction:column;gap:2px;padding:8px 0 0;border-top:3px solid var(--line)}
  .bld-steps li.is-on,.bld-steps li.done{border-top-color:var(--accent)}
  .bld-steps strong{font-size:14px}
  .bld-steps small{display:none}
  .bld-url{font-size:10px;padding:2px 8px;height:18px}
  .bld-live{font-size:9.5px;right:8px}
  .bld-note{text-align:left}
}
.bld.static{height:auto}
.bld.static .bld-pin{position:relative;height:auto;padding:100px 0}
.hs-tag{left:-8%;top:auto;bottom:20%}
@media (max-width:1000px){.hs-tag{left:-4%;bottom:14%}}
@media (max-width:760px){.hs-tag{display:none}}

/* ------------------------------------------------------------------
   MAKETA KLIENTSKÉHO WEBU UVNITŘ DISPLEJE
   V sekci „Vypadá skvěle na každém displeji" běží skutečná maketa webu
   Marcela Ševčíka (.mk-ms) místo zjednodušené ukázky. Maketa je celá
   v cqw, takže se sama zmenšuje s šířkou rámu - jenže na mobilu by tím
   klesla i velikost písma na nečitelných pár pixelů a layout by zůstal
   natvrdo dvousloupcový. Proto má úzký rám vlastní rozvržení.
------------------------------------------------------------------ */
.dev-mk{position:relative;height:100%}
.dev-mk .mk{position:absolute;inset:0}
.dev-mk .mz-site{position:absolute;inset:0;height:100%}

/* tablet na výšku */
/* Tablet: pořád dva sloupce jako na počítači, jen větší poměrné písmo -
   při jednom sloupci zbyl na fotku proužek a celé to působilo zmáčkle. */
@container (max-width:620px){
  .dev-mk .mz-alert{font-size:2.1cqw;padding:1.6cqw 3.2cqw}
  .dev-mk .mz-nav{padding:3cqw 3.2cqw}
  .dev-mk .mz-brand i{width:6cqw;height:6cqw;font-size:2.7cqw;border-radius:1.3cqw}
  .dev-mk .mz-brand b{font-size:3.4cqw}
  .dev-mk .mz-brand em{font-size:1.9cqw}
  .dev-mk .mz-links span{display:none}
  .dev-mk .mz-links .mz-cta{display:inline-block;font-size:2.2cqw;padding:1.7cqw 2.8cqw;border-radius:1cqw}
  .dev-mk .mz-hero{gap:2cqw;padding:3cqw 3.2cqw 0;overflow:hidden}
  .dev-mk .mz-pill{font-size:2.1cqw;padding:.9cqw 2.2cqw .9cqw .9cqw}
  .dev-mk .mz-pill b{font-size:1.9cqw;padding:.7cqw 1.6cqw}
  .dev-mk .mz-name{font-size:10cqw;margin-top:2.4cqw}
  .dev-mk .mz-lead{font-size:2.7cqw!important;max-width:none;margin:2cqw 0 2.8cqw!important}
  .dev-mk .mz-btns{flex-wrap:wrap;gap:1.8cqw}
  .dev-mk .mz-btn{font-size:2.2cqw;padding:2.1cqw 3cqw;border-radius:1.2cqw}
  .dev-mk .mz-badge{width:13cqw;height:13cqw}
  .dev-mk .mz-badge b,.dev-mk .mz-badge i{font-size:1.7cqw}
  .dev-mk .mz-badge u{font-size:5.6cqw}
  .dev-mk .mz-since{left:-1cqw;bottom:5cqw;font-size:1.8cqw;padding:1.4cqw 2cqw}
  .dev-mk .mz-since b{font-size:3.6cqw}
  .dev-mk .mz-band{font-size:2.8cqw;padding:1.8cqw 0}
}
/* Telefon: jeden sloupec. Fotka dostane zbytek výšky a smí se zmenšit
   (minmax 0), jinak by prorostla spodním pruhem. */
@container (max-width:340px){
  .dev-mk .mz-alert{font-size:2.9cqw;padding:2.2cqw 4cqw;white-space:normal;text-align:center;
    flex-direction:column;gap:.8cqw;line-height:1.25}
  .dev-mk .mz-nav{padding:4cqw}
  .dev-mk .mz-brand i{width:9cqw;height:9cqw;font-size:4cqw;border-radius:2cqw}
  .dev-mk .mz-brand b{font-size:5cqw}
  .dev-mk .mz-brand em{font-size:2.7cqw}
  .dev-mk .mz-links .mz-cta{font-size:3cqw;padding:2.4cqw 3.4cqw}
  .dev-mk .mz-hero{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);
    padding:4cqw 4cqw 0;align-items:start}
  .dev-mk .mz-photo{height:100%!important;min-height:0;align-self:end;margin-top:1.6cqw}
  .dev-mk .mz-pill{font-size:3cqw}
  .dev-mk .mz-pill b{font-size:2.7cqw}
  .dev-mk .mz-name{font-size:15cqw}
  .dev-mk .mz-lead{font-size:3.8cqw!important}
  .dev-mk .mz-btn{font-size:3cqw;padding:2.8cqw 3.6cqw}
  .dev-mk .mz-band{font-size:3.8cqw}
}

/* Výška portrétu podle režimu, ne podle šířky rámu.
   Tablet je skoro čtverec (564x536), mobil vysoký (276x556) - při stejné
   hodnotě v cqw fotka na tabletu prorostla spodním pruhem. */
.dev[data-mode="desktop"] .dev-mk .mz-photo{height:33cqw}
.dev[data-mode="tablet"] .dev-mk .mz-photo{height:27cqw}

/* Střídání čísel v úvodu: jméno + číslo se prolnou, šířka drží krok */
.callswap{display:inline-flex;align-items:center;gap:.45em;white-space:nowrap}
.callswap .cs-who{font-weight:600;opacity:.9}  /* .72 bylo na světlém pozadí pod hranicí čitelnosti */
[data-people] .cs-who,[data-people] .cs-num{transition:opacity .22s ease,transform .22s ease;display:inline-block}
[data-people].swapping .cs-who,[data-people].swapping .cs-num{opacity:0;transform:translateY(-4px)}
@media (prefers-reduced-motion:reduce){[data-people] .cs-who,[data-people] .cs-num{transition:none}}
/* tatáž mechanika v patičce a na kontaktu, jen bez velkého rozestupu */
.cs-line{white-space:nowrap}
.cs-line .cs-who{font-weight:600;opacity:.9}

/* Patička: oba lidi pod sloganem */
.foot-who{display:grid;gap:3px;margin-top:12px;font-size:14px;line-height:1.5}
.foot-who strong{font-weight:700;color:var(--ink)}

/* Kontakt: jedna karta, dva lidi */
.c-two{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.c-two a{position:relative;padding:4px 12px;border-radius:999px;border:1px solid var(--line);
  font-size:15px;font-weight:600;line-height:1.3;transition:border-color .25s,color .25s,background .25s}
.c-two a:hover{border-color:#128C4A;color:#128C4A;background:rgba(18,140,74,.08)}

/* ------------------------------------------------------------------
   O NÁS – karty zakladatelů
   Tmavá karta se zlatou nití po horní hraně, velký monogram vzadu
   a jemná záře, která se probudí až při najetí. Zlatá je ta z loga
   (#F3B806), proto ji sem tahám jako jediný akcent navíc k modré.
------------------------------------------------------------------ */
.fo-head{max-width:720px;margin-bottom:clamp(30px,4vw,52px)}
.fo-head h2{font-family:var(--display);font-weight:780;font-stretch:84%;
  font-size:clamp(30px,4vw,54px);line-height:1.02;letter-spacing:-.03em;margin:0 0 14px}
.fo-head p{color:var(--muted);font-size:clamp(16px,1.5vw,19px);line-height:1.6;max-width:62ch;margin:0}
.fo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2.4vw,30px)}
.fo{position:relative;isolation:isolate;overflow:hidden;border-radius:26px;
  padding:clamp(24px,2.6vw,36px);display:flex;flex-direction:column;gap:20px;
  background:#0B1220;color:#EAF0FF;border:1px solid rgba(255,255,255,.07);
  transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .5s}
.fo::before{content:"";position:absolute;inset:0 0 auto;height:2px;z-index:2;
  background:linear-gradient(90deg,transparent,#F3B806 18%,#F3B806 46%,transparent);opacity:.75}
.fo-b{background:#101B33}
.fo-glow{position:absolute;inset:-40% -20% auto;height:150%;z-index:0;pointer-events:none;opacity:0;
  background:radial-gradient(60% 50% at 30% 0%,rgba(243,184,6,.16),transparent 70%);transition:opacity .6s}
.fo:hover{transform:translateY(-4px);border-color:rgba(243,184,6,.28);
  box-shadow:0 34px 70px -40px rgba(0,0,0,.75)}
.fo:hover .fo-glow{opacity:1}
.fo>*{position:relative;z-index:1}
.fo-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.fo-por{width:clamp(78px,7vw,104px);height:clamp(78px,7vw,104px);flex:none;
  border-radius:50%;overflow:hidden;background:#EEF2FA;display:grid;place-items:center}
.fo-por svg{width:100%;height:100%;display:block}
.fo-mono{font-family:var(--display);font-weight:800;font-stretch:84%;
  font-size:clamp(40px,5vw,68px);line-height:1;letter-spacing:-.05em;
  color:transparent;-webkit-text-stroke:1.4px rgba(243,184,6,.4);opacity:.65;user-select:none}
.fo-name{font-family:var(--display);font-weight:760;font-stretch:88%;
  font-size:clamp(24px,2.4vw,32px);line-height:1.05;letter-spacing:-.02em;margin:0 0 6px}
.fo-role{font-size:13px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:#F3B806;margin:0 0 14px}
.fo-say{color:#AFC0DE;line-height:1.6;margin:0 0 18px;font-size:15.5px}
.fo-list{list-style:none;margin:0;padding:0;display:grid;gap:0}
.fo-list li{position:relative;padding:11px 0 11px 26px;font-size:15px;
  border-top:1px solid rgba(255,255,255,.07)}
.fo-list li::before{content:"";position:absolute;left:4px;top:50%;width:7px;height:7px;
  margin-top:-3.5px;border-radius:50%;background:#F3B806;opacity:.8}
.fo-foot{margin-top:auto;padding-top:18px;border-top:1px solid rgba(255,255,255,.1)}
.fo-tel{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);
  font-weight:740;font-stretch:88%;font-size:clamp(19px,1.8vw,24px);letter-spacing:-.01em;
  color:#fff;text-decoration:none;padding:8px 2px;transition:color .3s}
.fo-tel svg{width:19px;height:19px;color:#F3B806;flex:none}
.fo-tel:hover{color:#F3B806}

/* Firemní údaje pod kartami */
.fo-ident{margin-top:clamp(22px,2.6vw,34px);position:relative;border-radius:22px;
  padding:clamp(20px,2.4vw,30px) clamp(22px,2.6vw,34px);
  background:var(--surface);border:1px solid var(--line)}
.fo-ident-mark{position:absolute;left:0;top:18px;bottom:18px;width:3px;border-radius:0 3px 3px 0;
  background:linear-gradient(180deg,#F3B806,rgba(243,184,6,0))}
.fo-ident dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 26px;margin:0}
.fo-ident dt{font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);margin:0 0 5px}
.fo-ident dd{margin:0;font-weight:600;font-size:15.5px;line-height:1.35;color:var(--ink)}
.fo-ident-note{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line);
  font-size:13.5px;color:var(--muted)}
@media (max-width:900px){
  .fo-grid{grid-template-columns:1fr}
  .fo-ident dl{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .fo-ident dl{grid-template-columns:1fr;gap:14px}
  .fo-mono{display:none}
}

/* ------------------------------------------------------------------
   DOTYKOVÉ CÍLE NA MOBILU
   Prstem se těžko trefuje do něčeho, co má na výšku 12 px. Tyhle
   prvky zůstávají vizuálně stejné, jen kolem sebe dostanou
   neviditelnou plochu, do které jde klepnout.
------------------------------------------------------------------ */
@media (max-width:760px){
  .sc-dots [role=tab]{position:relative}
  .sc-dots [role=tab]::after{content:"";position:absolute;left:50%;top:50%;
    width:40px;height:40px;transform:translate(-50%,-50%)}
  .sc-dots{gap:14px}

  .callswap{padding:7px 0}
  .c-two a{padding:9px 14px}
  .copy-btn{padding:10px 14px}
  .ref-go,.link-arrow{padding:8px 0;min-height:40px;align-items:center}
  .crumbs a,.crumbs span{display:inline-block;padding:6px 0}
  .logo{padding:4px 0}

  /* posuvník v kalkulačce: stejná čára, vyšší plocha na chytnutí */
  .roi-f input[type=range]{height:44px}
}

/* ------------------------------------------------------------------
   ODHAD VÝŠKY ODLOŽENÝCH SEKCÍ
   Patička se vykresluje, až když se k ní návštěvník doscrolluje, a do
   té doby si pro ni prohlížeč drží místo podle odhadu. Odhad byl pro
   všechny sekce stejný (700 px), jenže patička má na mobilu přes 1400
   a na počítači 465 - stránka se proto při scrollování pod rukou
   natahovala. Čísla níž jsou naměřené mediány.

   Pozor na `footer` jako selektor: na případových studiích je další
   <footer> uvnitř citace (podpis pod výrokem). Ten je vysoký 22 px a
   rezervovat pro něj 1400 px nadělalo víc škody než užitku, takže
   pravidlo platí jen pro patičku stránky.

   Otázky a závěrečná výzva odloženy nejsou: jejich výška se stránku
   od stránky liší tak moc (489 až 1535 px), že žádný odhad neseděl.
------------------------------------------------------------------ */
.faq,.fcta{content-visibility:visible;contain-intrinsic-size:none}
.cp-quote footer{content-visibility:visible;contain-intrinsic-size:none}
body > footer{contain-intrinsic-size:auto 470px}
@media (max-width:1024px){ body > footer{contain-intrinsic-size:auto 535px} }
@media (max-width:760px){ body > footer{contain-intrinsic-size:auto 1400px} }

/* ------------------------------------------------------------------
   ŠTÍTKY „CO POTŘEBUJETE“ NA KONTAKTU
   Vybraný štítek měl barvu písma natvrdo bílou. Ve světlém režimu je
   pod ní sytě modrá a je to v pořádku, v tmavém je accent světlý a
   bílý text na něm zmizel — stejně jako cena, která je navíc
   průsvitná. Barvu bereme ze stejného tokenu jako tlačítka a ceně
   ubíráme průsvitnost.
------------------------------------------------------------------ */
.chips input:checked + span,.field .chips label input:checked + span{color:var(--accent-ink)}
/* cena je ve vnořeném spanu, který má vlastní tlumenou barvu — uvnitř
   štítku musí převzít barvu štítku, jinak na vybraném zmizí úplně */
.chips span em,.chips span em *{color:inherit}
.chips span em{opacity:.8}
.chips input:checked + span em{opacity:.95}

/* ------------------------------------------------------------------
   BÍLÁ NA SVĚTLÉM MODRÉM POZADÍ
   Několik prvků mělo barvu písma natvrdo bílou, i když pod nimi je
   firemní modrá z proměnné. Ve světlém režimu je ta modrá sytá a bílá
   je na ní čitelná; v tmavém režimu je světlá a text na ní zmizel.
   Barvu proto bereme ze stejného tokenu jako tlačítka — ve světlém
   režimu je to pořád bílá, takže se tam nic nemění.
------------------------------------------------------------------ */
.art a.btn-primary,.art-end a.btn-primary,.mmenu a.mm-cta{color:var(--accent-ink)}
.art-av{color:var(--accent-ink)}
.lc-towns span:first-child{color:var(--accent-ink)}
.avatar-big{color:var(--accent-ink)}

/* Poznámka pod rychlým formulářem leží na bílé kartě v obou režimech,
   takže potřebuje vlastní, tmavší šedou — ta původní měla na bílé
   kontrast 3,7. */
.lf-note{color:#5C677D}

/* ------------------------------------------------------------------
   MODRÁ NA TMAVÉ KARTĚ
   Firemní modrá je ve světlém režimu sytá a na bílé je výborně
   čitelná — na tmavě modré kartě ale splývá (poměr 2,7). Na těchhle
   dvou kartách proto používáme světlejší odstín, stejně jako to už
   dělá sousední karta s odkazem na případovku.
------------------------------------------------------------------ */
.cp-next-card .case-kicker,.nv-card.nv-feat .ref-go{color:#7FB4FF}

/* Štítky „Co potřebujete“: text i cena braly tlumenou šedou, která má
   na bílé kartě poměr 3,9. Text dostane plnou barvu, cena zůstane
   tišší průsvitností, ale pořád nad hranicí čitelnosti. */
.field .chips label span{color:var(--ink)}   /* .field label span mělo vyšší váhu a vracelo tlumenou šedou */
.chips span em{opacity:.72}

/* ------------------------------------------------------------------
   POZOR NA POŘADÍ: cena uvnitř štítku
   Pravidlo `.field .chips label span` výš sahá i na vnořený span
   s cenou a vracelo mu barvu textu stránky — na vybraném štítku se
   tím cena zase ztratila. Tohle pravidlo má vyšší váhu a vrací ji
   zpátky k barvě štítku. Když budete v `.chips` nebo `.field` něco
   měnit, zkontrolujte, že cena na vybraném štítku je pořád vidět.
------------------------------------------------------------------ */
.field .chips label span em,.field .chips label span em *{color:inherit}

/* Měna se lepila na číslo: „21 900Kč“. Pravidlo pro mezeru existovalo
   jen pro .price, na .pkg-price se zapomnělo. */
.pkg-price .cur-label{margin-left:.18em}

/* Ceny se na mobilu lámaly uprostřed: „5 900 Kč 7“ / „900 Kč“. */
.pz,.price,.pkg-price,.cmp td,.cmp th,a[href^="tel:"]{white-space:nowrap}
.cmp th[scope="row"]{white-space:normal}

/* Placeholdery zůstávaly na výchozí šedé prohlížeče (3,6 : 1). */
::placeholder{color:#6B7488;opacity:1}
.is-dark ::placeholder{color:#8A94AB}

/* Chybová hláška měla na tmavé kartě 4,2 : 1. */
.is-dark .field .msg,.is-dark .lf-msg{color:#FF8A8F}
@media (max-width:340px){.sticky-cta .btn-primary{font-size:13.5px;padding:12px 10px}}

/* ===== Malířství Šmídek (maldek.cz) — věrně podle úvodu webu ===== */
.mk-mal{--ma-blue:#1D50A6;background:#fff;color:#1E2328;display:flex;flex-direction:column}
.ma-top{display:flex;justify-content:flex-end;gap:2cqw;align-items:center;background:#F1F2F4;padding:.7cqw 3.6cqw;font-size:1.05cqw;font-style:italic;color:#5C636B}
.ma-top i{font-style:normal;display:inline-block;width:1.3cqw;height:1.3cqw;border-radius:.25cqw;background:var(--ma-blue)}
.mk-mal .mk-nav{background:var(--ma-blue);color:#fff;padding:1.6cqw 3.6cqw;gap:2cqw;text-transform:uppercase;letter-spacing:.06em;font-weight:700;font-size:1.2cqw;box-shadow:0 .6cqw 1.6cqw rgba(0,0,0,.25)}
.mk-mal .mk-nav>b{margin-right:auto;height:2.4cqw;width:9.2cqw;display:block;background:url(ref-mal-logo.webp) center/contain no-repeat}
.mk-mal .mk-nav span{color:#fff}
.mk-mal .mk-nav span.on{background:rgba(255,255,255,.18);padding:.6cqw 1.2cqw;border-radius:999px}
.mk-mal .mk-nav em{margin-left:auto;background:transparent;color:#fff;padding:0;letter-spacing:.02em;display:inline-flex;align-items:center;gap:.6cqw}
.mk-mal .mk-nav em::before{content:"";width:1.1cqw;height:1.1cqw;border-radius:50%;background:#fff}
.ma-head{text-align:center;padding:2.6cqw 3cqw 0;position:relative;z-index:2}
.ma-head h4{font-family:var(--display);font-weight:800;font-size:5cqw;line-height:.98;letter-spacing:-.03em;color:var(--ma-blue);margin:0 0 1.3cqw}
.ma-head h4 i{display:block;font-style:normal}
.ma-head p{font-size:1.45cqw;color:#5C636B;margin:0;max-width:none}
.ma-hero{position:relative;flex:1;margin:2cqw 1.4cqw 0;display:grid;grid-template-columns:1fr 14cqw;gap:1cqw;min-height:0}
.ma-hero .ph{position:relative;overflow:hidden;border-radius:1cqw 0 0 0;background:#E9EFFA}
.ma-hero .ph::before{content:"";position:absolute;inset:0;background:url(ref-mal-hero.webp) center 30%/cover}
.ma-hero .ma-sheen{position:absolute;z-index:2;top:0;bottom:0;left:-12cqw;width:12cqw;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);animation:maSheen 8s cubic-bezier(.6,0,.3,1) infinite}
.ma-roll{position:absolute;z-index:3;left:0;top:-2cqw;width:4.4cqw;height:30cqw;transform:translateX(66cqw);animation:maRoll 8s cubic-bezier(.6,0,.3,1) infinite}
.ma-roll::before{content:"";position:absolute;left:0;right:0;top:3cqw;height:6.5cqw;border-radius:1cqw;background:linear-gradient(90deg,#2A62C4,#1D50A6 60%,#17418A);box-shadow:0 .8cqw 1.6cqw rgba(0,0,0,.35)}
.ma-roll::after{content:"";position:absolute;left:50%;top:9cqw;width:.8cqw;height:7cqw;margin-left:-.4cqw;background:#D6DBE3;border-radius:999px}
@keyframes maSheen{0%,6%{transform:translateX(0);opacity:0}10%{opacity:1}56%{transform:translateX(82cqw);opacity:1}60%,100%{transform:translateX(82cqw);opacity:0}}
@keyframes maRoll{0%{transform:translateX(-1cqw);opacity:0}8%{transform:translateX(-1cqw);opacity:1}56%{transform:translateX(66cqw);opacity:1}62%,100%{transform:translateX(66cqw);opacity:0}}
.ma-hero .lg{background:#F7F8FA url(ref-mal-logos.webp) center 1cqw/82% auto no-repeat;border-radius:0 1cqw 0 0;overflow:hidden}

.ps-mal{background:#fff;color:#1E2328}
.ps-mal .ps-nav{--bb:#1D50A6;background:#1D50A6;color:#fff;padding:14cqw 6cqw 4cqw}
.ps-mal .ps-nav b{display:block;height:7cqw;width:26cqw;background:url(ref-mal-logo.webp) left center/contain no-repeat}
.ps-mal .ps-burger{width:6cqw;height:1cqw;background:#fff;border-radius:999px;box-shadow:0 2cqw 0 #fff,0 -2cqw 0 #fff}
.ps-mal-copy{padding:5cqw 5cqw 0;text-align:center;position:relative;z-index:2}
.ps-mal h4{font-family:var(--display);font-weight:800;font-size:10cqw;line-height:.98;letter-spacing:-.03em;color:#1D50A6;margin:0 0 2.6cqw}
.ps-mal h4 i{display:block;font-style:normal}
.ps-mal p{font-size:3.4cqw;color:#5C636B;margin:0 0 4cqw}
.ps-mal .pm-pic{position:absolute;left:4cqw;right:4cqw;bottom:-4cqw;height:46cqw;border-radius:2.4cqw 2.4cqw 0 0;overflow:hidden;box-shadow:0 2cqw 6cqw -2cqw rgba(0,0,0,.35);background:url(ref-mal-hero.webp) center 30%/cover}

/* ===== Úklid BN (uklid-bn.cz) — věrně podle úvodu webu ===== */
.mk-ubn{--ub-blue:#286CD1;--ub-ink:#1E2A47;--ub-gold:#B8A24B;--ub-green:#4F8F45;background:#F7F9FD;color:var(--ub-ink)}
.mk-ubn::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 50% at 15% 60%,rgba(40,108,209,.10),transparent 70%)}
.mk-ubn .mk-nav{background:var(--ub-blue);color:#fff;padding:1.3cqw 3.6cqw;gap:1.8cqw;text-transform:uppercase;letter-spacing:.06em;font-weight:700;font-size:1.15cqw;border-bottom:.35cqw solid var(--ub-gold)}
.mk-ubn .mk-nav>b{margin-right:auto;background:#fff url(ref-ubn-logo.webp) center/contain no-repeat;background-origin:content-box;border-radius:.9cqw;padding:.5cqw .8cqw;height:4.2cqw;width:8.6cqw;display:block}
.mk-ubn .mk-nav span{color:#fff}
.mk-ubn .mk-nav span.on{background:rgba(255,255,255,.18);padding:.6cqw 1.2cqw;border-radius:999px}
.mk-ubn .mk-nav em{background:transparent;color:#fff;border:.18cqw solid rgba(255,255,255,.8);padding:.8cqw 1.6cqw;letter-spacing:.02em}
.mk-ubn .mk-nav em.g{background:var(--ub-gold);border-color:var(--ub-gold)}
.ub-copy{position:relative;z-index:3;width:50%;padding:2.4cqw 0 0 3.6cqw}
.ub-eye{display:inline-flex;align-items:center;gap:.8cqw;font-size:1.15cqw;font-weight:700;color:var(--ub-ink);background:#fff;padding:.6cqw 1.4cqw;border-radius:999px;box-shadow:0 .6cqw 1.6cqw -.4cqw rgba(16,30,60,.25);margin-bottom:1.3cqw}
.ub-eye::before{content:"";width:.9cqw;height:.9cqw;border-radius:50%;background:var(--ub-green)}
.ub-copy h4{font-family:var(--display);font-weight:800;font-size:4.4cqw;line-height:.98;letter-spacing:-.03em;color:var(--ub-ink);margin:0 0 1.4cqw}
.ub-copy h4 em{display:inline-block;font-style:normal;color:#fff;background:linear-gradient(90deg,var(--ub-green),var(--ub-gold));padding:.2cqw 1.2cqw .4cqw;border-radius:.7cqw;transform:rotate(-2deg);margin-top:.6cqw}
.ub-copy p{font-size:1.75cqw;font-weight:600;color:#3A4256;margin:0 0 1.8cqw;max-width:none}
.ub-rot{display:inline-grid;vertical-align:bottom;font-weight:800;color:var(--ub-blue);text-align:left;border-bottom:.3cqw solid var(--ub-gold);padding:0 .6cqw .2cqw}
.ub-rot i{grid-area:1/1;font-style:normal;opacity:0;animation:ubRot 10s infinite}
.ub-rot i:first-child{opacity:1}
.ub-rot i:nth-child(2){animation-delay:2.5s}.ub-rot i:nth-child(3){animation-delay:5s}.ub-rot i:nth-child(4){animation-delay:7.5s}
@keyframes ubRot{0%{opacity:0;transform:translateY(.6em)}5%,22%{opacity:1;transform:none}27%,100%{opacity:0;transform:translateY(-.6em)}}
.ub-btns{display:flex;gap:1cqw;margin-bottom:1.6cqw}
.ub-btns em{background:var(--ub-gold);color:#fff;font-weight:800;font-size:1.3cqw;padding:1.2cqw 2cqw;border-radius:999px;font-style:normal}
.ub-btns em.b{background:var(--ub-blue)}
.ub-chips{display:flex;flex-wrap:wrap;gap:1.4cqw}
.ub-chips span{font-size:1.15cqw;font-weight:700;color:var(--ub-ink)}
.ub-chips span::before{content:"✓ ";color:var(--ub-green)}
.ub-photo{position:absolute;z-index:2;right:3.6cqw;top:9.5cqw;width:40%;height:31cqw;border-radius:1.6cqw;overflow:hidden;border:.35cqw solid #fff;box-shadow:0 2cqw 5cqw -1.5cqw rgba(16,30,60,.4);background:url(ref-ubn-hero.webp) center/cover}
.ub-tag{position:absolute;z-index:4;left:57%;top:42.6cqw;display:inline-flex;align-items:center;gap:.8cqw;background:var(--ub-gold);color:#fff;font-weight:700;font-size:1.2cqw;padding:.8cqw 1.6cqw;border-radius:999px;box-shadow:0 .8cqw 2cqw -.6cqw rgba(16,30,60,.35)}
.ub-tag::before{content:"";width:.9cqw;height:.9cqw;border-radius:50%;background:#fff}
.ub-spark{position:absolute;z-index:3;color:#fff;font-size:2.2cqw;animation:ubSpark 4s ease-in-out infinite;opacity:0;text-shadow:0 0 1cqw rgba(0,0,0,.25)}
.ub-spark.s1{right:38%;top:14cqw}.ub-spark.s2{right:10%;top:20cqw;animation-delay:-1.4s;font-size:1.6cqw}.ub-spark.s3{right:30%;top:30cqw;animation-delay:-2.6s;font-size:1.9cqw}
@keyframes ubSpark{0%,100%{opacity:0;transform:scale(.4) rotate(0)}50%{opacity:1;transform:scale(1) rotate(25deg)}}
.ub-band{position:absolute;z-index:4;left:0;right:0;bottom:0;height:5.2cqw;background:var(--ub-ink);border-top:.3cqw solid var(--ub-gold);overflow:hidden;display:flex;align-items:center}
.ub-band span{white-space:nowrap;font-weight:800;font-size:1.5cqw;color:#fff;animation:ubBand 22s linear infinite;padding-left:1cqw}
.ub-band span i{font-style:normal;color:var(--ub-gold);margin:0 1.6cqw}
@keyframes ubBand{to{transform:translateX(-50%)}}

.ps-ubn{background:#F7F9FD;color:#1E2A47}
.ps-ubn .ps-nav{--bb:#286CD1;background:#286CD1;padding:13cqw 5cqw 3.4cqw;border-bottom:1cqw solid #B8A24B}
.ps-ubn .ps-nav b{display:block;height:9cqw;width:19cqw;background:#fff url(ref-ubn-logo.webp) center/contain no-repeat;background-origin:content-box;border-radius:2cqw;padding:1.2cqw 1.6cqw}
.ps-ubn .call{background:transparent;color:#fff;border:.5cqw solid rgba(255,255,255,.85);font-weight:800;font-size:3.2cqw;padding:1.8cqw 3.2cqw;border-radius:999px}
.ps-ubn-copy{padding:5cqw 6cqw 0;position:relative;z-index:2}
.ps-ubn .k{display:inline-flex;align-items:center;gap:1.6cqw;font-size:3cqw;font-weight:700;color:#1E2A47;background:#fff;padding:1.4cqw 3cqw;border-radius:999px;box-shadow:0 1.5cqw 4cqw -1cqw rgba(16,30,60,.25);margin-bottom:3cqw}
.ps-ubn .k::before{content:"";width:2cqw;height:2cqw;border-radius:50%;background:#4F8F45}
.ps-ubn h4{font-family:var(--display);font-weight:800;font-size:10cqw;line-height:.98;letter-spacing:-.03em;color:#1E2A47;margin:0 0 3cqw}
.ps-ubn h4 em{display:inline-block;font-style:normal;color:#fff;background:linear-gradient(90deg,#4F8F45,#B8A24B);padding:.4cqw 2.6cqw .9cqw;border-radius:1.6cqw;transform:rotate(-2deg);margin-top:1.4cqw}
.ps-ubn p{font-size:4cqw;font-weight:600;color:#3A4256;margin:0 0 4cqw}
.ps-ubn .ps-btn{background:#B8A24B;color:#fff;border-radius:999px}
.ps-ubn .pu-pic{position:absolute;left:5cqw;right:5cqw;bottom:-6cqw;height:38cqw;border-radius:3cqw;overflow:hidden;border:1cqw solid #fff;box-shadow:0 3cqw 8cqw -2cqw rgba(16,30,60,.45);background:url(ref-ubn-hero.webp) center/cover}
.ps-ubn .ub-spark{font-size:6cqw;color:#fff}
.ps-ubn .ub-spark.s1{right:14%;bottom:18cqw;top:auto}.ps-ubn .ub-spark.s2{right:34%;bottom:12cqw;top:auto;font-size:4cqw}.ps-ubn .ub-spark.s3{left:14%;bottom:24cqw;top:auto;font-size:4.6cqw}

.foot-person{display:flex;flex-wrap:wrap;align-items:baseline;gap:.35em .6em}
.foot-person b{font-weight:600;min-width:5.6em}
.foot-person a[href^="tel:"]{white-space:nowrap}
.foot-wa{font-size:.86em;padding:.1em .6em;border:1px solid currentColor;border-radius:999px;opacity:.85}
.foot-wa:hover{opacity:1}

/* telefonní mockupy – spodní část obrazovky */
.ps-kp .kp-svc{position:absolute;z-index:3;left:6cqw;right:6cqw;bottom:8cqw;display:grid;grid-template-columns:1fr 1fr;gap:2cqw}
.ps-kp .kp-svc span{background:rgba(11,22,42,.78);border:1px solid rgba(140,175,235,.3);border-radius:2.6cqw;padding:3cqw 3cqw;font-size:3.3cqw;font-weight:700;color:#EAF5FF;backdrop-filter:blur(2px)}
.ps-kp .kp-svc span::before{content:"";display:block;width:5cqw;height:.9cqw;border-radius:999px;background:var(--kp,#3F6BF5);margin-bottom:1.8cqw}
.ps-kt .kt-pr{position:absolute;z-index:3;left:6cqw;right:6cqw;bottom:20cqw;background:#F5F4EF;color:var(--kt-petrol);border-radius:3cqw;padding:3cqw 4cqw;display:flex;align-items:center;justify-content:space-between;font-size:3.4cqw;font-weight:600;box-shadow:0 3cqw 7cqw -2cqw rgba(0,0,0,.45)}
.ps-kt .kt-pr b{font-family:"Archivo",var(--display);font-weight:900;font-stretch:115%;font-size:6cqw;background:linear-gradient(rgba(242,194,48,.7),rgba(242,194,48,.7)) no-repeat 0 88%/100% 38%}
.ps-kt .kt-tape{position:absolute;z-index:3;left:0;right:0;bottom:6cqw;overflow:hidden;white-space:nowrap;font-size:3cqw;font-weight:700;color:#A9C0BC;letter-spacing:.04em}
.ps-kt .kt-tape span{display:inline-block;animation:ktTape 26s linear infinite}
@keyframes ktTape{to{transform:translateX(-50%)}}
.ps-mal .pm-pic{position:relative;left:auto;right:auto;bottom:auto;margin:1cqw 5cqw 0;height:40cqw;border-radius:2.4cqw;flex:none;box-shadow:0 2cqw 6cqw -2cqw rgba(0,0,0,.35)}
.ps-mal .pm-brands{margin:4cqw 5cqw 0;display:flex;justify-content:space-between;align-items:center;font-family:var(--display);font-weight:800;font-size:3.1cqw;letter-spacing:.02em;color:#3A4148;opacity:.85}
.ps-mal .pm-tags{margin:3.6cqw 5cqw 0;display:flex;gap:1.8cqw;flex-wrap:wrap}
.ps-mal .pm-tags span{font-size:3cqw;font-weight:700;color:#0B2350;background:#E9EFFA;padding:1.6cqw 3cqw;border-radius:999px}
.ps-mal .pm-tags span.g{background:#F4B629}
.ps-ubn-copy{padding-bottom:0}
.ps-ubn .pu-pic{position:relative;left:auto;right:auto;bottom:auto;margin:3.4cqw 5cqw 0;height:42cqw;flex:none}
.ps-ubn .pu-chips{margin:3.4cqw 6cqw 0;display:flex;flex-wrap:wrap;gap:1.2cqw 3cqw}
.ps-ubn .pu-chips span{font-size:3.1cqw;font-weight:700;color:#1E2A47}
.ps-ubn .pu-chips span::before{content:"✓ ";color:#4F8F45}
.ps-ubn .pu-tag{margin:3.2cqw 6cqw 0;align-self:flex-start;display:inline-flex;align-items:center;gap:1.6cqw;background:#B8A24B;color:#fff;font-weight:700;font-size:3cqw;padding:1.8cqw 3.4cqw;border-radius:999px}
.ps-ubn .pu-tag::before{content:"";width:2cqw;height:2cqw;border-radius:50%;background:#fff}
.ps-ubn .pu-band{position:absolute;left:0;right:0;bottom:0;height:11cqw;background:#1E2A47;border-top:.8cqw solid #B8A24B;overflow:hidden;display:flex;align-items:center;white-space:nowrap;font-weight:800;font-size:3.3cqw;color:#fff}
.ps-ubn .pu-band span{display:inline-block;animation:ubBand 22s linear infinite;padding-left:2cqw}
.ps-ubn .pu-band i{font-style:normal;color:#B8A24B;margin:0 3cqw}
.ps-ubn .ub-spark{display:none}

.ps-kp .kp-chips{position:absolute;z-index:3;left:6cqw;right:6cqw;bottom:46cqw;display:flex;gap:2cqw}
.ps-kp .kp-chips span{flex:1;background:#fff;color:#0A1733;border-radius:2.6cqw;padding:2.4cqw 3cqw;font-size:3cqw;line-height:1.25;box-shadow:0 3cqw 7cqw -2cqw rgba(0,0,0,.5)}
.ps-kp .kp-chips b{display:block;font-size:3.6cqw}
.ps-mal .pm-pic{height:50cqw}
.ps-mal .pm-why{margin:3.6cqw 5cqw 0;display:grid;gap:1.6cqw;font-size:3cqw;font-weight:600;color:#1E2328}
.ps-mal .pm-why span::before{content:"✓ ";color:#1D50A6;font-weight:900}
.ps-ubn .pu-tag{margin-bottom:14cqw}
.cp-res.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.cp-res.four{grid-template-columns:1fr 1fr}}

.ps-mal .pm-svc{margin:3.6cqw 5cqw 0;display:grid;grid-template-columns:1fr 1fr;gap:1.6cqw}
.ps-mal .pm-svc span{font-size:2.9cqw;font-weight:600;color:#0B2350;background:#fff;border:.35cqw solid #E1E5EB;border-radius:2cqw;padding:1.8cqw 2.4cqw}
.ps-mal .pm-pic{height:44cqw}
@media (max-width:380px){.hs-tab{flex:1 1 44%}.hs-tab b{overflow-wrap:normal}}
@media (max-width:360px){.reftab{font-size:14px}.reftab td{padding-left:6px}}
.pkg-detail .price-old{color:#AEB8CE}
.foot-wa{opacity:1}

/* ===== M&M Michal Maulis (mauliszelen.cz) — věrně podle úvodu webu ===== */
.mk-mmz{--mmz-bg:#132115;--mmz-gold:#C9A961;--mmz-ink:#F3EFE6;background:var(--mmz-bg);color:var(--mmz-ink)}
.mk-mmz::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 8.3%,transparent 8.3% 16.6%),radial-gradient(45% 55% at 68% 55%,rgba(201,169,97,.16),transparent 70%)}
.mk-mmz .mk-nav{padding:1.4cqw 3.6cqw;gap:1.9cqw;font-size:1.12cqw;color:#DCE3D9;border-bottom:1px solid rgba(255,255,255,.08)}
.mk-mmz .mk-nav>b{margin-right:auto;width:14cqw;height:3.2cqw;display:block;background:url(ref-mz-logo.webp) left center/contain no-repeat}
.mk-mmz .mk-nav span{color:#DCE3D9;font-weight:500}
.mk-mmz .mk-nav .tel{font-weight:600;color:#fff;display:inline-flex;align-items:center;gap:.6cqw;margin-left:auto}
.mk-mmz .mk-nav .tel::before{content:"";width:1.1cqw;height:1.1cqw;border-radius:50%;border:.18cqw solid var(--mmz-gold)}
.mk-mmz .mk-nav em{background:var(--mmz-gold);color:#1B2A1E;font-weight:800;font-size:1cqw;letter-spacing:.1em;text-transform:uppercase;padding:1cqw 1.8cqw;border-radius:999px}
.mmz-copy{position:relative;z-index:3;width:48%;padding:4cqw 0 0 3.6cqw}
.mmz-eye{display:flex;align-items:center;gap:1cqw;font-size:1cqw;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--mmz-gold);margin-bottom:1.8cqw}
.mmz-eye::before{content:"";width:3cqw;height:.12cqw;background:var(--mmz-gold)}
.mmz-copy h4{font-family:var(--display);font-weight:700;font-size:5.4cqw;line-height:.98;letter-spacing:-.03em;color:#fff;margin:0 0 1.6cqw}
.mmz-copy h4 i{display:block;font-style:normal;color:var(--mmz-gold)}
.mmz-copy p{font-size:1.35cqw;line-height:1.45;color:#C9D1C5;margin:0 0 2cqw;max-width:none}
.mmz-btns{display:flex;align-items:center;gap:1.6cqw}
.mmz-btns em{background:var(--mmz-gold);color:#1B2A1E;font-weight:800;font-size:1cqw;letter-spacing:.1em;text-transform:uppercase;padding:1.4cqw 2.4cqw;border-radius:999px;font-style:normal}
.mmz-btns .ph{display:inline-flex;align-items:center;gap:1cqw;font-family:var(--display);font-weight:700;font-size:1.8cqw;color:#fff;letter-spacing:-.02em}
.mmz-btns .ph::before{content:"";width:3cqw;height:3cqw;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:radial-gradient(circle,rgba(255,255,255,.9) 0 .5cqw,transparent .55cqw)}
.mmz-mono{position:absolute;z-index:2;right:4.5cqw;top:11cqw;width:40%;aspect-ratio:720/405;background:url(ref-mz-mono.webp) center/cover;border-radius:1cqw;animation:mmzGlow 6s ease-in-out infinite}
@keyframes mmzGlow{0%,100%{filter:drop-shadow(0 0 0 rgba(201,169,97,0))}50%{filter:drop-shadow(0 0 2.4cqw rgba(201,169,97,.35))}}
.mmz-band{position:absolute;z-index:4;left:0;right:0;bottom:0;height:4.6cqw;background:#0D1810;border-top:1px solid rgba(201,169,97,.35);overflow:hidden;display:flex;align-items:center}
.mmz-band span{white-space:nowrap;font-size:1.05cqw;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#E6E1D4;animation:mmzBand 28s linear infinite;padding-left:1cqw}
.mmz-band span i{font-style:normal;color:var(--mmz-gold);margin:0 2.2cqw}
@keyframes mmzBand{to{transform:translateX(-50%)}}
.mmz-wa{position:absolute;z-index:5;right:2.6cqw;bottom:6.4cqw;width:4.2cqw;height:4.2cqw;border-radius:50%;background:#25D366;box-shadow:0 1cqw 2.4cqw -.6cqw rgba(0,0,0,.6)}
.mmz-wa::before{content:"";position:absolute;inset:1.1cqw;border:.28cqw solid #fff;border-radius:50% 50% 50% .3cqw}

.ps-mmz{background:#132115;color:#F3EFE6}
.ps-mmz::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 10%,transparent 10% 20%)}
.ps-mmz .ps-nav{--bb:transparent;padding:13cqw 6cqw 3cqw;position:relative;z-index:2}
.ps-mmz .ps-nav b{display:block;width:34cqw;height:8cqw;background:url(ref-mz-logo.webp) left center/contain no-repeat}
.ps-mmz .ps-burger{width:6cqw;height:1cqw;background:#F3EFE6;border-radius:999px;box-shadow:0 2cqw 0 #F3EFE6,0 -2cqw 0 #F3EFE6}
.ps-mmz-copy{padding:4cqw 6cqw 0;position:relative;z-index:2}
.ps-mmz .k{display:flex;align-items:center;gap:2cqw;font-size:2.6cqw;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#C9A961;margin-bottom:3.4cqw}
.ps-mmz .k::before{content:"";width:6cqw;height:.3cqw;background:#C9A961}
.ps-mmz h4{font-family:var(--display);font-weight:700;font-size:11cqw;line-height:.98;letter-spacing:-.03em;color:#fff;margin:0 0 3cqw}
.ps-mmz h4 i{display:block;font-style:normal;color:#C9A961}
.ps-mmz p{font-size:3.4cqw;line-height:1.45;color:#C9D1C5;margin:0 0 4cqw}
.ps-mmz .ps-btn{background:#C9A961;color:#1B2A1E;border-radius:999px;letter-spacing:.08em;text-transform:uppercase;font-size:3.1cqw;font-weight:800}
.ps-mmz .tel{display:block;margin:4cqw 0 0;font-family:var(--display);font-weight:700;font-size:5.4cqw;color:#fff;letter-spacing:-.02em}
.ps-mmz .mono{position:relative;z-index:1;margin:5cqw 6cqw 0;height:48cqw;background:url(ref-mz-mono.webp) center/cover;border-radius:2.4cqw}
.ps-mmz .band{position:absolute;z-index:3;left:0;right:0;bottom:0;height:10cqw;background:#0D1810;border-top:1px solid rgba(201,169,97,.35);overflow:hidden;display:flex;align-items:center;white-space:nowrap;font-size:2.8cqw;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#E6E1D4}
.ps-mmz .band span{display:inline-block;animation:mmzBand 28s linear infinite;padding-left:2cqw}
.ps-mmz .band i{font-style:normal;color:#C9A961;margin:0 4cqw}

/* --- makety: spodní polovina obrazovky --- */
.kt-svc{position:absolute;z-index:3;left:3.6cqw;right:3.6cqw;top:41.6cqw;display:grid;grid-template-columns:repeat(3,1fr);gap:.9cqw}
.kt-svc div{display:flex;align-items:center;gap:1cqw;background:rgba(245,244,239,.08);border:1px solid rgba(243,245,238,.16);border-radius:1cqw;padding:.7cqw 1.1cqw;backdrop-filter:blur(2px)}
.kt-svc i{flex:none;width:2cqw;height:2cqw;border-radius:.7cqw;background:#F2C230;display:grid;place-items:center;color:#0F3036;font-style:normal;font-weight:900;font-size:1.3cqw}
.kt-svc b{display:inline;font-size:1.2cqw;font-weight:800;color:#F3F5EE;line-height:1.1}
.kt-svc small{display:inline;font-size:1cqw;color:#A9C0BC;margin-left:.5cqw}

.ma-cards{position:absolute;z-index:4;left:3cqw;right:17.6cqw;bottom:2.6cqw;display:grid;grid-template-columns:repeat(4,1fr);gap:1cqw}
.ma-cards div{background:rgba(255,255,255,.94);border-radius:1cqw;padding:1cqw 1.2cqw;box-shadow:0 1.2cqw 2.6cqw -1cqw rgba(16,30,60,.35)}
.ma-cards b{display:block;font-size:1.25cqw;font-weight:800;color:var(--ma-blue);line-height:1.1}
.ma-cards small{display:block;font-size:1cqw;color:#5C636B;margin-top:.3cqw}
.ma-cards div::before{content:"";display:block;width:2.2cqw;height:.45cqw;border-radius:999px;background:#F4B629;margin-bottom:.7cqw}
.ma-hero .lg{position:relative}
.ma-side{position:absolute;left:1cqw;right:1cqw;bottom:1cqw;display:grid;gap:.6cqw}
.ma-side span{display:block;background:#fff;border:1px solid #E1E5EB;border-radius:.8cqw;padding:.9cqw 1cqw;font-size:1.05cqw;font-weight:700;color:#1E2328;text-align:center}
.ma-side span.g{background:#F4B629;border-color:#F4B629;color:#1E2328}
.ma-side span.b{background:var(--ma-blue);border-color:var(--ma-blue);color:#fff}
.ub-svc{position:absolute;z-index:3;left:3.6cqw;top:45.6cqw;width:48%;display:grid;grid-template-columns:repeat(3,1fr);gap:.9cqw}
.ub-svc span{display:flex;align-items:center;gap:.7cqw;background:#fff;border:1px solid #E1E6F0;border-radius:.9cqw;padding:.75cqw .9cqw;font-size:1.05cqw;font-weight:700;color:var(--ub-ink);line-height:1.1}
.ub-svc span::before{content:"";flex:none;width:1.5cqw;height:1.5cqw;border-radius:50%;background:var(--ub-green);box-shadow:inset 0 0 0 .4cqw #fff,0 0 0 1px var(--ub-green)}
.ub-steps{position:absolute;z-index:3;left:56%;right:3.6cqw;top:47.5cqw;display:grid;grid-template-columns:repeat(3,1fr);gap:.8cqw}
.ub-steps div{background:var(--ub-ink);color:#fff;border-radius:.9cqw;padding:.9cqw 1cqw;font-size:1.05cqw;font-weight:700;line-height:1.15}
.ub-steps div i{display:block;font-style:normal;font-size:.95cqw;color:#E6D28A;font-weight:800;margin-bottom:.3cqw;letter-spacing:.06em}
.mmz-stats{position:absolute;z-index:3;left:3.6cqw;top:41.5cqw;width:48%;display:grid;grid-template-columns:repeat(3,1fr);gap:1cqw}
.mmz-stats div{background:rgba(255,255,255,.05);border:1px solid rgba(201,169,97,.3);border-radius:1cqw;padding:1cqw 1.2cqw}
.mmz-stats b{display:block;font-family:var(--display);font-size:2.1cqw;font-weight:700;color:var(--mmz-gold);line-height:1;letter-spacing:-.02em}
.mmz-stats small{display:block;font-size:1cqw;color:#C9D1C5;margin-top:.5cqw;line-height:1.2}
.mmz-tech{position:absolute;z-index:3;right:4.5cqw;top:36.5cqw;width:40%;display:grid;grid-template-columns:repeat(3,1fr);gap:.9cqw}
.mmz-tech span{display:block;background:#0D1810;border:1px solid rgba(201,169,97,.35);border-radius:.9cqw;padding:.9cqw 1cqw;font-size:1.05cqw;font-weight:700;color:#F3EFE6;text-align:center;line-height:1.15}
.mmz-tech span::before{content:"";display:block;width:2cqw;height:.4cqw;border-radius:999px;background:var(--mmz-gold);margin:0 auto .6cqw}
.mmz-wa{bottom:7cqw}
