/* DAN Videos — carrusel de videos verticales 9:16 (prefijo dv-) */
.dv-wrap{max-width:1200px;margin:0 auto;padding:32px 0 48px;color:#171d4b;box-sizing:border-box}
.dv-wrap *,.dv-wrap *::before,.dv-wrap *::after{box-sizing:border-box}
.dv-wrap .dv-title{text-align:center;margin:0 16px 28px;color:#171d4b;font-size:clamp(24px,3vw,34px);line-height:1.2}
.dv-stage{position:relative}

.dv-track{position:relative;display:flex;gap:20px;overflow-x:auto;overflow-y:hidden;padding:6px 16px 10px;
  scroll-snap-type:x mandatory;scroll-padding-inline:16px;scrollbar-width:none;-webkit-overflow-scrolling:touch;outline:none}
.dv-track::-webkit-scrollbar{display:none}
.dv-track:focus-visible{outline:2px solid #1a6fbd;outline-offset:2px}
.dv-card{flex:0 0 auto;width:clamp(220px,21vw,264px);scroll-snap-align:start}
/* auto-margins: centran las tarjetas si caben; si desbordan valen 0 y se desliza */
.dv-card:first-child{margin-left:auto}
.dv-card:last-child{margin-right:auto}

.dv-frame{position:relative;aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:#000;border:3px solid #171d4b}
.dv-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#000}

/* Botones: se fuerzan estilos para ganarle a los <button> globales de Astra/Elementor */
.dv-wrap button.dv-toggle,.dv-wrap button.dv-mute,.dv-wrap button.dv-arrow,.dv-wrap button.dv-dot{
  -webkit-appearance:none;appearance:none;margin:0;font:inherit;line-height:1;text-transform:none;letter-spacing:0;box-shadow:none;min-height:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.dv-wrap button.dv-toggle{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;border-radius:0;background:transparent;display:flex;align-items:center;justify-content:center}
.dv-wrap button.dv-toggle:hover,.dv-wrap button.dv-toggle:focus{background:transparent}
.dv-wrap button.dv-toggle:focus-visible{outline:3px solid #1a6fbd;outline-offset:-6px}
.dv-icon{width:56px;height:56px;border-radius:50%;background:rgba(23,29,75,.75);display:flex;align-items:center;justify-content:center;transition:opacity .2s,transform .2s}
.dv-icon svg{width:22px;height:22px;fill:#fff;margin-left:3px}
.dv-playing .dv-icon{opacity:0;transform:scale(.8)}

.dv-wrap button.dv-mute{position:absolute;top:10px;right:10px;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:rgba(23,29,75,.75);
  display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .2s;z-index:2}
.dv-wrap button.dv-mute:hover,.dv-wrap button.dv-mute:focus{background:rgba(23,29,75,.9)}
.dv-mute svg{width:20px;height:20px;fill:#fff}
.dv-mute .dv-i-off{display:none}
.dv-card.dv-muted .dv-mute .dv-i-on{display:none}
.dv-card.dv-muted .dv-mute .dv-i-off{display:block}
.dv-playing .dv-mute{opacity:1;pointer-events:auto}

.dv-bar{position:absolute;left:0;right:0;bottom:0;height:18px;cursor:pointer;opacity:0;transition:opacity .2s;z-index:2}
.dv-bar::before{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.35)}
.dv-bar span{position:absolute;left:0;right:0;bottom:0;height:4px;background:#1a6fbd;transform:scaleX(0);transform-origin:left}
.dv-playing .dv-bar{opacity:1}

.dv-cap{padding:12px 4px 0;text-align:center}
.dv-wrap .dv-name{margin:0;font-size:14px;font-weight:600;line-height:1.35;color:#171d4b}
.dv-wrap .dv-desc{margin:4px 0 0;font-size:13px;line-height:1.35;color:#5a5f7d}

/* Flechas (escritorio, solo si hay desborde) */
.dv-wrap button.dv-arrow{position:absolute;top:calc(50% - 40px);width:42px;height:42px;padding:0;border:1.5px solid #171d4b;border-radius:8px;
  background:rgba(255,255,255,.94);color:#171d4b;display:none;align-items:center;justify-content:center;z-index:3;transition:background .15s,color .15s}
.dv-wrap button.dv-arrow:hover,.dv-wrap button.dv-arrow:focus{background:#171d4b;color:#fff}
.dv-wrap button.dv-arrow:disabled{opacity:.35;cursor:default;background:rgba(255,255,255,.94);color:#171d4b}
.dv-prev{left:6px}
.dv-next{right:6px}
.dv-wrap.dv-scrollable button.dv-arrow{display:flex}

/* Puntos (móvil) */
.dv-dots{display:none;justify-content:center;align-items:center;gap:6px;margin-top:14px}
.dv-wrap button.dv-dot{width:6px;height:6px;padding:0;border:0;border-radius:50%;background:#ccc;transition:width .2s,background .2s}
.dv-wrap button.dv-dot:hover,.dv-wrap button.dv-dot:focus{background:#ccc}
.dv-wrap button.dv-dot.is-active,.dv-wrap button.dv-dot.is-active:hover{width:20px;border-radius:3px;background:#1a6fbd}
.dv-scrollable .dv-dots{display:flex}

@media (min-width:768px){
  .dv-dots{display:none !important}
}
@media (max-width:767px){
  .dv-wrap{padding:24px 0 36px}
  .dv-track{gap:14px}
  .dv-card{width:min(68vw,280px)}
  .dv-wrap button.dv-arrow{display:none !important}
}
@media (prefers-reduced-motion:reduce){
  .dv-track{scroll-behavior:auto}
  .dv-icon,.dv-mute,.dv-bar{transition:none}
}