/* Grilla de videos (ra/videos-grilla): a = grande izq. + 3 · c = 3 + grande der. · b = 2 y 2 · d = grande arriba + 3 abajo.
   El primer video de a, c y d es el grande (al hacer clic en otro, pasa a ese lugar). */
.rvg{display:grid;gap:var(--vg-gap,1rem);grid-template-columns:minmax(0,1fr)}
.rvg-it{position:relative;display:flex;flex-direction:column;min-width:0;color:inherit;text-decoration:none}
.rvg-m{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:var(--vg-r,.1875rem);background:#000}
.rvg-m img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s cubic-bezier(.16,1,.3,1)}
.rvg-it:hover .rvg-m img{transform:scale(1.04)}
.rvg-m iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:4}
.rvg-k{display:block;font-weight:700;font-size:var(--vg-ks,.5625rem);letter-spacing:.14em;text-transform:uppercase;line-height:1.3;color:var(--vg-kc,var(--gamboge,#e39c18))}
.rvg .rvg-t{margin:.25rem 0 0;font-size:var(--vg-tss,.875rem);line-height:1.2;letter-spacing:-.01em;text-transform:none;color:var(--vg-tc,var(--tinta,#0e1f18))}
/* texto sobre la imagen */
.rvg-sobre .rvg-m::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to top,rgba(14,31,24,var(--vg-ov,.9)) 0%,rgba(14,31,24,calc(var(--vg-ov,.9)*.28)) 45%,transparent 70%)}
.rvg-sobre .rvg-tx{position:absolute;left:.875rem;right:.875rem;bottom:.75rem;z-index:2;pointer-events:none}
.rvg-sobre .rvg-t{color:var(--vg-tc,#fff)}
/* texto debajo */
.rvg-debajo .rvg-tx{display:block;padding:.625rem .125rem 0}
/* botón de play */
.rvg-pl{position:absolute;z-index:3;top:.75rem;right:.75rem;display:grid;place-items:center;box-sizing:border-box;width:var(--vg-pfs,2.125rem);height:var(--vg-pfs,2.125rem);border-radius:var(--vg-pr,50%);background:var(--vg-pbg,#fff);color:var(--vg-pc,var(--verde2,#03432d));border:var(--vg-pbw,0) solid var(--vg-pbc,transparent);transition:transform .3s cubic-bezier(.16,1,.3,1),background-color .2s,color .2s,border-color .2s}
.rvg-pl svg{width:var(--vg-pi,40%);height:var(--vg-pi,40%);display:block}
.rvg-pl svg.tri{translate:6% 0}
.rvg-it:hover .rvg-pl,.rvg-it:focus-visible .rvg-pl{transform:scale(1.1);background:var(--vg-phbg,var(--vg-pbg,#fff));color:var(--vg-phc,var(--vg-pc,var(--verde2,#03432d)));border-color:var(--vg-phc,var(--vg-pbc,transparent))}
.rvg-pl-centro .rvg-pl{top:50%;left:50%;right:auto;transform:translate(-50%,-50%)}
.rvg-pl-centro .rvg-it:hover .rvg-pl{transform:translate(-50%,-50%) scale(1.1)}
/* el grande */
.rvg:is(.rvg-a,.rvg-c,.rvg-d)>:first-child .rvg-pl{top:50%;left:50%;right:auto;width:var(--vg-pf,4rem);height:var(--vg-pf,4rem);transform:translate(-50%,-50%)}
.rvg:is(.rvg-a,.rvg-c,.rvg-d)>:first-child:hover .rvg-pl{transform:translate(-50%,-50%) scale(1.08)}
.rvg:is(.rvg-a,.rvg-c,.rvg-d)>:first-child .rvg-t,.rvg-b .rvg-t{font-size:var(--vg-ts,2rem);line-height:1.12;letter-spacing:-.02em;max-width:26ch}
.rvg-b .rvg-t{font-size:calc(var(--vg-ts,2rem)*.62)}
.rvg:is(.rvg-a,.rvg-c,.rvg-d)>:first-child .rvg-k{font-size:calc(var(--vg-ks,.5625rem)*1.25)}
.rvg-sobre:is(.rvg-a,.rvg-c,.rvg-d)>:first-child .rvg-tx{left:clamp(1rem,2.2vw,1.875rem);right:clamp(1rem,2.2vw,1.875rem);bottom:clamp(.875rem,2vw,1.75rem)}
.rvg-b .rvg-pl{top:50%;left:50%;right:auto;width:calc((var(--vg-pf,4rem) + var(--vg-pfs,2.125rem))/2);height:calc((var(--vg-pf,4rem) + var(--vg-pfs,2.125rem))/2);transform:translate(-50%,-50%)}
.rvg-b .rvg-it:hover .rvg-pl{transform:translate(-50%,-50%) scale(1.08)}
.rvg-sobre.rvg-b .rvg-tx{left:1.25rem;right:1.25rem;bottom:1.125rem}
/* reproduciendo: solo el video */
.rvg-it.on .rvg-pl,.rvg-it.on .rvg-m::after,.rvg-sobre .rvg-it.on .rvg-tx{display:none}
.rvg-it.fl{z-index:5;transform-origin:0 0;will-change:transform}
.rvg-it.fl .rvg-tx,.rvg-it.fl .rvg-pl{opacity:0}
.rvg-tx,.rvg-pl{transition:opacity .25s}

/* tablet: 2 y 2 se mantiene; los demás, grande arriba y 3 abajo */
@media (min-width:40.0625rem){
.rvg-b{grid-template-columns:repeat(2,minmax(0,1fr))}
.rvg:is(.rvg-a,.rvg-c,.rvg-d){grid-template-columns:repeat(3,minmax(0,1fr))}
.rvg:is(.rvg-a,.rvg-c,.rvg-d)>:first-child{grid-column:1/-1}
}
/* escritorio */
@media (min-width:64.0625rem){
.rvg.rvg-a{grid-template-columns:minmax(0,2.4fr) minmax(0,1fr)}
.rvg.rvg-c{grid-template-columns:minmax(0,1fr) minmax(0,2.4fr)}
.rvg:is(.rvg-a,.rvg-c)>:first-child{grid-column:auto;grid-row:1/span 3}
.rvg.rvg-c>:first-child{grid-column:2}
.rvg-c>:not(:first-child){grid-column:1}
.rvg:is(.rvg-a,.rvg-c)>:first-child .rvg-m{flex:1 1 auto;aspect-ratio:auto;min-height:12rem}
.rvg-d>:first-child .rvg-m{aspect-ratio:21/9}
.rvg-sobre:is(.rvg-a,.rvg-c)>:not(:first-child) .rvg-t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
}
@media (max-width:40rem){
.rvg .rvg-t{font-size:max(var(--vg-tss,.875rem),1rem)}
.rvg:is(.rvg-a,.rvg-c,.rvg-d)>:first-child .rvg-t,.rvg-b .rvg-t{font-size:min(var(--vg-ts,2rem),1.375rem)}
.rvg:is(.rvg-a,.rvg-c,.rvg-d)>:first-child .rvg-pl,.rvg-b .rvg-pl{width:calc(var(--vg-pf,4rem)*.8);height:calc(var(--vg-pf,4rem)*.8)}
}
@media (prefers-reduced-motion:reduce){.rvg-m img,.rvg-pl{transition:none}.rvg-it:hover .rvg-m img{transform:none}}