/* vidflare · r20 — bento grande: tarjetas más juntas, descripciones de tres líneas, ilustración DSGVO */

.vf-bn{gap:12px!important}
.vf-bn .bento_col{gap:12px}
.vf-bn_c .content_wrap p{margin:0;font-size:1.0625rem;line-height:1.5;text-wrap:balance;min-height:4.5em}   /* 3 líneas */
.vf-bn_c.is-2 .content_wrap p{max-width:21em}
.vf-bn_c.is-6 .content_wrap p{max-width:33em}
@media (max-width:991px){.vf-bn_c .content_wrap p{min-height:0;max-width:none!important}}

/* ── DSGVO: 1) cada dato se cifra al pasar el haz y recibe su candado  2) el flujo completo ocurre dentro de Alemania ── */
.vf-enc{display:grid;gap:28px;width:100%;--T:6s}
.vf-enc_top{display:flex;align-items:center;gap:18px}
.vf-enc .vf-il_pk{position:relative;flex:1;max-width:none;gap:6px}
.vf-enc .vf-il_pk span{align-items:center;padding:7px 8px 7px 11px}
.vf-enc .vf-il_pk u{flex:none;display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:rgba(255,255,255,.14);text-decoration:none;animation:vf-enc-ok var(--T) var(--vf-ease) infinite;animation-delay:calc(var(--i)*.35s)}
.vf-enc .vf-il_pk u svg{width:12px;height:12px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@keyframes vf-enc-ok{0%,30%{background:rgba(255,255,255,.14);scale:1}38%{background:#28C76F;scale:1.25}46%,86%{background:#28C76F;scale:1}96%,100%{background:rgba(255,255,255,.14)}}
.vf-enc_beam{position:absolute;top:-4px;bottom:-4px;left:0;width:2px;border-radius:2px;background:linear-gradient(180deg,transparent,#C4BEF7 20%,#fff 50%,#C4BEF7 80%,transparent);box-shadow:0 0 14px 3px rgba(196,190,247,.7);opacity:0;animation:vf-enc-beam var(--T) cubic-bezier(.5,0,.3,1) infinite}
@keyframes vf-enc-beam{0%,24%{left:22%;opacity:0}28%{opacity:1}44%{left:100%;opacity:1}50%,100%{left:100%;opacity:0}}
.vf-enc_core{position:relative;flex:none;display:grid;justify-items:center;gap:10px;width:108px}
.vf-enc_core span{position:relative;z-index:1;display:grid;place-items:center;width:52px;height:52px;margin:14px 0;border-radius:16px;background:#fff;box-shadow:0 12px 30px -8px rgba(0,0,0,.55);animation:vf-enc-lock var(--T) cubic-bezier(.3,1.6,.5,1) infinite}
.vf-enc_core span svg{width:26px;height:26px;fill:none;stroke:var(--vf-purple);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.vf-enc_ring{position:absolute;left:50%;top:0;width:80px;height:80px;margin-left:-40px;border-radius:50%;border:1.5px dashed rgba(255,255,255,.4);animation:vf-enc-spin 24s linear infinite}
.vf-enc_ring::after{content:"";position:absolute;inset:-9px;border-radius:50%;box-shadow:0 0 0 1.5px rgba(196,190,247,.55);opacity:0;animation:vf-enc-wave var(--T) ease-out infinite}
@keyframes vf-enc-spin{to{rotate:360deg}}
@keyframes vf-enc-lock{0%,40%,56%,100%{scale:1}46%{scale:1.14}}
@keyframes vf-enc-wave{0%,42%{opacity:0;scale:.7}48%{opacity:1;scale:.85}70%,100%{opacity:0;scale:1.35}}
.vf-enc_core b{padding:3px 9px;border-radius:6px;background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);font:500 10px/1.4 var(--vf-mono);white-space:nowrap}
.vf-enc_zone{position:relative;padding:20px 14px 12px;border-radius:12px;border:1.5px dashed rgba(255,255,255,.3)}
.vf-enc_zone small{position:absolute;left:12px;top:-9px;padding:2px 8px;border-radius:999px;background:#fff;color:var(--vf-ink);font:500 10px/1.4 var(--vf-mono);white-space:nowrap}
.vf-enc_zone ol{position:relative;display:flex;justify-content:space-between;margin:0;padding:14px 0 0;list-style:none;font:500 10.5px/1.2 var(--vf-mono);color:rgba(255,255,255,.75)}
.vf-enc_zone ol::before{content:"";position:absolute;left:4px;right:4px;top:4px;height:1.5px;background:rgba(255,255,255,.25)}
.vf-enc_zone li{position:relative;white-space:nowrap}
.vf-enc_zone li::before{content:"";position:absolute;left:0;top:-14px;width:9px;height:9px;border-radius:50%;background:#3B2470;box-shadow:0 0 0 1.5px rgba(255,255,255,.6)}
.vf-enc_zone li:last-child{text-align:right}.vf-enc_zone li:last-child::before{left:auto;right:0}
.vf-enc_zone li:nth-child(2)::before,.vf-enc_zone li:nth-child(3)::before{left:50%;margin-left:-4.5px}
.vf-enc_zone li:nth-child(2),.vf-enc_zone li:nth-child(3){text-align:center}
.vf-enc_dot{position:absolute;left:18px;top:37px;width:9px;height:9px;margin:-4.5px;border-radius:50%;background:#5FFF6D;box-shadow:0 0 12px 2px rgba(95,255,109,.8);animation:vf-enc-run var(--T) cubic-bezier(.6,0,.3,1) infinite}
@keyframes vf-enc-run{0%,46%{left:18px;opacity:0}50%{left:18px;opacity:1}90%{left:calc(100% - 18px);opacity:1}96%,100%{left:calc(100% - 18px);opacity:0}}
.vf-paused .vf-enc *{animation-play-state:paused}
@media (max-width:420px){.vf-enc_core{width:84px}.vf-enc_zone ol{font-size:9px}}
@media (prefers-reduced-motion:reduce){.vf-enc *,.vf-enc *::after{animation:none!important}.vf-enc_beam,.vf-enc_dot{display:none}.vf-enc .vf-il_pk u{background:#28C76F}}

/* ── Hero · anuncios temáticos (.vf-ad2) ──
   Causa medida: el contenedor llevaba padding en cqw, que se resuelve contra el producto (56 px), y las unidades cqw de los hijos
   se miden sobre la caja de contenido: en 9:16 (130 px de ancho) quedaban 17 px útiles y el titular a 2 px.
   El contenedor va ahora sin padding ni gap; los márgenes los ponen los hijos, en cqw del propio anuncio. */
.vf-h12_view .vf-ad2{padding:0;gap:0}
.vf-h12_view .vf-ad2>span,.vf-h12_view .vf-ad2>b,.vf-h12_view .vf-ad2>small,.vf-h12_view .vf-ad2>strong{position:relative;margin:0 13cqw;transition:font-size .5s var(--vf-ease),margin .5s var(--vf-ease)}
.vf-h12_view .vf-ad2>span{font-size:1.8cqw;margin-bottom:1.6cqw}
.vf-h12_view .vf-ad2>b{font-size:5.2cqw;margin-bottom:1.6cqw}
.vf-h12_view .vf-ad2>small{font-size:2.2cqw;margin-bottom:2.4cqw}
.vf-h12_view .vf-ad2>strong{font-size:2.5cqw;padding:1cqw 2cqw;margin-top:0;margin-bottom:11cqw}
.vf-h12_view .vf-ad2.is-916>span,.vf-h12_view .vf-ad2.is-916>b,.vf-h12_view .vf-ad2.is-916>small,.vf-h12_view .vf-ad2.is-916>strong{margin-left:9cqw;margin-right:9cqw}
.vf-h12_view .vf-ad2.is-916>span{font-size:5.2cqw;margin-bottom:4cqw}
.vf-h12_view .vf-ad2.is-916>b{font-size:10.8cqw;margin-bottom:4cqw}
.vf-h12_view .vf-ad2.is-916>small{font-size:6.4cqw;margin-bottom:6cqw}
.vf-h12_view .vf-ad2.is-916>strong{font-size:6.6cqw;padding:2.6cqw 5cqw;margin-bottom:16cqw}