/* Ondo Vertical Token Slider — Fixed v1.0.2 */
.ovtsf{ position:relative; width:100%; }
.ovtsf-inner{ position:relative; display:flex; gap:40px; align-items:stretch; }
.ovtsf-left{ flex:1 1 auto; min-height:280px; display:flex; align-items:center; }
.ovtsf-content{ max-width:720px; }
.ovtsf-title{ margin:0 0 10px; font-size:28px; line-height:1.25; font-weight:800; color:#111; }
.ovtsf-text{ margin:0; font-size:16px; line-height:1.6; color:#111; opacity:.9; }

/* Right column */
.ovtsf-right{ flex:0 0 var(--ovtsf-right, 440px); position:relative; }
.ovtsf-logos{ position:relative; width:100%; height:520px; margin:0 auto; }

/* Logo slots */
.ovtsf-logo-slot{
  position:absolute; left:50%; transform:translate(-50%, -50%) scale(.8);
  width:75%; height:86px; top:50%;
  display:flex; align-items:center; justify-content:center;
  opacity:.25; transition:transform .4s cubic-bezier(.2,.8,.2,1), opacity .3s ease, filter .3s ease, top .3s ease;
}
.ovtsf-logo{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
.ovtsf-logo img{ max-height:100%; max-width:100%; object-fit:contain; display:block; }

/* Increased vertical distance between stacked logos */
.ovtsf-logo-slot.n1{ top:22%; transform:translate(-50%, -50%) scale(.75); opacity:.2; } /* above (was ~30%) */
.ovtsf-logo-slot.p1{ top:78%; transform:translate(-50%, -50%) scale(.75); opacity:.2; } /* below (was ~70%) */
.ovtsf-logo-slot.pos0{ top:50%; transform:translate(-50%, -50%) scale(1); width:85%; height:120px; opacity:1; z-index:5; }

/* Activation pulse */
.ovtsf-logo-slot.becoming-active{ animation: ovtsf-grow .34s cubic-bezier(.2,.8,.2,1); }
@keyframes ovtsf-grow{
  0%{ transform:translate(-50%,-50%) scale(.94) }
  70%{ transform:translate(-50%,-50%) scale(1.02) }
  100%{ transform:translate(-50%,-50%) scale(1) }
}

/* Nav */
.ovtsf-nav{ position:absolute; bottom:0; right:0; display:flex; gap:10px; }
.ovtsf-nav button{
  width:40px; height:40px; border-radius:10px; background:#fff; border:1px solid rgba(0,0,0,.14);
  box-shadow:0 6px 24px rgba(0,0,0,.12); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.15s ease;
}
.ovtsf-nav button:hover{ transform:translateY(-1px); box-shadow:0 10px 26px rgba(0,0,0,.16); }
.ovtsf-prev::before, .ovtsf-next::before{
  content:''; display:block; width:18px; height:18px; background:#111;
  -webkit-mask-size:18px 18px; mask-size:18px 18px; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-position:center; mask-position:center;
}
.ovtsf-prev::before{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M14.7 6.3a1 1 0 010 1.4L10.42 12l4.3 4.3a1 1 0 11-1.42 1.4l-5-5a1 1 0 010-1.4l5-5a1 1 0 011.4 0z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M14.7 6.3a1 1 0 010 1.4L10.42 12l4.3 4.3a1 1 0 11-1.42 1.4l-5-5a1 1 0 010-1.4l5-5a1 1 0 011.4 0z"/></svg>'); }
.ovtsf-next::before{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M9.3 17.7a1 1 0 010-1.4L13.58 12 9.3 7.7A1 1 0 1110.7 6.3l5 5a1 1 0 010 1.4l-5 5a1 1 0 01-1.4 0z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M9.3 17.7a1 1 0 010-1.4L13.58 12 9.3 7.7A1 1 0 1110.7 6.3l5 5a1 1 0 010 1.4l-5 5a1 1 0 01-1.4 0z"/></svg>'); }

/* MOBILE: full-width columns + single centered logo */
@media (max-width: 767px){
  .ovtsf-inner{ flex-direction:column; gap:28px; }
  .ovtsf-left, .ovtsf-right{
    width:100% !important;
    max-width:none !important;
    flex:0 0 100% !important;
  }
  .ovtsf-logos{ height:320px; }
  .ovtsf-logo-slot{ display:none; }
  .ovtsf-logo-slot.pos0{ display:flex; } /* only the active logo on mobile */
  .ovtsf-nav{ right:12px; bottom:8px; }
}
