:root{--accent:#8db04f;--accent-dark:#7a9b42;--accent-on-light:#6B8A3D;--radius:18px;--bg:#0a0a0a;--fg:#f2f2f2;--muted:#8a8a8a;--muted2:#c9c9c9;--card:#121212;--card-hover:#181818;--line:#262626;--chip-dark:#1c1c1c;--cream:#f2f0e4;--cream-line:#d9d5c6;--cream-chip:#e4e1d3;--ink:#0a0a0a;--ink-muted:#555555;--cb-border:#c9c4b4}
[hidden]{display:none!important}
html{scroll-behavior:smooth;background:var(--bg);color-scheme:dark;overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:'Ruda',system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-wrap:pretty;overflow-x:clip}
a{color:var(--fg);text-decoration:none}
a:hover{color:var(--accent)}
img,video,svg{max-width:100%}
img,video{height:auto;display:block}
button{font-family:inherit}
h1,h2,h3,p,figure,blockquote{margin:0}
.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);flex:none}
.arrow{flex:none;width:40px;height:40px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:0.875rem;line-height:1}
.arrow--white{background:#fff;color:var(--accent)}
.arrow--ink{background:#fff;color:var(--ink)}
.arrow--ghost{background:var(--chip-dark);color:var(--fg)}
.arrow--36{width:36px;height:36px;font-size:0.8125rem}
.arrow--44{width:44px;height:44px;font-size:0.875rem}
.arrow--48{width:48px;height:48px;font-size:0.9375rem}
.arrow--56{width:56px;height:56px;font-size:0.875rem}
.arrow--38{width:38px;height:38px;font-size:0.8125rem}
.arrow--24{width:24px;height:24px;font-size:0.75rem}
.arrow--down{transform:rotate(90deg)}
.icon-40{width:40px;height:40px;display:flex;align-items:center;justify-content:center;flex:none}
.icon-44{width:44px;height:44px;display:flex;align-items:center;justify-content:center;flex:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hp{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}

@keyframes bp-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.3)}}
@keyframes bp-blink{0%,100%{opacity:.2}50%{opacity:1}}
@keyframes bp-blink2{0%,100%{opacity:.18}50%{opacity:1}}
@keyframes bp-flow{to{stroke-dashoffset:-16}}
@keyframes bp-rise{0%{transform:scaleY(0)}60%{transform:scaleY(1.12)}80%{transform:scaleY(.96)}100%{transform:scaleY(1)}}
@keyframes bp-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes bp-float4{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes bp-spin{to{transform:rotate(360deg)}}
@keyframes bp-draw{0%{stroke-dashoffset:var(--len)}55%,100%{stroke-dashoffset:0}}
@keyframes bp-appear{0%,45%{transform:scale(0);opacity:0}60%{transform:scale(1.3);opacity:1}72%,100%{transform:scale(1);opacity:1}}
@keyframes bp-appear2{0%,45%{transform:scale(0);opacity:0}60%{transform:scale(1.35);opacity:1}72%,100%{transform:scale(1);opacity:1}}
@keyframes bp-drop{0%,10%{transform:translateY(-14px);opacity:0}25%{opacity:1}40%,100%{transform:translateY(0);opacity:1}}
@keyframes bp-orbit-x{0%,100%{transform:translateX(-12px)}50%{transform:translateX(12px)}}
@keyframes bp-type{0%{stroke-dashoffset:14}50%,100%{stroke-dashoffset:0}}
@keyframes bp-scan{0%,100%{transform:translateX(0)}50%{transform:translateX(16px)}}
@keyframes bp-scan14{0%,100%{transform:translateX(0)}50%{transform:translateX(14px)}}
@keyframes bp-swing{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(10deg)}}
@keyframes bp-swing10{0%,100%{transform:rotate(-10deg)}50%{transform:rotate(10deg)}}
@keyframes bp-needle{0%{transform:rotate(-70deg)}45%{transform:rotate(58deg)}60%{transform:rotate(48deg)}100%{transform:rotate(52deg)}}
@keyframes bp-ring{0%,100%{transform:rotate(0)}10%{transform:rotate(-14deg)}20%{transform:rotate(12deg)}30%{transform:rotate(-8deg)}40%{transform:rotate(6deg)}50%{transform:rotate(0)}}
@keyframes bp-flap{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.15)}}
@keyframes bp-reveal{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes bp-hide{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(18px)}}
@keyframes bp-glitch{0%,70%,100%{transform:translate(0,0);opacity:1}74%{transform:translate(-8px,3px);opacity:.55}78%{transform:translate(7px,-3px);opacity:1}82%{transform:translate(-4px,2px);opacity:.7}86%{transform:translate(3px,-1px);opacity:1}90%{transform:translate(0,0);opacity:1}}
.an{transform-box:fill-box;transform-origin:center;animation:var(--kf) var(--dur,2s) var(--ease,ease-in-out) var(--delay,0s) infinite}
.an--bottom{transform-origin:bottom}
.an--top{transform-origin:top}
.an--tl{transform-origin:top left}
.an--bl{transform-origin:bottom left}
.an--linear{--ease:linear}
.an--steps{--ease:steps(1)}
.an--flow{animation:bp-flow 1.4s linear infinite}
.an--draw{animation:bp-draw var(--dur,3s) ease-in-out var(--delay,0s) infinite}
.an--type{animation:bp-type 2.4s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.an,.an--flow,.an--draw,.an--type,.nf-ghost,.menu,.menu-link,.menu.is-closing,.menu.is-closing .menu-link{animation:none!important}html{scroll-behavior:auto}}

.nav{position:fixed;top:0;left:0;right:0;z-index:50;padding:1.0625rem 0;pointer-events:none;background:var(--cream);font-family:'Ruda',system-ui,sans-serif}
.nav-inner{max-width:1280px;margin:0 auto;padding:0 4.5rem;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.nav-logo{pointer-events:auto;justify-self:start;display:flex;align-items:center;gap:0.625rem;font-family:'Sora','Ruda',system-ui,sans-serif;font-size:1.875rem;font-weight:800;letter-spacing:-0.08em;color:#121212;text-decoration:none}
.nav-logo:hover{color:#121212}
.nav-links{pointer-events:auto;display:flex;gap:2px;font-size:0.8125rem;font-weight:700}
.nav-link{display:flex;align-items:center;gap:0.5rem;padding:0.625rem 1.125rem;border-radius:999px;line-height:1;justify-content:center;color:var(--ink);background:transparent;text-decoration:none}
.nav-link:hover,.nav-link.is-active{background:var(--cream-chip);color:var(--ink)}
.nav-link-wrap{position:relative}
.nav-badge-new--blog{top:-15px;right:-18px}
.nav-badge-new{position:absolute;top:-16px;right:-22px;padding:0.1875rem 0.4375rem;border-radius:999px;background:var(--accent);color:#fff;font-size:0.5313rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;white-space:nowrap;line-height:1}
.nav-right{grid-column:3;justify-self:end;display:flex;align-items:center;gap:0.875rem;pointer-events:auto}
.nav-cta{pointer-events:auto;justify-self:end;display:flex;align-items:center;gap:0.875rem;color:var(--ink);font-size:0.8125rem;font-weight:700;text-decoration:none;white-space:nowrap;flex-shrink:0}
.lang{position:relative;pointer-events:auto;flex-shrink:0}
.lang-btn{display:inline-flex;align-items:center;justify-content:center;gap:0.375rem;height:2.375rem;padding:0 0.6875rem 0 0.875rem;border:1.5px solid var(--ink);border-radius:999px;background:transparent;color:var(--ink);font-family:inherit;font-size:0.8125rem;font-weight:700;letter-spacing:0.02em;line-height:1;cursor:pointer;transition:background .15s,color .15s}
.lang.is-open .lang-btn{background:var(--ink);color:var(--cream)}
@media (hover:hover){.lang-btn:hover{background:var(--ink);color:var(--cream)}}
@media (max-width:1200px){.nav-inner{padding:0 2.5rem}}
@media (max-width:1439px){.nav-cta{display:none}}
.lang-chev{transition:transform .2s}
.lang.is-open .lang-chev{transform:rotate(180deg)}
.lang-menu{position:absolute;top:calc(100% + 0.5rem);right:0;z-index:60;min-width:100%;margin:0;padding:0.3rem;list-style:none;background:var(--cream);border:0;border-radius:14px;box-shadow:0 14px 34px rgba(0,0,0,0.22)}
.lang-item{display:flex;align-items:center;gap:0.625rem;padding:0.5rem 0.75rem;border-radius:10px;color:var(--ink);font-size:0.8125rem;font-weight:700;text-decoration:none;white-space:nowrap}
.lang-item:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.lang-item-name{font-weight:400;opacity:.7;font-size:0.75rem}
@media (max-width:1100px){.nav-right{gap:0.625rem}.lang-btn{height:52px;min-width:52px;padding:0 0.875rem;border-radius:18px 4px 18px 4px;font-size:0.9375rem}.lang-menu{top:calc(100% + 0.5rem);border-radius:18px 4px 18px 4px;padding:0.4rem}.lang-item{padding:0.7rem 0.9rem;font-size:0.9375rem}}
.nav-cta:hover{color:var(--accent)}
.nav-burger{pointer-events:auto;grid-column:3;justify-self:end;display:none;flex-direction:column;align-items:center;justify-content:center;gap:0.375rem;width:52px;height:52px;border:0;border-radius:18px 4px 18px 4px;background:var(--ink);cursor:pointer;padding:0}
.nav-burger i{display:block;width:22px;height:3px;border-radius:2px;background:#fff}
.menu{position:fixed;inset:0;z-index:70;background:var(--bg);color:var(--fg);font-family:'Ruda',system-ui,sans-serif;display:none;flex-direction:column;animation:bp-reveal .35s ease both}
.menu.is-open{display:flex}
.menu.is-closing{display:flex;pointer-events:none;animation:bp-hide .32s cubic-bezier(.4,0,1,1) both}
.menu.is-closing .menu-link{animation:bp-hide .26s cubic-bezier(.4,0,1,1) both;animation-delay:calc(0.03s * var(--i,1))}
.menu-head{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:1.0625rem 1.5rem}
.menu-logo:hover{color:var(--fg)}
.menu-logo{font-family:'Sora','Ruda',system-ui,sans-serif;font-size:1.875rem;font-weight:800;letter-spacing:-0.08em;color:var(--fg);text-decoration:none}
.menu-close{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border:0;border-radius:18px 4px 18px 4px;background:var(--cream);color:var(--ink);font-size:1.25rem;font-weight:700;cursor:pointer;padding:0}
.menu-links{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.5rem;padding:1.5rem;text-align:center;overflow-y:auto}
/* menu je fixed cez celú obrazovku, plátno teda netreba naťahovať cez 100vw ako v sekciách */
.menu > .liquid-bg{left:0;width:100%}
.menu > .liquid-bg.is-on{opacity:1}
.menu-link{position:relative;display:inline-block;font-size:clamp(34px,9vw,56px);font-weight:400;letter-spacing:-0.03em;line-height:1.1;color:var(--fg);text-decoration:none;animation:bp-reveal .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(0.08s * var(--i,1))}
.menu-link:hover{color:var(--accent)}
.menu-link-dot{position:absolute;top:-6px;right:-14px;width:10px;height:10px;border-radius:50%;background:var(--accent)}

.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden}
.hero-media{position:absolute;inset:0;background:#14181b;overflow:hidden}
/* video sa nenaťahuje: drží natívny pomer, výškou vypĺňa hero a stojí v strede; boky sa prelínajú do čiernej stránky */
/* video sa v prehliadači NIKDY nezväčšuje: ide v natívnom rozlíšení (alebo sa zmenší, keď je hero nižšie),
   stojí v strede pri spodku a jeho okraje rozplynie maska do čiernej stránky – zvyšok plochy dopĺňa CSS čierna */
.hero-media img,.hero-media video{position:absolute;bottom:0;left:50%;height:auto;width:auto;max-height:100%;max-width:none;transform:translate(-50%,10%);display:block;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 16%,#000 84%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 5%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 16%,#000 84%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 5%,#000 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
/* svetlý klip (hero--full): vyplní celé hero, bez bočných masiek, len jemný prechod pod textom */
.hero--full .hero-media img,.hero--full .hero-media video{top:0;left:0;bottom:auto;width:100%;height:100%;max-height:none;object-fit:cover;transform:none;-webkit-mask-image:none;mask-image:none}
.hero--full .hero-shade{background:linear-gradient(180deg,rgba(10,10,10,0.22) 0%,rgba(10,10,10,0) 35%,rgba(10,10,10,0.72) 78%,#0a0a0a 100%)}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,10,0.55) 0%,rgba(10,10,10,0.15) 40%,rgba(10,10,10,0.85) 80%,#0a0a0a 100%);pointer-events:none}
.hero-inner{position:relative;width:100%;max-width:1280px;margin:0 auto;padding:0 4.5rem 6rem;display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:3.5rem;align-items:end;pointer-events:none}
.hero-title{grid-column:1/11;margin:0;font-size:clamp(52px,min(9.4vw,16svh),150px);font-weight:400;line-height:0.95;letter-spacing:-0.035em;pointer-events:auto}
.hero-tags{grid-column:1/7;display:flex;gap:2.25rem;font-size:0.8125rem;color:#e6e6e6;pointer-events:auto}
.hero-tag{display:flex;align-items:center;gap:0.625rem}
.hero-text{grid-column:8/13;font-size:0.9375rem;line-height:1.5;color:var(--fg);max-width:380px;pointer-events:auto}
.hero-since{color:var(--accent)}

.main{max-width:1280px;margin:0 auto;padding:0 4.5rem}
.g12{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:2.5rem}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.grid-3{grid-column:1/13;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.grid-4{grid-column:1/13;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.section-title{grid-column:1/13;margin:0;font-size:clamp(36px,4vw,56px);font-weight:400;letter-spacing:-0.025em;line-height:1.05;color:var(--fg)}
.section-text{grid-column:1/8;margin:0 0 1.5rem;font-size:1.0625rem;line-height:1.5;color:var(--muted2)}
.band{padding:120px calc(50vw - 50%);margin:0 0 200px calc(50% - 50vw);width:100vw;box-sizing:border-box;background:var(--cream);color:var(--ink)}
.band .section-title{color:var(--ink)}
.band .section-text{color:var(--ink-muted)}
.band--mb160{margin-bottom:10rem}
.band--mb0{margin-bottom:0}
.band--pb120{padding-bottom:7.5rem}
.sec-pb160{padding:0 0 10rem}
.sec-pb200{padding:0 0 12.5rem}
.sec-pb80{padding-bottom:5rem}
.sec-pb40{padding:0 0 2.5rem}
.kicker{display:flex;align-items:center;gap:0.625rem;font-size:0.8125rem;color:var(--muted);height:24px}

.works{display:grid;grid-template-columns:repeat(2,1fr);gap:6rem 1.5rem;align-items:start}
.works--band{padding:120px calc(50vw - 50%) 140px;margin:0 0 200px calc(50% - 50vw);width:100vw;box-sizing:border-box;background:var(--cream);color:var(--ink)}
.works--band .section-title{grid-column:1/3;margin:0 0 -2rem;color:var(--ink)}
.works--band:has(.section-text) .section-title{margin:0}
.works--band .section-text{grid-column:1/3;margin:-4.5rem 0 -2rem;max-width:62ch;color:var(--ink-muted)}
.works--page{padding:0 0 8.75rem}
.work-wrap--wide{grid-column:1/3}
.work{display:flex;flex-direction:column;gap:1.5rem;will-change:transform;color:var(--fg)}
.work:hover{color:var(--fg)}
.works--band .work,.works--band .work:hover{color:var(--ink)}
.work-media{position:relative;aspect-ratio:16/10;border-radius:var(--radius);overflow:hidden;background:var(--card)}
.work-media--wide{aspect-ratio:2/1}
.work-media--wide img,.work-media--wide video{object-position:center top}
.work-media img,.work-media video{width:100%;height:100%;object-fit:cover;display:block}
.work-badge{position:absolute;top:20px;left:20px;padding:0.5rem 0.875rem;border-radius:999px;background:var(--accent);color:#fff;font-size:0.75rem;font-weight:700;pointer-events:none}
.work-meta{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.work-meta-left{display:flex;align-items:center;gap:0.875rem}
.work-meta-left--wrap{flex-wrap:wrap}
.work-client{padding:0.3125rem 0.625rem;border-radius:6px;background:var(--chip-dark);color:var(--muted2);font-size:0.6875rem;font-weight:700;white-space:nowrap}
.works--band .work-client{background:var(--cream-chip);color:var(--ink)}
.work-title{font-size:1.0625rem;font-weight:700;letter-spacing:-0.01em}
.work-title--wide{font-size:clamp(17px,1.8vw,24px)}

.svc{display:flex;flex-direction:column;justify-content:space-between;gap:3rem;min-height:280px;padding:1.75rem;border-radius:var(--radius);background:var(--card);color:var(--fg)}
.svc:hover{background:var(--card-hover);color:var(--fg)}
.svc-head{display:flex;flex-direction:column;gap:1.25rem}
.svc-body{display:flex;flex-direction:column;gap:0.75rem}
.svc-title{font-size:1.3125rem;font-weight:700;letter-spacing:-0.01em;line-height:1.2}
.svc-desc{font-size:0.8438rem;line-height:1.55;color:var(--muted2)}
.chips{display:flex;flex-wrap:wrap;gap:0.375rem}
.chip{padding:0.3125rem 0.625rem;border-radius:999px;border:1px solid var(--line);font-size:0.7188rem;color:var(--muted2)}
.svc--accent{grid-column:span 2;background:var(--accent);color:#fff}
.svc--accent:hover{background:var(--accent-dark);color:#fff}
.svc--accent .svc-head{gap:0.75rem}
.svc-accent-top{display:flex;align-items:center;justify-content:space-between;gap:0.75rem}
.svc-accent-name{display:flex;align-items:center;gap:1rem}
.svc--accent .svc-title{font-size:1.75rem}
.svc--accent .svc-desc{font-size:0.9375rem;color:rgba(255,255,255,0.85);max-width:460px}
.svc--accent .chip{border-color:rgba(255,255,255,0.45);color:#fff}
.badge-new{padding:0.3125rem 0.625rem;border-radius:999px;background:#fff;color:var(--accent);font-size:0.6875rem;font-weight:700;white-space:nowrap}

.ai-card{display:flex;flex-direction:column;gap:1.25rem;min-height:220px;padding:1.75rem;border-radius:var(--radius);background:#fff;color:var(--ink)}
.ai-card:hover{background:#fbfaf6;color:var(--ink)}
.ai-card-body{display:flex;flex-direction:column;gap:0.625rem}
.ai-card-title{font-size:1.1875rem;font-weight:700;letter-spacing:-0.01em;line-height:1.2}
.ai-card-desc{font-size:0.8438rem;line-height:1.55;color:var(--ink-muted)}
.ai-card--accent{justify-content:space-between;background:var(--accent);color:#fff}
.ai-card--accent:hover{background:var(--accent-dark);color:#fff}
.ai-card-top{display:flex;align-items:center;justify-content:space-between}
.ai-card--accent .ai-card-title{font-size:1.375rem}
.ai-card--accent .ai-card-desc{color:rgba(255,255,255,0.85)}
.ai-card--compact{justify-content:space-between;gap:1.5rem;min-height:180px;padding:1.5rem}
.ai-card--compact .ai-card-title{font-size:1.0625rem;line-height:1.3;letter-spacing:0}
.ai-card-arrow{color:var(--accent)}

.client-logo{aspect-ratio:4/3;border-radius:var(--radius);background:var(--card);display:flex;align-items:center;justify-content:center;color:#e6e6e6}
.client-logo--img{padding:1.5rem;overflow:hidden;box-sizing:border-box}
.client-logo--img img{max-width:70%;max-height:60%;width:auto;height:auto;object-fit:contain}
.client-logo--img{position:relative}
.client-logo--brand{transition:transform .25s ease}
a.client-logo--brand:hover{transform:translateY(-3px)}
.client-badge{position:absolute;top:0.75rem;left:0.75rem;padding:0.3125rem 0.625rem;border-radius:999px;background:#f57f20;color:#fff;font-size:0.625rem;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;line-height:1.3;white-space:nowrap}
.client-text{white-space:pre-line}
.client-circle{width:64px;height:64px;border-radius:50%;border:2px solid #e6e6e6;display:flex;align-items:center;justify-content:center}
.client-dot{display:inline-block;width:14px;height:14px;border-radius:50%;background:var(--muted)}
.client-row{display:flex;align-items:center;justify-content:center}

.marquee{grid-column:1/13;overflow:hidden;cursor:grab;touch-action:pan-y}
.marquee.is-dragging{cursor:grabbing}
.marquee-track{display:flex;gap:1rem;will-change:transform}
.marquee .client-logo{flex:0 0 calc((100% - 3rem) / 4)}
.carousel-wrap{grid-column:1/13;overflow:hidden}
.carousel{touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.carousel.is-dragging{cursor:grabbing}
.marquee,.clients-grid,.client-logo{user-select:none;-webkit-user-select:none}
.carousel a,.carousel img,.marquee a,.marquee img{-webkit-user-drag:none}
/* pri touch-tahani karuselov nesmie nic modro presvitat ani vyskocit nahlad obrazka */
img{-webkit-user-drag:none;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
a,button,.carousel,.marquee,.client-logo{-webkit-tap-highlight-color:transparent}
.carousel{display:flex;gap:1rem;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
/* Karusel sa nespustí, keď sa všetky karty zmestia naraz (desktop 3 => treba 4+ článkov, mobil 1 => 2+).
   Klony sú v HTML vždy, tu sa iba skryjú, aby sa karty nezobrazovali dvakrát. */
.carousel.is-static{transform:none!important;cursor:default;transition:none}
.carousel.is-static > [data-clone]{display:none}
.carousel-dots.is-hidden{display:none}
.carousel.no-anim{transition:none}
.post-card{position:relative;flex:0 0 calc((100% - 16px * (var(--per,3) - 1)) / var(--per,3));display:flex;flex-direction:column;justify-content:space-between;gap:3rem;min-height:300px;padding:2.25rem;border-radius:var(--radius);background:#fff;color:var(--ink);box-sizing:border-box}
.post-card:hover{background:#fafafa;color:var(--ink)}
.post-card--grid{flex:none;box-sizing:content-box}
.post-card--dark{background:var(--card);color:var(--fg)}
.post-card--dark:hover{background:var(--card-hover);color:var(--fg)}
.post-cat{font-size:0.75rem;color:var(--muted)}
/* zelený pill „NOVÝ ČLÁNOK“ – článok mladší ako NAV_BLOG_BADGE_DAYS, pravý horný roh karty (zarovnaný s kategóriou) */
.post-new{position:absolute;top:1.875rem;right:2.25rem;padding:0.375rem 0.75rem;border-radius:999px;background:var(--accent);color:#fff;font-size:0.6875rem;font-weight:700;letter-spacing:0.04em;line-height:1.3;white-space:nowrap;pointer-events:none}
.post-body{display:flex;flex-direction:column;gap:1.25rem}
.post-title{font-size:1.5rem;font-weight:700;line-height:1.3;letter-spacing:-0.01em}
.post-more{display:inline-flex;align-items:center;gap:0.625rem;width:max-content;padding:0.5625rem 1rem;border-radius:999px;border:1px solid var(--cream-line);font-size:0.7813rem;font-weight:700;color:var(--ink);transition:all .2s}
.post-more span{color:var(--accent)}
.post-card .post-more:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.post-card--dark .post-more{border-color:var(--line);color:var(--fg)}
.post-card--dark .post-more:hover{background:var(--fg);color:var(--ink);border-color:var(--fg)}
/* na hover-i tlačidlo zosvetlie na #f2f2f2 – zelená šípka by na ňom mala len 2,22:1, preto je čierna (17,68:1) */
.post-card--dark .post-more:hover span{color:var(--ink)}
/* zelená varianta karty – striedanie s tmavou v mriežke na /blog (render_post_card($order)).
   Karusel na úvode ju nikdy nedostane ($order = null), preto sa jeho vzhľad nemení.
   Kontrast (WCAG 2.x, merané v includes/render.php::color_contrast):
   #0a0a0a na #8db04f = 7,97:1 · na #7a9b42 (hover) = 6,22:1 · #1e2614 na #8db04f = 6,30:1
   · pill #0a0a0a/#fff = 19,80:1 · pill vs. karta = 7,97:1 */
.post-card--accent{background:var(--accent);color:var(--ink)}
.post-card--accent:hover{background:var(--accent-dark);color:var(--ink)}
.post-card--accent .post-cat{color:#1e2614}
.post-card--accent .post-new{background:var(--ink);color:#fff}
.post-card--accent .post-more{background:var(--ink);border-color:var(--ink);color:#fff}
.post-card--accent .post-more:hover{background:#fff;border-color:#fff;color:var(--ink)}
.post-card--accent .post-more:hover span{color:var(--ink)}
/* biely text na zelenom pille má len 2,48:1 – v mriežke blogu ho preto stmavíme na 7,97:1 */
.post-card--dark .post-new{color:var(--ink)}
.carousel-dots{grid-column:1/13;display:flex;justify-content:center;gap:0.625rem}
.dot-btn{width:10px;height:10px;border-radius:50%;border:0;padding:0;cursor:pointer;background:var(--cream-line)}
.dot-btn.is-active{background:var(--accent)}
.posts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding-bottom:5rem}

.sec-team{padding:12.5rem 0 2.5rem;scroll-margin-top:-5rem}
.team-grid{grid-column:1/13;display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem 1rem}
.member{display:flex;flex-direction:column;gap:1rem}
.member-photo{aspect-ratio:3/4;border-radius:var(--radius);overflow:hidden;background:var(--card)}
.member-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.member-info{display:flex;flex-direction:column;gap:0.25rem}
.member-name{font-size:1.0625rem;font-weight:700}
.member-role{font-size:0.8125rem;color:var(--muted)}
.team-join{grid-column:1/7;display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:1.5rem;row-gap:0.375rem;margin:1.5rem 0 0;padding:1.25rem 1.25rem 1.25rem 1.5rem;border-radius:var(--radius);background:var(--cream);color:var(--ink)}
.team-join-title{grid-column:1;font-size:1.0625rem;font-weight:700;letter-spacing:-0.015em;line-height:1.25}
.team-join-text{grid-column:1;font-size:0.8125rem;line-height:1.5;color:var(--ink-muted)}
.team-join .btn-dark-sm{grid-column:2;grid-row:1/3;flex:none}
.btn-dark-sm{display:inline-flex;align-items:center;gap:0.875rem;width:max-content;padding:0.5rem 0.5rem 0.5rem 1.375rem;border-radius:999px;background:var(--ink);color:#fff;font-size:0.8125rem;font-weight:700;white-space:nowrap}
.btn-dark-sm:hover{background:var(--ink);color:#fff}
.btn-light-sm{display:inline-flex;align-items:center;gap:0.875rem;width:max-content;padding:0.5rem 0.5rem 0.5rem 1.375rem;border-radius:999px;background:#fff;color:var(--ink);font-size:0.8125rem;font-weight:700;white-space:nowrap}
.btn-light-sm:hover{background:#fff;color:var(--ink)}
.btn-accent{display:inline-flex;align-items:center;gap:0.875rem;padding:0.5rem 0.5rem 0.5rem 1.5rem;border-radius:999px;background:var(--accent);color:#fff;font-size:0.875rem;font-weight:700;white-space:nowrap}
.btn-accent:hover{background:var(--accent-dark);color:#fff}
.btn-accent--15{font-size:0.9375rem}
.btn-black{display:inline-flex;align-items:center;gap:0.875rem;padding:0.5rem 0.5rem 0.5rem 1.5rem;border-radius:999px;background:var(--ink);color:#fff;font-size:0.9375rem;font-weight:700;white-space:nowrap;transition:transform .2s}
.btn-black:hover{background:var(--ink);color:#fff;transform:translateY(-2px)}
.btn-outline{display:inline-flex;align-items:center;padding:0.875rem 1.375rem;border-radius:999px;border:1px solid var(--line);font-size:0.875rem;font-weight:700;color:var(--fg)}
.btn-outline:hover{border-color:var(--accent);color:var(--accent)}
.note-pill{display:inline-flex;align-items:center;padding:0 1.125rem;border-radius:999px;border:1px solid var(--line);font-size:0.8125rem;color:var(--muted2);white-space:nowrap}

.modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:1.5rem;background:rgba(10,10,10,0.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:opacity .3s ease,visibility .3s;opacity:0;visibility:hidden;pointer-events:none}
.modal.is-open{opacity:1;visibility:visible;pointer-events:auto}
.modal-box{width:100%;max-width:640px;max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);overflow:auto;border-radius:24px;background:var(--cream);color:var(--ink);padding:2.5rem;box-sizing:border-box;display:flex;flex-direction:column;gap:1.75rem;transform:translateY(24px) scale(.98);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.modal.is-open .modal-box{transform:translateY(0) scale(1)}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}
.modal-head-text{display:flex;flex-direction:column;gap:0.5rem}
.modal-kicker{font-size:0.8125rem;color:var(--ink-muted)}
.modal-title{margin:0;font-size:2rem;font-weight:400;letter-spacing:-0.025em;line-height:1.05}
.modal-close{flex:none;width:40px;height:40px;border-radius:50%;border:0;background:#fff;color:var(--ink);font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
.form{display:flex;flex-direction:column;gap:0.75rem}
.input{padding:1.125rem 1.25rem;border-radius:14px;border:1px solid var(--cream-line);background:#fff;color:var(--ink);font-size:0.9375rem;outline:none;font-family:inherit;min-width:0}
.input::placeholder{color:#9a9a9a}
.input:focus{border-color:var(--accent)}
.input.is-invalid{border-color:#d9534f}
/* iOS zoomne stránku pri fokuse na pole menšie ako 16px – na dotyku ho zväčšíme */
@media (pointer:coarse){
  .input,textarea,select,input[type=text],input[type=email],input[type=tel],input[type=search],input[type=number],input[type=password]{font-size:16px}
}
textarea.input{resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem}
.form-group{display:flex;flex-direction:column;gap:0.625rem;padding:0.375rem 0 0.25rem}
.form-label{font-size:0.8125rem;color:var(--ink-muted)}
.chip-btns{display:flex;flex-wrap:wrap;gap:0.5rem}
.chip-btn{padding:0.625rem 1rem;border-radius:999px;border:1.5px solid var(--cb-border);background:#fff;color:var(--ink);font-size:0.8125rem;font-weight:700;cursor:pointer;font-family:inherit;transition:all .15s}
.chip-btn.is-on{border-color:var(--accent);background:var(--accent);color:#fff}
.gdpr{display:flex;align-items:flex-start;gap:0.875rem;padding:0.375rem 0 0.625rem;cursor:pointer;font-size:0.8438rem;line-height:1.5;color:var(--ink-muted)}
.gdpr a{color:var(--accent)}
.gdpr input{position:absolute;opacity:0;width:0;height:0}
.checkbox{flex:none;width:24px;height:24px;border-radius:7px;border:1.5px solid var(--cb-border);background:#fff;display:flex;align-items:center;justify-content:center;margin-top:1px;transition:all .15s}
.checkbox svg{opacity:0}
.gdpr input:checked + .checkbox{border-color:var(--accent);background:var(--accent)}
.gdpr input:checked + .checkbox svg{opacity:1}
.gdpr input:focus-visible + .checkbox{outline:2px solid var(--accent);outline-offset:2px}
.btn-submit{display:inline-flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:0.5rem 0.5rem 0.5rem 1.5rem;border-radius:999px;border:0;background:var(--ink);color:#fff;font-size:0.875rem;font-weight:700;cursor:pointer;font-family:inherit;opacity:.5;transition:opacity .2s}
.btn-submit.is-ready{opacity:1}
.btn-submit:disabled{cursor:default}
.btn-submit.is-sending{opacity:.6;pointer-events:none}
.form-error{font-size:0.8125rem;color:#b3261e;display:none}
.form-error.is-visible{display:block}
.form-success{display:flex;flex-direction:column;gap:0.875rem;padding:2rem;border-radius:var(--radius);background:#fff}
.success-check{width:48px;height:48px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.125rem}
.success-title{font-size:1.375rem;font-weight:700;letter-spacing:-0.01em}
.success-text{font-size:0.875rem;line-height:1.55;color:var(--ink-muted)}
.file-pick{display:flex;align-items:center;gap:1rem;padding:1rem 1.125rem;border-radius:14px;border:1.5px dashed var(--cb-border);background:#fff;cursor:pointer;transition:border-color .2s}
.file-pick.has-file{border-color:var(--accent)}
.file-pick input{display:none}
.file-icon{flex:none;width:44px;height:52px;position:relative;display:flex;align-items:flex-end;justify-content:center}
.file-text{display:flex;flex-direction:column;gap:0.25rem;min-width:0}
.file-name{font-size:0.875rem;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-hint{font-size:0.7813rem;color:var(--muted)}

/* Otázky a odpovede nad pätičkou (obsahový AEO blok). Tmavé, na rozdiel od krémových
   partnerov – nadväzuje na pätičku. <details>/<summary> je natívny accordion:
   funguje bez JS, ovláda sa klávesnicou a Google číta odpoveď aj keď je zavretá. */
.faq{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:2rem;padding:2.5rem 0 1rem}
.faq-head{grid-column:1/6;display:flex;flex-direction:column;gap:1rem}
.faq-title{margin:0;font-size:clamp(30px,3.2vw,44px);font-weight:400;letter-spacing:-0.025em;line-height:1.05}
.faq-text{margin:0;font-size:0.9375rem;line-height:1.55;color:var(--muted2);max-width:22rem}
.faq-list{grid-column:7/13;display:flex;flex-direction:column}
.faq-item{border-top:1px solid var(--line)}
.faq-item:last-child{border-bottom:1px solid var(--line)}
.faq-item summary{display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;padding:1.35rem 0;cursor:pointer;list-style:none;font-size:1.0625rem;font-weight:700;line-height:1.35;transition:color .15s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--accent)}
.faq-item summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:4px}
/* znamienko + / − nakreslené cez ::before a ::after, nech netreba ikonu ani SVG */
.faq-sign{position:relative;flex:none;width:20px;height:20px;margin-top:0.15rem}
.faq-sign::before,.faq-sign::after{content:"";position:absolute;left:50%;top:50%;background:currentColor;transform:translate(-50%,-50%);transition:opacity .2s,transform .2s}
.faq-sign::before{width:14px;height:2px}
.faq-sign::after{width:2px;height:14px}
.faq-item[open] .faq-sign::after{opacity:0;transform:translate(-50%,-50%) rotate(90deg)}
.faq-answer{padding:0 0 1.35rem;max-width:34rem}
.faq-answer p{margin:0;font-size:0.9375rem;line-height:1.6;color:var(--muted2)}
@media (max-width:960px){
  .faq{padding-top:1.5rem;row-gap:1.5rem}
  .faq-head,.faq-list{grid-column:1/13}
  .faq-text{max-width:none}
}
@media (max-width:640px){
  /* Nadpis podstránky: „odpovede" má ísť na druhý riadok. Selektor je zdvojený a s !important,
     lebo mobilné pravidlo [data-cols="12"] > * nastavuje max-width:100%!important. */
  .page-head .page-title--faq{max-width:10ch!important}
}
@media (prefers-reduced-motion:reduce){.faq-sign::before,.faq-sign::after{transition:none}}
.partners{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:2.5rem;align-items:center;padding:72px calc(50vw - 50%);margin:120px 0 0 calc(50% - 50vw);width:100vw;box-sizing:border-box;background:var(--cream);color:var(--ink)}
.partners-left{grid-column:1/6;display:flex;flex-direction:column;gap:1.25rem}
.partners-kicker{font-size:0.8125rem;color:var(--ink-muted)}
.partners-title{margin:0;font-size:clamp(36px,4vw,56px);font-weight:400;letter-spacing:-0.025em;line-height:1.05}
.partners-text{margin:0;font-size:0.875rem;line-height:1.55;color:var(--ink-muted);max-width:400px}
.partners-right{grid-column:7/13;display:flex;flex-direction:column;gap:2rem}
.partner{display:flex;align-items:center;gap:1.5rem}
.partner--first{padding-bottom:1.75rem;border-bottom:1px solid var(--cream-line)}
.partner img{width:180px;height:auto;display:block;mix-blend-mode:multiply;flex:none}
.partner-body{display:flex;flex-direction:column;gap:0.25rem}
.partner-name{font-size:0.9375rem;font-weight:700}
.partner-desc{font-size:0.8125rem;line-height:1.5;color:var(--ink-muted)}
.footer{font-family:'Ruda',system-ui,sans-serif;color:var(--fg);padding:7.5rem 0 3.5rem;display:flex;flex-direction:column;gap:4rem}
.footer--liquid{position:relative;isolation:isolate}
.footer--liquid > *:not(.liquid-bg){position:relative;z-index:1}
.footer--liquid .liquid-bg.is-on{opacity:0.4}
.footer-contact{display:flex;flex-direction:column;gap:1.5rem}
.footer-kicker{font-size:0.8125rem;color:var(--muted)}
.footer-title{margin:0;font-size:clamp(40px,4.6vw,66px);font-weight:400;letter-spacing:-0.02em;line-height:1.05}
.footer-text{margin:0;max-width:640px;font-size:1rem;line-height:1.55;color:#e0e0e0}
.footer-row{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;align-items:center;margin-top:2.5rem}
.btn-pill{grid-column:1/4;display:inline-flex;align-items:center;justify-content:space-between;gap:1.5rem;width:max-content;padding:0.5rem 0.5rem 0.5rem 1.5rem;border-radius:999px;background:var(--card);color:var(--fg);font-size:0.8125rem;font-weight:700;text-decoration:none}
.btn-pill:hover{color:var(--fg);background:var(--card-hover)}
.btn-pill-label{padding-right:5rem;white-space:nowrap}
.footer-col{display:flex;flex-direction:column;gap:0.625rem;min-width:0}
.footer-col--email{grid-column:5/9}
.footer-col--phone{grid-column:9/13}
.footer-col-label{font-size:0.8125rem;color:var(--muted)}
.footer-col a{font-size:clamp(15px,1.6vw,22px);color:var(--fg);text-decoration:none;white-space:nowrap}
.footer-col a:hover{color:var(--fg)}
.footer-bottom{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:4rem;align-items:end;margin-top:7.5rem;font-size:0.8125rem}
.socials{position:relative;grid-column:10/13;display:flex;gap:0.75rem;justify-self:end}
.social{width:56px;height:56px;border-radius:10px;background:var(--card);display:flex;align-items:center;justify-content:center;color:var(--fg);font-size:0.6875rem;font-weight:700;text-decoration:none}
.social:hover{background:var(--accent);color:#fff}
.social--soon{appearance:none;border:0;padding:0;font-family:inherit;cursor:default}
.social--soon:hover{background:var(--card);color:var(--fg)}
.social-tip{position:absolute;bottom:calc(100% + 0.875rem);left:0;width:max-content;max-width:min(19rem,calc(100vw - 2rem));padding:0.75rem 1rem;border-radius:14px;background:var(--fg);color:var(--ink);font-size:0.8125rem;font-weight:700;line-height:1.35;text-align:center;box-shadow:0 18px 40px rgba(0,0,0,0.35);opacity:0;visibility:hidden;transform:translateY(8px) scale(.94);transform-origin:var(--tip-x,50%) 100%;transition:opacity .28s ease,transform .32s cubic-bezier(.2,.8,.2,1),visibility .28s;pointer-events:none;z-index:2}
.social-tip::after{content:"";position:absolute;top:100%;left:var(--tip-x,50%);margin-left:-7px;border:7px solid transparent;border-top-color:var(--fg)}
.social-tip.is-visible{opacity:1;visibility:visible;transform:none}
@media (prefers-reduced-motion:reduce){.social-tip{transition:none}}
.copyright{grid-column:1/4;color:var(--muted2);white-space:nowrap}
.based{grid-column:4/6;color:var(--muted2);white-space:nowrap}
/* Oba právne odkazy v jednom riadku vpravo. Odkaz sám o sebe už nie je grid položka –
   keď ich bolo viac s rovnakým grid-column, grid ich ukladal pod seba. */
.footer-links{grid-column:6/13;justify-self:end;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:0.75rem 2.5rem}
.footer-gdpr{color:var(--accent);text-decoration:none;white-space:nowrap}
@media (max-width:1279px){.copyright{grid-column:1/5}.based{grid-column:5/8}}

.cc{position:fixed;left:24px;bottom:24px;z-index:90;width:min(300px,calc(100vw - 78px));padding:0.875rem;border-radius:14px;background:var(--card);color:var(--fg);border:1px solid var(--line);box-shadow:0 24px 60px rgba(0,0,0,0.5);display:flex;flex-direction:column;gap:0.75rem;transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .35s ease,visibility .35s;transform:translateY(24px);opacity:0;visibility:hidden;pointer-events:none;font-family:'Ruda',system-ui,sans-serif}
.cc.is-open{transform:translateY(0);opacity:1;visibility:visible;pointer-events:auto}
.cc-head{display:flex;align-items:flex-start;gap:0.75rem}
.cc-icon{flex:none;width:30px;height:30px;border-radius:8px;background:var(--chip-dark);display:flex;align-items:center;justify-content:center}
.cc-body{display:flex;flex-direction:column;gap:0.375rem}
.cc-title{font-size:0.8125rem;font-weight:700;letter-spacing:-0.01em}
.cc-text{font-size:0.7188rem;line-height:1.45;color:var(--muted)}
.cc-text a{color:var(--accent);text-decoration:none}
.cc-cats{display:none;flex-direction:column;gap:0.5rem}
.cc.is-settings .cc-cats{display:flex}
.cc-cat{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0.625rem 0.75rem;border-radius:10px;background:var(--chip-dark);border:0;cursor:pointer;font-family:inherit;text-align:left;color:var(--fg)}
.cc-cat--locked{cursor:default}
.cc-cat-text{display:flex;flex-direction:column;gap:2px}
.cc-cat-title{font-size:0.7813rem;font-weight:700}
.cc-cat-desc{font-size:0.6875rem;color:var(--muted)}
.switch{flex:none;width:40px;height:24px;border-radius:999px;background:#3a3a3a;position:relative;transition:background .2s}
.switch i{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .2s}
.switch.is-on{background:var(--accent)}
.switch.is-on i{left:19px}
.switch--locked{background:var(--fg);opacity:.3}
.switch--locked i{left:19px}
.cc-actions{display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap}
.cc-accept{display:inline-flex;align-items:center;gap:0.75rem;padding:0.25rem 0.25rem 0.25rem 0.75rem;border-radius:999px;border:0;background:var(--fg);color:var(--ink);font-size:0.7188rem;font-weight:700;cursor:pointer;font-family:inherit}
.cc-btn{padding:0.5rem 0.75rem;border-radius:999px;border:0;background:var(--chip-dark);color:var(--fg);font-size:0.7188rem;font-weight:700;cursor:pointer;font-family:inherit}
.cc-ghost{padding:0.5rem 0.5rem;border-radius:999px;border:0;background:transparent;color:var(--muted);font-size:0.7188rem;font-weight:700;cursor:pointer;font-family:inherit}
.cc-save{display:none}
.cc.is-settings .cc-save{display:inline-block}
.cc.is-settings .cc-btn--settings,.cc.is-settings .cc-ghost{display:none}
.cc-fab{position:fixed;left:24px;bottom:24px;z-index:89;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--card);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(0,0,0,0.4);transition:opacity .3s ease,transform .3s ease;opacity:0;transform:scale(.8);pointer-events:none;padding:0}
.cc-fab.is-visible{opacity:1;transform:scale(1);pointer-events:auto}

.page-head{padding:13.75rem 0 8.75rem;display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:3rem;align-items:end}
.page-head--works{padding:12.5rem 0 0}
.page-head--detail{padding:12.5rem 0 5rem;row-gap:2.5rem}
.page-head--120{padding:13.75rem 0 7.5rem;row-gap:2.5rem}
.page-head--liquid{position:relative;isolation:isolate}
.page-head--liquid > *:not(.liquid-bg){position:relative;z-index:1}
.liquid-bg{background:var(--bg);position:absolute;top:0;bottom:0;left:calc(50% - 50vw);width:100vw;height:100%;z-index:0;display:block;opacity:0;transition:opacity .8s ease;pointer-events:none}
.liquid-bg.is-on{opacity:1}
.page-head--contact{padding:13.75rem 0 7.5rem;row-gap:3rem}
.page-head--legal{padding:13.75rem 0 6.25rem;row-gap:2.5rem}
.page-head--article{padding:12.5rem 0 4rem;row-gap:2rem}
.page-title{grid-column:1/9;margin:0;font-size:clamp(64px,8.5vw,132px);font-weight:400;line-height:0.95;letter-spacing:-0.035em}
.page-title--10{grid-column:1/10}
.page-title--11{grid-column:1/11}
.page-title--md{font-size:clamp(56px,7.5vw,120px)}
.page-title--sm{font-size:clamp(48px,6.5vw,104px);line-height:0.98}
.page-title--article{font-size:clamp(40px,5.5vw,84px);line-height:1.02;letter-spacing:-0.03em}
.page-lead{grid-column:9/13;margin:0;font-size:0.9375rem;line-height:1.5;color:var(--muted2);max-width:340px}
.page-lead--wide{grid-column:1/8;font-size:1.0625rem;line-height:1.55;max-width:640px}
.page-lead--article{grid-column:1/9;font-size:1.125rem;line-height:1.55;max-width:720px}
.page-lead--muted{font-size:0.9375rem;line-height:1.55;color:var(--muted);max-width:none}
.filters{grid-column:1/13;display:flex;gap:0.5rem;flex-wrap:wrap;font-size:0.8125rem;font-weight:700;padding-bottom:5rem}
.filter{padding:0.625rem 1.125rem;border-radius:999px;background:var(--card);color:var(--muted2);border:0;cursor:pointer;font-family:inherit;font-size:0.8125rem;font-weight:700}
.filter.is-active{background:var(--fg);color:var(--ink)}
.back{grid-column:1/13;display:flex;align-items:center;gap:0.625rem;font-size:0.8125rem;color:var(--muted)}
.back:hover{color:var(--muted)}
.meta-row{grid-column:1/13;display:flex;align-items:center;gap:0.875rem}
.meta-row--wrap{flex-wrap:wrap;gap:0.625rem 1.125rem;font-size:0.8125rem;color:var(--muted)}
.chip-dark{padding:0.375rem 0.75rem;border-radius:6px;background:var(--chip-dark);color:var(--muted2);font-size:0.75rem;font-weight:700}
.chip-light{padding:0.375rem 0.75rem;border-radius:999px;background:var(--fg);color:var(--ink);font-size:0.7188rem;font-weight:700}
.meta-year{font-size:0.8125rem;color:var(--muted)}
.meta-sep{color:#3a3a3a}
.tags{grid-column:1/13;display:flex;flex-wrap:wrap;gap:0.5rem}
.tag{padding:0.5rem 0.875rem;border-radius:999px;border:1px solid var(--line);font-size:0.7813rem;color:var(--muted2)}
.tag--own{background:#FF8000;border-color:#FF8000;color:#fff;font-weight:700}
.badge-accent{padding:0.375rem 0.75rem;border-radius:999px;background:var(--accent);color:#fff;font-size:0.75rem;font-weight:700}
.kicker-text{font-size:0.8125rem;color:var(--muted)}
.cta-row{grid-column:1/13;display:flex;flex-wrap:wrap;gap:0.75rem;padding-top:0.5rem}

.media-16-8{aspect-ratio:16/8;border-radius:var(--radius);overflow:hidden;background:var(--card)}
.media-16-8 img,.media-16-8 video{width:100%;height:100%;object-fit:cover;display:block}
/* telefón (do 640 px): trieda pribudne LEN keď je k článku nahraná mobilná fotka na výšku – vtedy blok prejde zo 16:8 na 4:5 (na 390 px = 358×448 namiesto 358×179) */
@media (max-width:640px){.media-16-8--phone{aspect-ratio:4/5}}
.detail{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:4rem;padding:5rem 0 6rem}
.detail-side{grid-column:1/5;display:flex;flex-direction:column;gap:1.125rem}
.detail-field{display:flex;flex-direction:column;gap:0.375rem}
.detail-label{font-size:0.75rem;color:var(--muted)}
.detail-value{font-size:1rem}
.detail-value--multi{line-height:1.5}
.tech-pills{display:flex;flex-wrap:wrap;gap:0.375rem;margin-top:0.25rem}
.tech-pill{padding:0.375rem 0.75rem;border-radius:999px;background:var(--pill-bg,#FF8000);color:var(--pill-ink,#fff);font-size:0.75rem;font-weight:700;line-height:1.2;white-space:nowrap}
.detail-main{grid-column:5/13;display:flex;flex-direction:column;gap:3rem}
.detail-block{display:flex;flex-direction:column;gap:0.875rem}
.detail-block h2{margin:0;font-size:1.75rem;font-weight:700;letter-spacing:-0.02em}
.detail-block p{margin:0;font-size:1rem;line-height:1.6;color:var(--muted2)}
.detail-block--results{gap:1.125rem}
.results-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0.75rem}
.result{display:flex;flex-direction:column;gap:0.5rem;padding:1.25rem 1.25rem 1.125rem;border-radius:var(--radius);background:var(--res-card,#fff)}
.result-icon{display:block;width:2.125rem;height:2.125rem;margin-bottom:0.25rem;color:var(--res-ink,var(--accent-on-light))}
.result-icon svg{display:block;width:100%;height:100%}
.result-v{font-size:1.75rem;font-weight:700;letter-spacing:-0.03em;line-height:1;color:var(--res-ink,var(--accent-on-light))}
.result-v--text{font-size:1.1875rem;letter-spacing:-0.01em;line-height:1.15}
.result-l{font-size:0.8125rem;line-height:1.45;color:var(--res-ink,var(--ink-muted))}
.is-themed .result-l{opacity:var(--w-res-label-alpha,.85)}
/* ── Graf výsledkov v detaile referencie (bp_works.chart) ──
   Jedna farba (akcent referencie, inak zelená značky) na tmavej karte: čísla nesie text,
   pruh je len druhý, doplnkový kanál – bez farby aj bez JavaScriptu ostane graf čitateľný.
   Pruh = podiel položky na jej vlastnom základe (100 % = celá šírka), takže hodnoty
   s rôznym rádom (93 000 / 8 460 / 0,15 €) nikdy nestoja na jednej spoločnej osi. */
.detail-block--chart{gap:1.125rem}
.chart{--chart-accent:var(--w-chart,var(--accent));margin:0;display:flex;flex-direction:column;gap:1.5rem;padding:clamp(1.125rem,2.5vw,1.75rem);border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
.chart-bars,.chart-tiles{list-style:none;margin:0;padding:0}
.chart-bars{display:flex;flex-direction:column;gap:1.375rem}
.chart-bar{display:flex;flex-direction:column;gap:0.5rem}
.chart-bar-head{display:flex;align-items:baseline;justify-content:space-between;gap:0.75rem}
.chart-bar-label{font-size:0.875rem;line-height:1.35;color:var(--muted2)}
.chart-bar-value,.chart-tile-value{font-size:clamp(1.25rem,1.05rem + 0.6vw,1.5rem);font-weight:700;letter-spacing:-0.02em;line-height:1.1;color:var(--fg);white-space:nowrap}
.chart-unit{margin-left:0.25rem;font-size:0.875rem;font-weight:700;color:var(--muted2)}
.chart-meter{position:relative;display:block}
.chart-track{display:block;height:10px;border-radius:4px;background:rgba(255,255,255,0.08);background:color-mix(in srgb,var(--chart-accent) 20%,transparent)}
.chart-track:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
.chart-fill{display:block;height:100%;width:var(--v,0%);border-radius:0 4px 4px 0;background:var(--chart-accent);transition:width 0.9s cubic-bezier(0.22,0.61,0.36,1)}
.chart.is-armed .chart-fill{width:0}
.chart.is-armed.is-in .chart-fill{width:var(--v,0%)}
.chart-bar-foot{display:flex;flex-wrap:wrap;align-items:baseline;gap:0.375rem;font-size:0.8125rem;line-height:1.45}
.chart-pct{font-weight:700;color:var(--fg)}
.chart-note{color:var(--muted)}
.chart-tip{position:absolute;left:0;top:calc(100% + 0.5rem);z-index:2;max-width:100%;padding:0.4375rem 0.625rem;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--fg);font-size:0.75rem;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transform:translateY(-4px);transition:opacity 0.18s ease,transform 0.18s ease;pointer-events:none}
.chart-track:hover ~ .chart-tip,.chart-track:focus-visible ~ .chart-tip,.chart-track.is-open ~ .chart-tip{opacity:1;transform:translateY(0)}
.chart-tiles{display:flex;flex-wrap:wrap;gap:0.75rem}
.chart-tile{flex:0 1 auto;min-width:min(14rem,100%);max-width:100%;display:flex;flex-direction:column;gap:0.25rem;padding:0.875rem 1rem;border:1px solid var(--line);border-radius:12px;opacity:1;transform:none;transition:opacity 0.5s ease,transform 0.5s ease}
.chart.is-armed .chart-tile{opacity:0;transform:translateY(10px)}
.chart.is-armed.is-in .chart-tile{opacity:1;transform:none}
.chart-tile-label{font-size:0.8125rem;line-height:1.35;color:var(--muted2)}
.chart-tile .chart-note{font-size:0.75rem;line-height:1.45}
.chart-caption{margin:0;padding-top:1rem;border-top:1px solid var(--line);font-size:0.8125rem;line-height:1.6;color:var(--muted2)}
@media (max-width:640px){.chart{gap:1.25rem}.chart-bars{gap:1.25rem}.chart-bar-head{gap:0.5rem}.chart-tip{white-space:normal}}
@media (prefers-reduced-motion:reduce){.chart-fill,.chart-tile,.chart-tip{transition:none}}
/* Zákulisie fotenia – carousel fotiek na výšku (3:4) a pod ním videá 9:16.
   Zámerne iné rozmery než bežná galéria 4:3. Koľko kariet je vidieť, riadi --per:
   desktop 4, tablet 3, telefón 2 (Denis chcel na mobile dve vedľa seba).
   Selektor je zdvojený (.carousel.carousel--stories), aby prebil globálne
   [data-carousel]{--per:2/1} v mobilných media queries nižšie v súbore. */
.stories{--story-per:4;display:grid;grid-template-columns:repeat(12,1fr);column-gap:1rem;row-gap:1rem;padding:0 0 4rem}
.stories .section-title{grid-column:1/13;margin:0 0 0.5rem;font-size:1.75rem;letter-spacing:-0.02em;line-height:1.2}
.carousel.carousel--stories{--per:var(--story-per)}
.carousel--stories .story{flex:0 0 calc((100% - 1rem * (var(--story-per) - 1)) / var(--story-per));box-sizing:border-box}
.story{margin:0;aspect-ratio:3/4;border-radius:var(--radius);overflow:hidden;background:var(--card);touch-action:pan-y}
.carousel--stories .story img,.carousel--stories .story video{pointer-events:none;-webkit-user-drag:none}
.story img,.story video{width:100%;height:100%;object-fit:cover;display:block}
/* Videá sú 9:16, fotky 3:4. Šírka 0.75 karty im dá presne rovnakú výšku ako majú fotky
   v karuseli, takže sekcia drží jeden rytmus. Na telefóne dostanú plnú šírku karty. */
/* Video je na desktope súčasťou karuselu (orezané do 3:4 ako fotky), takže blok pod ním
   je zbytočný. Na telefóne je to naopak: v karuseli sa skryje a ukáže sa pod ním
   v natívnom 9:16 na plnú šírku. main.js ráta len viditeľné položky, takže karusel
   po skrytí videa nedobehne do prázdna. */
.stories-videos{grid-column:1/13;display:none;justify-content:center;gap:1rem;margin-top:0.5rem}
.stories-videos .story{flex:0 0 calc(((100% - 1rem * (var(--story-per) - 1)) / var(--story-per)) * 0.75);aspect-ratio:9/16}
@media (max-width:1100px){.stories{--story-per:3}}
@media (max-width:640px){
  .stories{--story-per:2;row-gap:0.75rem;padding-bottom:2.5rem}
  .carousel--stories .story--in-carousel{display:none}
  .stories-videos{display:flex;gap:0.75rem;margin-top:0.25rem}
  .stories-videos .story{flex:0 0 100%}
}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;padding:0 0 10rem}
.gallery-title{grid-column:1/3;margin:0 0 0.5rem;font-size:1.75rem;font-weight:700;letter-spacing:-0.02em;line-height:1.2;color:var(--fg)}
.gallery-item{aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;background:var(--card)}
.gallery-item--wide{grid-column:1/3;aspect-ratio:16/8}
.gallery-item img,.gallery-item video{width:100%;height:100%;object-fit:cover;display:block}
.gallery-strip{grid-column:1/3;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media (max-width:960px){.gallery-strip{grid-template-columns:repeat(2,1fr);gap:0.75rem}}
@media (max-width:960px){.detail-main{margin-top:1.75rem}.detail{padding-bottom:3.5rem}}
/* hamburger menu už od 1100 px (Denis 2026-09-06), mobilný blok ≤960 ostáva pre layout */
@media (max-width:1100px){.nav-links,.nav-cta{display:none!important}.nav-burger{display:flex!important}}
.others{display:flex;flex-direction:column;gap:2rem;padding:0 0 2.5rem}
.others .section-title{grid-column:auto}
.others-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.other{display:flex;flex-direction:column;gap:1rem;color:var(--fg)}
.other:hover{color:var(--fg)}
.other-media{aspect-ratio:16/10;border-radius:var(--radius);background:var(--card);overflow:hidden}
.other-media img,.other-media video{width:100%;height:100%;object-fit:cover;display:block}
.other-meta{display:flex;align-items:center;gap:0.75rem}
.other-client{padding:0.3125rem 0.625rem;border-radius:6px;background:var(--chip-dark);color:var(--muted2);font-size:0.6875rem;font-weight:700}
.other-title{font-size:0.9375rem;font-weight:700}

.svc-list{display:flex;flex-direction:column;gap:1rem;padding-bottom:10rem}
/* Celý riadok služby je klikateľný cez „natiahnutý odkaz": pseudoprvok nadpisu prekryje
   celú kartu. Sémantika zostáva čistá (odkaz je stále len okolo nadpisu) a text v tele
   sa dá naďalej označiť myšou. */
.svc-row{position:relative;display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;padding:3rem;border-radius:var(--radius);background:var(--card);color:var(--fg);transition:background .15s}
.svc-row:hover{background:var(--card-hover)}
.svc-row-title a::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:1}
.svc-row-title a:focus-visible::after{outline:2px solid var(--accent);outline-offset:-4px}
.svc-row:hover .svc-row-title a{color:var(--accent)}
.svc-row-body,.svc-row-num{position:relative;z-index:2;pointer-events:none}
.svc-row-body a,.svc-row-tags{pointer-events:auto}
.svc-row-num{grid-column:1/2;font-size:0.8125rem;color:var(--muted)}
.svc-row-title{grid-column:2/6;margin:0;font-size:2.25rem;font-weight:400;letter-spacing:-0.02em;line-height:1.1}
.svc-row-title a{display:inline-flex;align-items:center;gap:0.875rem;color:var(--fg)}
.svc-row-title a span{font-size:1.125rem;color:var(--accent)}
.svc-row-body{grid-column:7/13;display:flex;flex-direction:column;gap:1.25rem;font-size:0.9375rem;line-height:1.55;color:var(--muted2)}
.svc-row-body p{margin:0}
.svc-row-tags{margin:0;padding:0;list-style:none}
.svc-row--accent{background:var(--accent);color:#fff}
.svc-row--accent .svc-row-num{color:rgba(255,255,255,.7)}
.svc-row--accent .svc-row-title a,.svc-row--accent .svc-row-title a span{color:#fff}
.svc-row--accent .svc-row-body{color:rgba(255,255,255,.88)}
.svc-row--accent .chip{border-color:rgba(255,255,255,.45);color:#fff}
.badge-new--block{display:block;margin-top:0.75rem;font-size:0.75rem;font-weight:700;padding:0.3125rem 0.625rem;border-radius:999px;background:#fff;color:var(--accent);width:max-content}
.process{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:3rem;padding-bottom:5rem}
.process-text{grid-column:1/9;margin:0;font-size:1.375rem;line-height:1.4}
.step{padding:2rem;border-radius:var(--radius);border:1px solid var(--line);display:flex;flex-direction:column;gap:2.5rem}
.step--filled{background:var(--card);border:0}
.step-n{font-size:0.75rem;color:var(--muted)}
.step-t{font-size:1.25rem;margin-bottom:0.5rem}
.step-t--bold{font-weight:700}
.step-d{font-size:0.8125rem;line-height:1.5;color:var(--muted2)}

.item{display:flex;flex-direction:column;gap:1.5rem;min-height:220px;padding:1.75rem;border-radius:var(--radius);background:var(--card)}
.item--240{min-height:240px}
.item--260{min-height:260px}
.item-body{display:flex;flex-direction:column;gap:0.75rem}
.item-title{font-size:1.25rem;font-weight:700;letter-spacing:-0.01em;line-height:1.2}
.item-title--22{font-size:1.375rem}
.item-desc{font-size:0.875rem;line-height:1.55;color:var(--muted2)}
.int{display:flex;flex-direction:column;gap:1.125rem;padding:1.75rem;border-radius:var(--radius);background:#fff}
.int-head{display:flex;flex-direction:column;gap:0.375rem}
.int-name{font-size:1.125rem;font-weight:700;letter-spacing:-0.01em}
.int-note{font-size:0.8125rem;line-height:1.5;color:var(--muted)}
.int-list{display:flex;flex-wrap:wrap;gap:0.375rem}
.int-chip{padding:0.375rem 0.75rem;border-radius:999px;background:var(--cream);font-size:0.7813rem;color:var(--ink)}
.int-foot{grid-column:1/9;margin:0;font-size:0.875rem;line-height:1.55;color:var(--ink-muted)}
.who{display:flex;flex-direction:column;gap:0.75rem;padding:1.75rem;border-radius:var(--radius);background:var(--card)}
.who--outline{background:transparent;border:1px solid var(--line)}
.who-title{font-size:1.25rem;font-weight:700;letter-spacing:-0.01em}
.who--outline .who-title{letter-spacing:0}
.who-desc{font-size:0.875rem;line-height:1.55;color:var(--muted2)}
.tools{grid-column:1/13;display:flex;flex-wrap:wrap;gap:0.5rem}
.tool{padding:0.625rem 1.125rem;border-radius:999px;border:1px solid var(--line);font-size:0.8125rem;color:var(--muted2)}
.other-svc{padding:0.75rem 1.25rem;border-radius:999px;background:var(--card);font-size:0.875rem;color:var(--fg)}
.other-svc:hover{background:var(--accent);color:#fff}
.g12--32{row-gap:2rem}

.clients-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding-bottom:10rem}
/* úvod: tá istá mriežka klientov ako na /klienti, len bez spodného odsadenia (sekcia má sec-pb200) */
.clients-grid--home{grid-column:1/13;padding-bottom:0}
/* posledná kartička v mriežke klientov – pozvánka na stretnutie */
.client-cta{aspect-ratio:4/3;border-radius:var(--radius);background:var(--card);color:var(--fg);border:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;gap:0.75rem;padding:1.5rem;box-sizing:border-box;overflow:hidden;position:relative;transition:transform .25s ease}
.client-cta:hover{color:var(--fg);transform:translateY(-4px)}
.client-cta-txt{display:flex;flex-direction:column;gap:0.375rem}
.client-cta-title{font-size:1.0625rem;font-weight:700;letter-spacing:-0.015em;line-height:1.2}
.client-cta-text{font-size:0.8125rem;line-height:1.45;color:var(--muted2)}
.client-cta-btn{display:inline-flex;align-items:center;gap:0.5rem;align-self:flex-start;padding:0.5rem 0.5rem 0.5rem 0.9375rem;border-radius:999px;background:#fff;color:var(--ink);font-size:0.8125rem;font-weight:700;line-height:1}
.client-cta:hover .client-cta-btn .arrow{transform:translateX(3px)}
.client-cta-btn .arrow{background:var(--ink);color:#fff;transition:transform .25s ease}

.testi{margin:0;padding:2.25rem;border-radius:var(--radius);background:var(--card);display:flex;flex-direction:column;justify-content:space-between;gap:2.5rem;min-height:300px}
.carousel--testi .testi{flex:0 0 calc((100% - 16px * (var(--per,3) - 1)) / var(--per,3));box-sizing:border-box}
.testi-title{grid-column:1/9;margin:0}
.testi-foot{display:flex;flex-direction:column;gap:clamp(0.35rem,0.25rem + 0.3vw,0.5rem)}
.testi-logo{height:46px;display:flex;align-items:flex-end}
.testi-logo img,.testi-logo picture{max-height:46px;max-width:200px;width:auto;height:auto;object-fit:contain;object-position:left center}
.testi{gap:clamp(1.75rem,1.25rem + 1.6vw,2.75rem)}
.testi blockquote{flex:1}

.ref-intro{grid-column:1/8;display:flex;flex-direction:column;gap:1.25rem}
.ref-intro .page-lead{grid-column:auto}
.ref-thanks{display:flex;align-items:center;gap:0.75rem;margin:0;font-size:0.9375rem;font-weight:700;letter-spacing:-0.01em;color:var(--fg)}
.smiley{flex:none;overflow:visible;animation:bp-smiley-bob 3.6s ease-in-out infinite}
.smiley-eyes{transform-origin:20px 17px;animation:bp-smiley-blink 4.2s ease-in-out infinite}
.smiley-mouth{transform-origin:20px 25px;animation:bp-smiley-grin 3.6s ease-in-out infinite}
@keyframes bp-smiley-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-3px) rotate(-4deg)}}
@keyframes bp-smiley-blink{0%,88%,100%{transform:scaleY(1)}92%,95%{transform:scaleY(0.1)}}
@keyframes bp-smiley-grin{0%,100%{transform:scaleX(1) scaleY(1)}50%{transform:scaleX(1.08) scaleY(1.15)}}
@media (prefers-reduced-motion:reduce){.smiley,.smiley-eyes,.smiley-mouth{animation:none}}

.cal-sec{display:flex;flex-direction:column;gap:2rem;padding-bottom:8.75rem;scroll-margin-top:6rem}
.cal-head{display:flex;flex-direction:column;gap:1rem}
.cal-lead{margin:0;font-size:0.9375rem;line-height:1.55;color:var(--muted2);max-width:46rem}

.cal{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;align-items:start}
.cal-panel{padding:1.75rem;border-radius:var(--radius);background:var(--card);min-width:0}
.cal.is-loading{opacity:0.55;pointer-events:none}

.cal-nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}
.cal-month{font-size:1.0625rem;font-weight:700;letter-spacing:-0.01em;text-transform:capitalize}
.cal-arrows{display:flex;gap:0.5rem}
.cal-arrow{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--fg);font-size:1rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s,opacity .2s}
.cal-arrow:hover:not(:disabled){background:var(--chip-dark);border-color:var(--chip-dark)}
.cal-arrow:disabled{opacity:0.3;cursor:default}

.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:0.375rem}
.cal-dow{display:flex;align-items:center;justify-content:center;height:1.75rem;font-size:0.6875rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--muted)}
.cal-day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border:0;border-radius:10px;background:transparent;color:var(--muted);font-family:inherit;font-size:0.875rem;font-variant-numeric:tabular-nums;cursor:default;position:relative;transition:background .18s,color .18s}
.cal-day.is-free{background:var(--chip-dark);color:var(--fg);cursor:pointer}
.cal-day.is-free::after{content:"";position:absolute;bottom:5px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--accent)}
.cal-day.is-free:hover{background:var(--accent-dark);color:#fff}
.cal-day.is-selected,.cal-day.is-selected:hover{background:var(--accent);color:#fff;font-weight:700}
.cal-day.is-selected::after{background:#fff}
.cal-day:disabled{opacity:0.35}

.cal-side{display:flex;flex-direction:column;gap:1.25rem}
.cal-hint{margin:0;font-size:0.875rem;line-height:1.55;color:var(--muted)}
.cal-times-title{font-size:0.9375rem;font-weight:700;letter-spacing:-0.01em}
.cal-times{display:flex;flex-wrap:wrap;gap:0.5rem}
.cal-time{padding:0.5rem 0.875rem;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--fg);font-family:inherit;font-size:0.8125rem;font-weight:700;font-variant-numeric:tabular-nums;cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.cal-time:hover{border-color:var(--accent);color:var(--accent)}
.cal-time.is-selected{background:var(--accent);border-color:var(--accent);color:#fff}

/* formulár sa odkryje až po výbere termínu */
.cal-step{display:none}
.cal.has-day .cal-step--times{display:flex;flex-direction:column;gap:0.75rem}
.cal.has-time .cal-step--form{display:block}
.cal:not(.has-day) .cal-step--empty{display:block}
.cal.is-done .cal-step{display:none}
.cal.is-done .cal-step--done{display:block}

.cal-summary{display:inline-flex;align-items:center;gap:0.625rem;padding:0.5rem 0.875rem;border-radius:999px;background:rgba(141,176,79,0.14);color:var(--accent);font-size:0.8125rem;font-weight:700;margin-bottom:1rem}
.cal-form{display:flex;flex-direction:column;gap:0.75rem}
.cal-form .input{background:var(--bg);border-color:var(--line);color:var(--fg)}
.cal-form .input::placeholder{color:var(--muted)}
.cal-form .input:focus{border-color:var(--accent)}
.cal-form .gdpr{color:var(--muted)}
.cal-form .gdpr a{color:var(--accent)}
.cal-form .btn-submit{background:var(--accent);color:#fff}
.cal-error{font-size:0.8125rem;color:#ff8a8e;display:none}
.cal-error.is-visible{display:block}
.cal-done{display:flex;flex-direction:column;gap:0.75rem}
.cal-done-icon{width:44px;height:44px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.125rem}
.cal-done-title{font-size:1.25rem;font-weight:700;letter-spacing:-0.01em}
.cal-done-text{font-size:0.875rem;line-height:1.55;color:var(--muted2)}
.cal-step--done.cal-done{display:flex;flex-direction:column;align-items:flex-start;gap:1.25rem}
.cal-done-body{display:flex;flex-direction:column;align-items:flex-start;gap:0.875rem}
.cal-done-pills{display:flex;flex-wrap:wrap;gap:0.5rem}
.cal-done-pills:empty{display:none}
.cal-done-pill{display:inline-flex;align-items:center;gap:0.5rem;padding:0.5rem 0.875rem;border-radius:999px;background:rgba(141,176,79,0.14);color:var(--accent);font-size:0.8125rem;font-weight:700;white-space:nowrap}
.cal-done-pill svg{width:14px;height:14px;flex:none}
.cal-done-text{max-width:32rem}

.ref-sec{display:flex;justify-content:center;padding-bottom:8.75rem}
.ref-box{width:100%;max-width:44rem;padding:2.5rem;border-radius:var(--radius);background:var(--cream);color:var(--ink)}
.ref-title{margin:0 0 1.5rem;font-size:clamp(24px,2.4vw,32px);font-weight:400;letter-spacing:-0.02em;line-height:1.1}
.ref-box .form-success{padding:0;background:transparent}
.input--area{min-height:9rem;resize:vertical;line-height:1.5;font-family:inherit}
.form-counter{align-self:flex-end;font-size:0.75rem;color:var(--ink-muted);font-variant-numeric:tabular-nums}
.form-counter.is-near{color:#b3261e}
.testi blockquote{margin:0;font-size:1.25rem;line-height:1.4}
.carousel--testi blockquote{font-size:1.0625rem;line-height:1.45}
.testi figcaption{font-size:0.8125rem;color:var(--muted)}
.testi figcaption span{color:var(--accent)}

.article-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:3rem;padding:6rem 0 7.5rem}
.article-side{grid-column:1/4;display:flex;flex-direction:column;gap:1.75rem;position:sticky;top:120px;align-self:start;font-size:0.8125rem}
.author{display:flex;align-items:center;gap:0.75rem}
.author-avatar{width:44px;height:44px;border-radius:50%;overflow:hidden;background:var(--card);flex:none;display:flex;align-items:center;justify-content:center}
.author-avatar img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.author-text{display:flex;flex-direction:column;gap:2px}
.author-name{font-weight:700;color:var(--fg)}
.author-role{color:var(--muted)}
.side-field{display:flex;flex-direction:column;gap:0.375rem}
.side-field--line{padding-top:1.5rem;border-top:1px solid var(--line)}
.side-field--share{gap:0.625rem}
.side-label{color:var(--muted)}
.side-value{color:var(--fg)}
.share-row{display:flex;gap:0.5rem}
.copy-btn{padding:0.5rem 0.875rem;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--fg);font-size:0.75rem;font-weight:700;cursor:pointer;font-family:inherit}
.copy-btn:hover{border-color:var(--accent);color:var(--accent)}
.article{grid-column:4/12;font-size:1.0625rem;line-height:1.7;color:var(--muted2)}
.article h2{margin:3rem 0 1rem;font-size:1.875rem;font-weight:700;letter-spacing:-0.02em;line-height:1.2;color:var(--fg)}
.article h2:first-child{margin-top:0}
.article h3{margin:2rem 0 0.75rem;font-size:1.375rem;font-weight:700;letter-spacing:-0.01em;line-height:1.25;color:var(--fg)}
.article p{margin:0}
.article p + p,.article p + ul,.article p + ol,.article ul + p,.article ol + p{margin-top:1rem}
.article ul,.article ol{margin:0;padding-left:1.375rem}
.article li{margin-bottom:0.375rem}
.article a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.article img{border-radius:var(--radius);margin:1.5rem 0}
.article blockquote{margin:1.5rem 0;padding-left:1.25rem;border-left:2px solid var(--accent);color:var(--fg)}
.article strong{color:var(--fg)}
.quote-band{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem}
.quote-band blockquote{grid-column:2/12;margin:0;font-size:clamp(26px,3vw,44px);font-weight:400;letter-spacing:-0.025em;line-height:1.2}
.quote-band cite{grid-column:2/12;margin-top:1.5rem;font-size:0.875rem;color:var(--ink-muted);font-style:normal}
.other-post{display:flex;flex-direction:column;justify-content:space-between;gap:2.5rem;min-height:260px;padding:2rem;border-radius:var(--radius);background:var(--card);color:var(--fg)}
.other-post:hover{background:var(--card-hover);color:var(--fg)}
.other-post-meta{display:flex;justify-content:space-between;font-size:0.75rem;color:var(--muted)}
.other-post-title{font-size:1.25rem;font-weight:700;line-height:1.3;letter-spacing:-0.01em}

.anchor-target{scroll-margin-top:7rem}
.stats{grid-column:1/13;display:flex;gap:2.5rem;flex-wrap:wrap;font-size:0.8125rem;color:var(--muted2);padding-top:1rem}
.stat{display:flex;flex-direction:column;gap:0.25rem}
.stat-v{font-size:1.75rem;font-weight:700;color:var(--fg);letter-spacing:-0.02em}
.format{display:flex;flex-direction:column;justify-content:space-between;gap:2.5rem;padding:2rem;border-radius:var(--radius);background:#fff}
.format--dark{background:var(--bg);color:var(--fg)}
.format-head{display:flex;flex-direction:column;gap:0.75rem}
.format-top{display:flex;align-items:center;justify-content:space-between}
.format-meta{font-size:0.8125rem;color:var(--muted)}
.format-badge{padding:0.3125rem 0.625rem;border-radius:999px;background:var(--accent);color:#fff;font-size:0.6875rem;font-weight:700}
.format-title{font-size:1.625rem;font-weight:700;letter-spacing:-0.01em;line-height:1.15}
.format-text{font-size:0.875rem;line-height:1.55;color:var(--ink-muted)}
.format--dark .format-text{color:var(--muted2)}
.format-foot{display:flex;flex-direction:column;gap:1.5rem}
.format-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:0.5rem;font-size:0.8438rem;color:var(--ink)}
.format--dark .format-list{color:var(--fg)}
.format-list li{display:flex;gap:0.625rem}
.format-list li span{color:var(--accent)}
.format-price{display:flex;flex-direction:column;gap:0.1875rem;padding-top:1.25rem;border-top:1px solid var(--cream-line)}
.format--dark .format-price{border-top-color:var(--line)}
.format-price-label{font-size:0.6875rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted)}
.format-price-value{font-size:0.9375rem;font-weight:700;letter-spacing:-0.01em;color:var(--ink)}
.format--dark .format-price-value{color:var(--fg)}

.get{display:flex;flex-direction:column;gap:2rem;padding:1.75rem;border-radius:var(--radius);background:#fff}
.get-body{display:flex;flex-direction:column;gap:0.5rem}
.get-title{font-size:1.1875rem;font-weight:700}
.get-text{font-size:0.8438rem;line-height:1.5;color:var(--ink-muted)}
.cta-box{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:2rem;align-items:center;padding:3.5rem;margin:0 0 10rem;border-radius:var(--radius);background:var(--accent);color:#fff;box-sizing:border-box}
.cta-box-left{grid-column:1/9;display:flex;flex-direction:column;gap:1rem}
.cta-box-badge{display:inline-flex;align-items:center;gap:0.5rem;width:max-content;padding:0.375rem 0.75rem;border-radius:999px;background:#fff;color:var(--accent);font-size:0.75rem;font-weight:700}
.cta-box-title{margin:0;font-size:clamp(32px,3.6vw,52px);font-weight:400;letter-spacing:-0.025em;line-height:1.05;color:#fff}
.cta-box-text{margin:0;font-size:0.9375rem;line-height:1.55;color:rgba(255,255,255,0.85);max-width:560px}
.cta-box-right{grid-column:9/13;display:flex;justify-content:flex-end}
.why{display:flex;flex-direction:column;align-items:flex-start;gap:1.75rem}
.why .section-title{grid-column:auto}
.why-text{margin:0;max-width:640px;font-size:1.0625rem;line-height:1.55;color:var(--ink-muted)}

.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding-bottom:10rem}
.contact-card{display:flex;flex-direction:column;justify-content:space-between;gap:3rem;min-height:240px;padding:2rem;border-radius:var(--radius);background:var(--card);color:var(--fg)}
a.contact-card:hover{background:var(--card-hover);color:var(--fg)}
.contact-head{display:flex;align-items:center;justify-content:space-between}
.contact-label{font-size:0.8125rem;color:var(--muted)}
.contact-body{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}
.contact-value{font-size:clamp(16px,1.7vw,24px);font-weight:700;letter-spacing:-0.01em;overflow-wrap:anywhere}
.contact-address{font-size:clamp(18px,1.9vw,26px);font-weight:700;letter-spacing:-0.01em;line-height:1.25;white-space:pre-line}
.billing{grid-column:1/13;display:grid;grid-template-columns:5fr 7fr;gap:1rem;align-items:stretch}
.billing-label{font-size:0.6875rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted)}
.billing-card{display:flex;flex-direction:column;gap:0.75rem;padding:2.5rem;border-radius:var(--radius);background:var(--bg);color:var(--fg)}
.billing-name{font-size:clamp(28px,2.6vw,40px);font-weight:400;letter-spacing:-0.025em;line-height:1.05}
.billing-blocks{display:flex;flex-direction:column;gap:1.5rem;margin-top:auto;padding-top:2.5rem}
.billing-block{display:flex;flex-direction:column;gap:0.375rem}
.billing-lines{font-size:0.9375rem;line-height:1.5;color:var(--muted2)}
.billing-ids{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.billing-id{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:1.25rem;min-height:8.25rem;padding:1.75rem;border:0;border-radius:var(--radius);background:#fff;color:var(--ink);font-family:inherit;text-align:left;cursor:pointer;transition:background .2s,color .2s,transform .2s}
.billing-id:hover,.billing-id:focus-visible{background:var(--ink);color:#fff;transform:translateY(-2px)}
.billing-id:hover .billing-label,.billing-id:focus-visible .billing-label{color:rgba(255,255,255,0.6)}
.billing-id-value{font-size:1.375rem;font-weight:700;letter-spacing:-0.015em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.billing-id--mail .billing-id-value{font-size:1.0625rem}
.billing-id-act{display:inline-flex;align-items:center;gap:0.5rem;font-size:0.75rem;font-weight:700;color:var(--ink-muted);opacity:1;transition:opacity .2s,color .2s}
.billing-id:hover .billing-id-act,.billing-id:focus-visible .billing-id-act{opacity:1;color:var(--accent)}
.billing-id-icon{width:14px;height:14px;border:1.5px solid currentColor;border-radius:3px;position:relative;flex:none}
.billing-id-icon::before{content:"";position:absolute;left:-4px;top:-4px;width:10px;height:10px;border:1.5px solid currentColor;border-right:0;border-bottom:0;border-radius:3px 0 0 0}
.billing-id.is-copied{background:var(--accent);color:var(--ink)}
/* potvrdenie po kliknuti: tmavy text na zelenej ma kontrast 7,88:1 (biely mal len 2,48:1) */
.billing-id.is-copied .billing-label,.billing-id.is-copied .billing-id-act{color:var(--ink);opacity:1}

.map-sec{display:flex;flex-direction:column;gap:1.5rem;padding-bottom:8.75rem}
.map-head{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.map-kicker{display:flex;align-items:center;gap:0.625rem;font-size:0.8125rem;color:var(--muted)}
.map-title{grid-column:auto;margin:0}
.map-open{display:inline-flex;align-items:center;gap:0.875rem;padding:0.375rem 0.375rem 0.375rem 1.25rem;border-radius:999px;border:1px solid var(--line);font-size:0.8125rem;font-weight:700;white-space:nowrap;transition:background .2s,border-color .2s}
.map-open:hover{background:var(--card);color:var(--fg);border-color:var(--card)}
.map{height:clamp(320px,42vh,480px);border-radius:var(--radius);overflow:hidden;background:var(--card);opacity:0;transition:opacity .5s ease;z-index:0}
.map.is-ready{opacity:1}
.map .maplibregl-map{font-family:inherit}
.map canvas{outline:none}
.map .maplibregl-ctrl-group{background:rgba(10,10,10,0.85);border:1px solid var(--line);border-radius:8px;box-shadow:none;overflow:hidden}
.map .maplibregl-ctrl-group button+button{border-top:1px solid var(--line)}
.map .maplibregl-ctrl-group button{width:34px;height:34px;background:transparent}
.map .maplibregl-ctrl-group button:hover{background:var(--card-hover)}
.map .maplibregl-ctrl-group button span{filter:invert(1) opacity(0.75)}
.map .maplibregl-ctrl-top-left{margin:0.75rem}
.map .maplibregl-ctrl-attrib{background:rgba(10,10,10,0.7);border-radius:8px 0 0 0}
.map .maplibregl-ctrl-attrib.maplibregl-compact{min-height:22px;background:rgba(10,10,10,0.7)}
.map .maplibregl-ctrl-attrib-button{background-color:transparent;filter:invert(1) opacity(0.5)}
.map .maplibregl-ctrl-attrib.maplibregl-compact:not(.maplibregl-compact-show){background:transparent}
.map .maplibregl-ctrl-attrib.maplibregl-compact:not(.maplibregl-compact-show) .maplibregl-ctrl-attrib-inner{display:none}
.map .maplibregl-ctrl-attrib-inner{color:var(--muted);font-size:0.625rem}
.map .maplibregl-ctrl-attrib-inner a{color:var(--muted2)}
.map-pin{position:relative;width:24px;height:24px}
.map-pin i,.map-pin b{position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%)}
.map-pin i{width:14px;height:14px;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,0.2),0 4px 12px rgba(0,0,0,0.7)}
.map-pin b{width:24px;height:24px;border:1.5px solid rgba(255,255,255,0.8);animation:bp-ping 2.4s ease-out infinite}
@keyframes bp-ping{0%{transform:translate(-50%,-50%) scale(0.6);opacity:0.9}70%,100%{transform:translate(-50%,-50%) scale(2.2);opacity:0}}
@media (prefers-reduced-motion:reduce){.map-pin b{animation:none;opacity:0.5}}
.map-pin-tag{position:absolute;left:1.75rem;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:0.875rem;padding:0.875rem 1rem;border-radius:14px;background:#fff;color:var(--ink);box-shadow:0 10px 30px rgba(0,0,0,0.45);white-space:nowrap;pointer-events:auto;transition:transform .2s,box-shadow .2s}
.map-pin-tag:hover{color:var(--ink);transform:translateY(-50%) translateX(2px);box-shadow:0 14px 36px rgba(0,0,0,0.55)}
.map-pin-ico{display:flex;align-items:center;justify-content:center;width:36px;height:36px;flex:none;border-radius:50%;background:var(--accent);color:#fff}
.map-pin-body{display:flex;flex-direction:column;gap:0.125rem}
.map-pin-brand{font-family:'Sora','Ruda',system-ui,sans-serif;font-size:1rem;font-weight:800;letter-spacing:-0.05em;line-height:1.1}
.map-pin-text{font-size:0.75rem;line-height:1.3;color:var(--ink-muted)}
.map-poi{display:flex;align-items:center;gap:0.4375rem;white-space:nowrap;pointer-events:none;transition:opacity .2s ease}
.map-poi--vlavo{flex-direction:row-reverse}
.map-poi.is-hidden{opacity:0;visibility:hidden}
.map-poi i{width:7px;height:7px;flex:none;border-radius:50%;background:rgba(255,255,255,0.45);box-shadow:0 0 0 3px rgba(255,255,255,0.08)}
.map-poi span{font-size:0.6875rem;font-weight:700;letter-spacing:0.02em;color:rgba(255,255,255,0.62);text-shadow:0 1px 3px rgba(0,0,0,0.9)}
.map-pin-tag--bar{position:absolute;left:0.625rem;right:0.625rem;bottom:0.625rem;top:auto;z-index:3;transform:none;gap:0.625rem;padding:0.5rem 0.625rem;border-radius:11px}
.map-pin-tag--bar:hover{transform:none}
.map-pin-tag--bar .map-pin-body{min-width:0;flex:1}
.map-pin-tag--bar .map-pin-brand,.map-pin-tag--bar .map-pin-text{overflow:hidden;text-overflow:ellipsis}
.map-pin-nav{display:inline-flex;align-items:center;gap:0.5rem;margin-left:0.5rem;padding-left:0.875rem;border-left:1px solid var(--cream-line);font-size:0.8125rem;font-weight:700}

.help{grid-column:1/13;justify-self:start;box-sizing:border-box;display:grid;grid-template-columns:auto auto auto;align-items:center;column-gap:1.75rem;row-gap:1.25rem;width:max-content;max-width:100%;padding:1.5rem 1.75rem;border-radius:var(--radius);background:var(--bg);color:var(--fg)}
.help-avatar{position:relative;width:68px;height:68px;flex:none}
.help-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:center top;display:block}
.help-status{position:absolute;right:1px;bottom:1px;width:16px;height:16px;border-radius:50%;background:var(--accent);border:3px solid var(--bg)}
.help-body{display:flex;flex-direction:column;gap:0.375rem;min-width:0}
.help-title{font-size:clamp(19px,1.7vw,24px);font-weight:400;letter-spacing:-0.02em;line-height:1.15}
.help-person{display:flex;align-items:center;gap:0.625rem;flex-wrap:wrap;font-size:0.8125rem;color:var(--muted)}
.help-name{font-weight:700;color:var(--fg)}
.help-online{display:inline-flex;align-items:center;gap:0.4375rem;padding:0.1875rem 0.625rem;border-radius:999px;background:rgba(141,176,79,0.14);color:var(--accent);font-size:0.6875rem;font-weight:700}
.help-online i{width:7px;height:7px;border-radius:50%;background:var(--accent)}
.help-actions{display:flex;align-items:center;gap:0.625rem;flex-wrap:wrap}
.help-btn{display:inline-flex;align-items:center;gap:0.75rem;padding:0.5rem 0.5rem 0.5rem 1.25rem;border-radius:999px;background:var(--accent);color:#fff;font-size:0.8125rem;font-weight:700;white-space:nowrap}
.help-btn:hover{background:var(--accent-dark);color:#fff}
.help-btn--ghost{background:transparent;color:var(--fg);border:1px solid var(--line)}
.help-btn--ghost:hover{background:var(--card);color:var(--fg)}

.legal{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;padding-bottom:10rem}
.legal-nav{grid-column:1/4;display:flex;flex-direction:column;gap:0.75rem;font-size:0.8125rem;position:sticky;top:120px;align-self:start}
.legal-nav a{color:var(--muted2)}
.legal-nav a:hover{color:var(--accent)}
.legal-body{grid-column:4/12;display:flex;flex-direction:column;gap:3.5rem;font-size:1rem;line-height:1.65;color:var(--muted2)}
.legal-section{display:flex;flex-direction:column;gap:0.875rem}
.legal-section h2{margin:0;font-size:1.75rem;font-weight:700;letter-spacing:-0.02em;color:var(--fg)}
.legal-section p{margin:0}
.legal-section ul{margin:0;padding-left:1.25rem;display:flex;flex-direction:column;gap:0.5rem}
.legal-section a{color:var(--accent)}
.legal-cards{display:flex;flex-direction:column;gap:0.75rem}
.legal-cards--2{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem}
.legal-card{padding:1.5rem;border-radius:var(--radius);background:var(--card)}
.legal-card-title{font-weight:700;color:var(--fg);margin-bottom:0.375rem}
.legal-card-text{font-size:0.875rem}

.main--nf{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;box-sizing:border-box}
.nf{display:grid;grid-template-columns:repeat(12,1fr);column-gap:2rem;row-gap:2.5rem;align-items:end;justify-items:center;text-align:center;padding:10rem 0 6rem}
.nf-kicker{grid-column:1/13;justify-self:stretch;display:flex;align-items:center;justify-content:center;gap:0.875rem;font-size:0.8125rem;color:var(--muted)}
.nf-kicker-badge{padding:0.375rem 0.75rem;border-radius:999px;border:1px solid var(--line)}
.nf-big{grid-column:1/13;justify-self:stretch;position:relative;line-height:.85}
.nf-num{display:block;font-size:clamp(120px,24vw,340px);font-weight:400;letter-spacing:-0.06em;color:var(--fg)}
.nf-ghost{position:absolute;inset:0;font-size:clamp(120px,24vw,340px);font-weight:400;letter-spacing:-0.06em;color:var(--accent);mix-blend-mode:screen;pointer-events:none;opacity:.9;animation:bp-glitch 2.4s steps(1) infinite}
.nf-title{grid-column:1/13;margin:0;font-size:clamp(28px,3.4vw,48px);font-weight:400;letter-spacing:-0.025em;line-height:1.1}
.nf-text{grid-column:1/13;margin:0 auto;font-size:1.0625rem;line-height:1.55;color:var(--muted2);max-width:560px}
.nf .cta-row{justify-self:stretch;justify-content:center}

.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);z-index:120;padding:0.75rem 1.125rem;border-radius:999px;background:var(--fg);color:var(--ink);font-size:0.8125rem;font-weight:700;opacity:0;visibility:hidden;transition:all .3s}
.toast.is-visible{opacity:1;visibility:visible;transform:translate(-50%,0)}

/* 4K-triedne okná: 2K súbor (1440 px) sa radšej natiahne na výšku, než by sedel malý v čiernej ploche */
@media (min-height:1500px){
  .hero-media img,.hero-media video{height:100%;max-height:none}
}
@media (max-height:700px) and (min-width:1024px){
  .hero-inner{row-gap:1.75rem;padding-bottom:3.5rem}
}
@media (max-width:1180px){
  [data-cols="4"]{grid-template-columns:repeat(2,1fr)!important}
  .team-join{flex-wrap:wrap;gap:1rem 1.5rem}
  .team-join-title{max-width:none}
  [data-cols="3"]{grid-template-columns:repeat(2,1fr)!important}
  .marquee .client-logo{flex-basis:calc((100% - 2rem) / 3)}
}
@media (max-width:960px){
  .main{padding:0 1.5rem!important}
  .nav-inner{padding:0 1.5rem!important}
  .nav-links,.nav-cta{display:none!important}
  .nav-burger{display:flex!important}
  [data-cols="12"]{display:flex!important;flex-direction:column!important;gap:1.5rem!important;align-items:stretch!important}
  [data-cols="12"] > *{grid-column:auto!important;max-width:100%!important;position:static!important;justify-self:auto!important}
  [data-cols="12"] > .liquid-bg{max-width:none!important;position:absolute!important}
  .nf-big{position:relative!important}
  .hero-inner{padding:0 1.5rem 4rem!important}
  [data-cols="2"]{grid-template-columns:1fr!important}
  [data-cols="2"] > *{grid-column:auto!important;margin-top:0!important}
  .works--band .section-text{margin-top:-4.5rem!important}
  /* na telefóne majú všetky karty prác 16:9 = natívny pomer videí (Tržnica, Bodka, Semtex): rovnaká výška, bez orezu, bez pásikov (Denis 2026-09-06) */
  .work-media,.work-media--wide{aspect-ratio:16/9}
  [data-carousel]{--per:2}
  h1{font-size:clamp(44px,9vw,96px)!important}
  .hero-title{font-size:clamp(41px,8.5vw,90px)!important}  /* hero nadpis o ~6 % menší než ostatné h1 (Denis 2026-09-06) */
}
@media (max-width:640px){
  /* Telefón: hore tieň netreba (klip má nad sebou vlastné pozadie), ale zdola musí ísť
     gradient nahor – inak nadpis a text ležia priamo na svetlých miestach videa
     a nedajú sa prečítať. Denis 8. 9. 2026. */
  .hero-shade{background:linear-gradient(180deg,rgba(10,10,10,0) 0%,rgba(10,10,10,0) 30%,rgba(10,10,10,0.55) 58%,rgba(10,10,10,0.88) 80%,#0a0a0a 100%)}
  .hero--full .hero-shade{background:linear-gradient(180deg,rgba(10,10,10,0) 0%,rgba(10,10,10,0) 28%,rgba(10,10,10,0.5) 55%,rgba(10,10,10,0.86) 79%,#0a0a0a 100%)}
  .hero-media{background:#14181b}  /* farba pozadia mobilného klipu – plocha nad/pod videom s ním splynie */
  .hero-media img,.hero-media video{-webkit-mask-image:none;mask-image:none}
  /* mobilný klip je výrez 3:4 s robotom aj ženou – prispôsobí sa šírke, zvyšok hero je čierny ako video */
  .hero-media video.is-mobile-src{width:100%;height:auto;aspect-ratio:var(--pomer-mobil,3/4);max-height:none;transform:translate(-50%,0);
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 8%,#000 92%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 8%,#000 92%,transparent 100%)}
  .hero-media video.is-mobile-src.is-mobile-fill{width:auto;height:100%;max-height:100%;-webkit-mask-image:none;mask-image:none}
  .hero--full .hero-media{background:#14181b}
  .hero--full .hero-media video.is-mobile-src{width:100%;height:100%;object-fit:cover;transform:none;-webkit-mask-image:none;mask-image:none}
  /* hlavná strana: medzery nad nadpismi sekcií na polovicu (Denis 2026-09-06) */
  .works--band{padding-top:60px;padding-bottom:70px;margin-bottom:100px}
  .sec-pb200{padding-bottom:2.5rem}
  .band{padding-top:60px;padding-bottom:60px}
  .sec-team{padding-top:2.5rem}
  .partners{margin-top:60px;padding-top:36px;padding-bottom:36px}
  .footer{padding-top:2.25rem}
  .main{padding:0 1.25rem!important}
  .nav-inner{padding:0 1.25rem!important}
  .hero-inner{padding:0 1.25rem 3.5rem!important}
  [data-cols]{grid-template-columns:1fr!important}
  [data-cols] > *{grid-column:auto!important}
  [data-carousel]{--per:1}
  h1{font-size:clamp(38px,11vw,64px)!important;line-height:1!important}
  .hero-title{font-size:clamp(36px,10.3vw,60px)!important}
  h2{font-size:clamp(26px,8vw,40px)!important}
  [data-cols="12"]{row-gap:1.25rem!important;gap:1.25rem!important}
  .page-head,.hero{padding-top:8.75rem!important}
  .hero{min-height:80vh!important;min-height:80svh!important}
  .cta-row{gap:0.625rem}
  .cta-row .btn-accent{width:100%;justify-content:space-between}
  .note-pill{width:100%;justify-content:center;text-align:center;white-space:normal;padding:1.15rem 1.25rem;font-size:0.875rem;line-height:1.35}
  .footer{padding:2.25rem 0 6rem;gap:2rem}
  .cc-fab{left:16px;bottom:16px}
  .footer-row{margin-top:0.5rem}
  .footer-bottom{margin-top:1.5rem;row-gap:2rem}
  .footer-links{grid-column:1/13;justify-self:start;justify-content:flex-start;gap:0.5rem 1.5rem}
  .footer-contact{gap:1rem}
  .svc-row{padding:1.75rem}
  .stackm{display:block!important}
  .stackm > .svc,.stackm > .svc-row,.stackm > .ai-card{position:sticky;margin-bottom:1rem;min-height:19rem;box-shadow:0 -0.75rem 2.25rem rgba(0,0,0,0.55)}
  /* AI karty stoja na krémovom páse, tam by čierny tieň bol prisilný */
  .stackm > .ai-card{box-shadow:0 -0.625rem 1.75rem rgba(0,0,0,0.16)}
  .stackm > .ai-card--compact{min-height:15rem}
  .stackm > .svc:last-child,.stackm > .svc-row:last-child,.stackm > .ai-card:last-child{margin-bottom:0}
  .stackm > .svc:nth-child(1),.stackm > .svc-row:nth-child(1),.stackm > .ai-card:nth-child(1){top:5.5rem}
  .stackm > .svc:nth-child(2),.stackm > .svc-row:nth-child(2),.stackm > .ai-card:nth-child(2){top:5.95rem}
  .stackm > .svc:nth-child(3),.stackm > .svc-row:nth-child(3),.stackm > .ai-card:nth-child(3){top:6.4rem}
  .stackm > .svc:nth-child(4),.stackm > .svc-row:nth-child(4),.stackm > .ai-card:nth-child(4){top:6.85rem}
  .stackm > .svc:nth-child(5),.stackm > .svc-row:nth-child(5),.stackm > .ai-card:nth-child(5){top:7.3rem}
  .stackm > .svc:nth-child(6),.stackm > .svc-row:nth-child(6),.stackm > .ai-card:nth-child(6){top:7.75rem}
  .stackm > .svc:nth-child(n+7),.stackm > .svc-row:nth-child(n+7),.stackm > .ai-card:nth-child(n+7){top:8.2rem}
  .billing{grid-template-columns:1fr!important}
  .billing-card{padding:1.75rem}
  .billing-blocks{padding-top:1.75rem;gap:1.25rem}
  .billing-ids{gap:0.75rem}
  .billing-id{min-height:6.5rem;padding:1.125rem;gap:0.625rem}
  .billing-id--wide{grid-column:1/-1;min-height:0;flex-direction:row;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
  .billing-id--wide .billing-label{flex-basis:100%}
  .billing-id-value{font-size:1.125rem}
  .billing-id--mail .billing-id-value{font-size:1rem}
  .contact-card{min-height:0;gap:1.5rem;padding:1.5rem}
  .contact-value{font-size:1.375rem}
  .contact-address{font-size:1.375rem}
  .client-cta{grid-column:1/-1!important;aspect-ratio:auto;padding:1.5rem}
  .map-head{gap:1rem}
  .map-head .map-open{align-self:flex-start}
  .cal-sec{padding-bottom:4.5rem!important}
  .cal{grid-template-columns:1fr!important}
  .cal-sec{padding-bottom:4.5rem;gap:1.5rem}
  .cal-panel{padding:1.25rem}
  .cal-grid{gap:0.25rem}
  .cal-day{font-size:0.8125rem;border-radius:8px}
  .ref-sec{padding-bottom:4.5rem}
  .ref-thanks{font-size:0.875rem}
  .ref-box{padding:1.5rem}
  .testi{padding:1.5rem;min-height:0}
  .testi-logo,.testi-logo img,.testi-logo picture{height:auto;max-height:38px}
  .testi blockquote{font-size:1.0625rem}
  .map-sec{padding-bottom:4.5rem;gap:1rem}
  .map{height:clamp(380px,70vh,560px)}
  .map-head{justify-content:stretch}
  .map-open{flex:1;justify-content:space-between}
  .map-pin-ico{width:26px;height:26px}
  .map-pin-ico svg{width:15px;height:15px}
  .map-pin-brand{font-size:0.8125rem}
  .map-pin-text{font-size:0.625rem}
  .map-pin-nav{margin-left:0.125rem;padding-left:0.5rem;font-size:0.6875rem;gap:0.375rem}
  .map-pin-nav .arrow--24{width:20px;height:20px;font-size:0.6875rem}
  .map-poi span{font-size:0.625rem}
  .help{grid-template-columns:auto minmax(0,1fr);width:100%;padding:1.25rem;column-gap:1rem}
  .help-avatar{width:56px;height:56px}
  .help-actions{grid-column:1/-1}
  .help-btn{flex:1;justify-content:space-between}
  .sec-pb200{padding-bottom:2.5rem}
  .sec-pb160{padding-bottom:4.5rem}
  .sec-team{padding-top:2.5rem;scroll-margin-top:0}
  .team-grid,.clients-grid{grid-template-columns:repeat(2,1fr)!important;gap:1.25rem 0.75rem!important}
  /* telefón: žiadny karusel – logá v mriežke 2 stĺpce ako na /klienti; klon pre nekonečný pás sa skryje */
  .marquee{overflow:visible;cursor:default;touch-action:auto}
  .marquee-track{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem 0.75rem;transform:none!important}
  .marquee-track > [aria-hidden="true"]{display:none}
  .marquee .client-logo{flex-basis:auto}
  .client-logo{aspect-ratio:3/2}
  .client-logo--img{padding:0.85rem}
  .client-logo--img img{max-width:82%;max-height:68%}
  .team-join{grid-template-columns:1fr;justify-items:start;gap:1rem;padding:1.25rem;margin-top:1.25rem}
  .team-join .btn-dark-sm{grid-column:1;grid-row:auto}
  .team-join-title{font-size:1.0625rem;max-width:none}
  .member-name{font-size:0.9375rem}
  .member-role{font-size:0.75rem}
}
@media (max-width:400px){
  .main{padding:0 1rem!important}
  .nav-inner{padding:0 1rem!important}
  .hero-inner{padding:0 1rem 3rem!important}
  h1{font-size:clamp(32px,11vw,48px)!important}
  .hero-title{font-size:clamp(30px,10.3vw,45px)!important}
}

/* bočný panel článku na mobile: autor · dátum · čas čítania v jednom riadku, kopírovanie vľavo na vlastnom riadku (musí byť za základnými pravidlami .article-side) */
@media (max-width:960px){.article-grid{padding:1.5rem 0 4rem;row-gap:1.25rem}.media-16-8:empty{aspect-ratio:16/6}.article-grid .article-side{position:static;box-sizing:border-box;align-self:stretch!important;width:100%;max-width:100%;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:0.5rem 0.75rem;padding:0.75rem 0.9rem;border:1px solid var(--line);border-radius:18px;font-size:0.75rem}.article-grid .article-side .author{gap:0.5rem;min-width:0}.article-grid .article-side .author-avatar{width:32px;height:32px}.article-grid .article-side .author-role{display:none}.article-grid .article-side .side-field{flex-direction:row;align-items:center;gap:0.3rem;white-space:nowrap}.article-grid .article-side .side-field--line{padding-top:0;border-top:0}.article-grid .article-side .side-field:not(.side-field--share)::before{content:"·";color:var(--muted)}.article-grid .article-side .side-label{display:none}.article-grid .article-side .side-field--share{margin-left:0;flex-basis:100%;justify-content:flex-start}.article-grid .article-side .copy-btn{padding:0.4rem 0.7rem;font-size:0.7rem}}

/* ═══════════════════════════════════════════════════════════════════════════
   FARBY DETAILU REFERENCIE (pages/praca.php) — premenné pre riadenie z adminky
   ═══════════════════════════════════════════════════════════════════════════
   Každá premenná má ako fallback presne dnešnú hodnotu → kým ju nikto
   nenastaví, vzhľad detailu sa nemení.
   Premenné sa ZÁMERNE nedeklarujú na :root — nastavujú sa inline cez
   style_vars() na ktoromkoľvek predku (sekcia detailu / <main>), a pravidlá
   nižšie sú scopované na detail, aby tie isté triedy (.tag, .chip-dark,
   .gallery-item, .other-*) na ostatných stránkach ostali nedotknuté.

   HLAVIČKA      --w-title           nadpis práce                (var(--fg))
                 --w-lead            úvodný text                 (var(--muted2))
                 --w-back            odkaz „← všetky práce"      (var(--muted))
                 --w-chip-bg/-ink    čip s klientom              (var(--chip-dark) / var(--muted2))
                 --w-year            rok                         (var(--muted))
   ŠTÍTKY        --w-tag-bg/-line/-ink                bežný štítok (transparent / var(--line) / var(--muted2))
                 --w-tag-own-bg/-line/-ink            štítok „náš produkt" (#FF8000 / = bg / #fff)
   ĽAVÝ STĹPEC   --w-label           popisky polí                (var(--muted))
                 --w-value           hodnoty polí                (var(--fg))
   PILULKY TECH. --w-tech-bg/-ink    nezávislé od karty výsledkov;
                                     fallback na staré --pill-bg/--pill-ink (#FF8000 / #fff)
   TEXTY         --w-h2              nadpisy Výzva/Riešenie/Výsledky (var(--fg))
                 --w-body            odseky pod nimi             (var(--muted2))
   VÝSLEDKY      --w-res-bg          pozadie karty               (--res-card, inak #fff)
                 --w-res-icon        farba ikony                 (--res-ink, inak var(--accent))
                 --w-res-icon-knockout  výrez v ikone (fajka v krúžku) — musí kontrastovať
                                     s farbou ikony; default = pozadie karty, inak #fff
                 --w-res-value       veľké číslo/hodnota         (--res-ink, inak var(--accent))
                 --w-res-label       popis pod hodnotou          (--res-ink, inak var(--ink-muted))
                 --w-res-label-alpha priehľadnosť popisu na farebnej karte (.85;
                                     pri vlastnej --w-res-label nastav 1)
   GALÉRIA       --w-gallery-title   nadpis „Case study"         (var(--fg))
                 --w-gallery-bg      pozadie rámov ukážok        (var(--card))
   ĎALŠIE PRÁCE  --w-others-title    nadpis sekcie               (var(--fg))
                 --w-other-chip-bg/-ink  čip klienta na karte    (var(--chip-dark) / var(--muted2))
                 --w-other-title     názov práce na karte        (var(--fg))
   ═══════════════════════════════════════════════════════════════════════ */
.page-head--detail .page-title{color:var(--w-title,var(--fg))}
.page-head--detail .page-lead{color:var(--w-lead,var(--muted2))}
.page-head--detail .back,.page-head--detail .back:hover{color:var(--w-back,var(--muted))}
.page-head--detail .chip-dark{background:var(--w-chip-bg,var(--chip-dark));color:var(--w-chip-ink,var(--muted2))}
.page-head--detail .meta-year{color:var(--w-year,var(--muted))}
.page-head--detail .tag{background:var(--w-tag-bg,transparent);border-color:var(--w-tag-line,var(--line));color:var(--w-tag-ink,var(--muted2))}
.page-head--detail .tag--own{background:var(--w-tag-own-bg,#FF8000);border-color:var(--w-tag-own-line,var(--w-tag-own-bg,#FF8000));color:var(--w-tag-own-ink,#fff)}
.detail .detail-label{color:var(--w-label,var(--muted))}
.detail .detail-value{color:var(--w-value,var(--fg))}
.detail .tech-pill{background:var(--w-tech-bg,var(--pill-bg,#FF8000));color:var(--w-tech-ink,var(--pill-ink,#fff))}
.detail .detail-block h2{color:var(--w-h2,var(--fg))}
.detail .detail-block p{color:var(--w-body,var(--muted2))}
.detail .result{background:var(--w-res-bg,var(--res-card,#fff))}
/* --ic-knockout číta includes/icons.php (ikona „member") – výrez fajky v krúžku */
.detail .result-icon{color:var(--w-res-icon,var(--res-ink,var(--accent-on-light)));--ic-knockout:var(--w-res-icon-knockout,var(--w-res-bg,var(--res-card,#fff)))}
.detail .result-v{color:var(--w-res-value,var(--res-ink,var(--accent-on-light)))}
.detail .result-l{color:var(--w-res-label,var(--res-ink,var(--ink-muted)))}
.gallery .gallery-title{color:var(--w-gallery-title,var(--fg))}
.gallery .gallery-item{background:var(--w-gallery-bg,var(--card))}
.others .section-title{color:var(--w-others-title,var(--fg))}
.others .other-client{background:var(--w-other-chip-bg,var(--chip-dark));color:var(--w-other-chip-ink,var(--muted2))}
.others .other-title{color:var(--w-other-title,var(--fg))}

/* ── Hero na telefóne: štýly mobilného klipu bez čakania na JS ─────────────────
   Triedu .is-mobile-src pridáva main.js až po načítaní. Kým prišla, video sa medzitým
   vykreslilo v desktopovej podobe a výmena (maska + pomer strán) sa Chromu javila ako
   posun celej plochy – práve to robilo CLS 0,41 na telefóne, hoci sa nič nehýbalo.
   Podmienky sú tu zhodné s tými v JS: existuje mobilný klip (data-src-mobile) a okno je
   užšie ako 3:4. Pomer strán ide z posteru cez --pomer-mobil (inline z home.php).
   Namerané a overené 9. 9. 2026. */
@media (max-width:640px) and (max-aspect-ratio:3/4){
  .hero-media video[data-src-mobile]{width:100%;height:auto;aspect-ratio:var(--pomer-mobil,3/4);max-height:none;transform:translate(-50%,0);
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 8%,#000 92%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 8%,#000 92%,transparent 100%)}
  .hero--full .hero-media video[data-src-mobile]{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;transform:none;-webkit-mask-image:none;mask-image:none}
}