/* v12: stable v10 base, media and conversion copy only */
.media-slide:after{height:32%;background:linear-gradient(180deg,transparent,rgba(22,10,15,.82))}
.media-slide>span{display:grid;gap:4px;text-shadow:0 2px 16px rgba(0,0,0,.65)}
.media-slide>span small{display:block;color:rgba(255,255,255,.78);font-size:9px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.media-slide video{background:#eadfe1}
@media(max-width:680px){
  .media-slide>span{font-size:14px;max-width:calc(100% - 30px)}
  .media-slide>span small{font-size:8px}
}

/* v12.1 — mobile hero cards must stay in normal document flow */
@media(max-width:680px){
  .hero-visual{
    display:flex!important;
    flex-direction:column!important;
    gap:12px!important;
    min-height:auto!important;
    overflow:visible!important;
  }
  .hero-photo{
    order:1!important;
    margin:0!important;
  }
  .real-product-card{
    position:relative!important;
    order:2!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:calc(100% - 20px)!important;
    max-width:none!important;
    margin:-30px auto 0!important;
    box-sizing:border-box!important;
    z-index:4!important;
  }
  .social-proof-mini{
    position:relative!important;
    order:3!important;
    inset:auto!important;
    width:100%!important;
    margin:0!important;
    padding:2px 4px 0!important;
    box-sizing:border-box!important;
    align-items:flex-start!important;
  }
  .social-proof-mini p{min-width:0!important;font-size:12px!important}
}