/* EKOway V2 – komponent „vertikálne video z prevádzky“ (.vclips / .vclip). Pod .v2. Natívne HTML5 video, bez externých služieb. */
.v2 .vclips{display:grid;grid-template-columns:repeat(3,minmax(0,260px));gap:2rem clamp(1.5rem,4vw,3rem);justify-content:start}
.v2 .vclips--one{grid-template-columns:minmax(0,260px)}
.v2 .vclip{margin:0;min-width:0}
.v2 .vclip__stage{position:relative;aspect-ratio:9/16;border-radius:var(--r-m);overflow:hidden;background:var(--night)}
.v2 .vclip__poster,.v2 .vclip__stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.v2 .vclip__stage video{background:#000;object-fit:contain}
.v2 .vclip__play{position:absolute;inset:0;width:100%;height:100%;display:grid;place-items:center;border:0;padding:0;background:linear-gradient(to top,rgba(4,31,24,.38),rgba(4,31,24,0) 45%);cursor:pointer;color:var(--pine)}
.v2 .vclip__play span{display:grid;place-items:center;width:3.5rem;height:3.5rem;border-radius:50%;background:rgba(255,255,255,.94);transition:transform .15s,background-color .15s}
.v2 .vclip__play svg{width:1.4rem;height:1.4rem;margin-left:.15rem}
.v2 .vclip__play:hover span{transform:scale(1.06);background:#fff}
.v2 .vclip__play:focus-visible{outline:3px solid var(--lime);outline-offset:-3px}
.v2 .vclip__dur{position:absolute;right:.6rem;bottom:.6rem;padding:.15rem .5rem;border-radius:999px;background:rgba(4,31,24,.72);color:#fff;font-size:.8125rem;font-weight:600;line-height:1.4;pointer-events:none}
.v2 .vclip.is-playing .vclip__play,.v2 .vclip.is-playing .vclip__dur{display:none}
.v2 .vclip figcaption{margin-top:.75rem;font-weight:650;line-height:1.35;letter-spacing:-.01em}
.v2 .vclip__nojs{display:none}
html:not(.js) .v2 .vclip__play{display:none}
html:not(.js) .v2 .vclip__nojs{display:block;position:absolute;inset:auto 0 0 0;padding:.75rem;background:rgba(4,31,24,.8);color:#fff;font-size:.9rem}
.v2 .vclip__nojs a{color:var(--lime)}

/* tablet: tri stĺpce sa zmenšia; mobil: vodorovná galéria s prichytávaním */
@media (max-width:959px){.v2 .vclips{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}.v2 .vclips--one{grid-template-columns:minmax(0,260px)}}
@media (max-width:639px){
  .v2 .vclips:not(.vclips--one){display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gut) * -1);padding:0 var(--gut) .5rem;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
  .v2 .vclips:not(.vclips--one) .vclip{flex:0 0 min(68vw,250px);scroll-snap-align:start}
  .v2 .vclips:focus-visible{outline:3px solid var(--leaf);outline-offset:2px}
}

/* nadpis vľavo + videá vpravo (rozloženie .flow z v2-sluzby.css) */
.v2 .flow__lead{margin-top:1.25rem;color:var(--muted);line-height:1.55;max-width:26em}
@media (min-width:640px){
  .v2 .flow .vclips{grid-template-columns:repeat(3,minmax(0,260px));justify-content:start}
  .v2 .flow .vclips--one{grid-template-columns:minmax(0,260px)}
}
@media (min-width:640px) and (max-width:959px){.v2 .flow .vclips{grid-template-columns:repeat(3,minmax(0,1fr))}.v2 .flow .vclips--one{grid-template-columns:minmax(0,260px)}}
.v2 .flow>div{min-width:0}

/* ---------- Spoločná sekcia: nadpis | vertikálne MP4 | horizontálne Vimeo (rovnaká výška videí) ----------
   Výška h sa odvodzuje od šírky kontajnera: šírka MP4 = h·9/16, šírka Vimeo = h·16/9 → h = (šírka − nadpis − 2·medzera) / (9/16 + 16/9). */
.v2 .vmix-box{container-type:inline-size}
.v2 .vmix{--gap:clamp(1.25rem,3cqw,3rem);--hd:clamp(9.5rem,17cqw,13rem);--h:calc((100cqw - var(--hd) - 2*var(--gap)) * 144 / 337);
  display:grid;grid-template-columns:var(--hd) calc(var(--h) * 9 / 16) calc(var(--h) * 16 / 9);gap:var(--gap);align-items:start}
.v2 .vmix__head .h2{color:#fff;font-size:clamp(1.6rem,2.6cqw,2.25rem);overflow-wrap:anywhere}
.v2 .vmix .vclip,.v2 .vmix .sd-video{min-width:0}
.v2 .vmix .vclip figcaption{color:#fff}
.v2 .vmix .sd-video{max-width:none;margin:0}
.v2 .vmix .sd-video__ask{padding:clamp(.9rem,2.2cqw,1.75rem)}
.v2 .vmix .sd-video__notice{font-size:clamp(.8125rem,1.15cqw + .3rem,1rem);margin-bottom:.75rem}
/* tablet a mobil: nadpis, vertikálne video, potom Vimeo (výšky podľa pomerov strán; rovnaká výška platí len na desktope vedľa seba) */
@media (max-width:959px){
  .v2 .vmix{--gap:1.5rem;grid-template-columns:minmax(0,1fr)}
  .v2 .vmix__v{max-width:250px}
}
@media (min-width:960px){.v2 .vmix .vclip__stage,.v2 .vmix .sd-video__stage{aspect-ratio:auto;height:var(--h)}}