/* ============================================================
   OVIA Marketplace Phase 7.21 — Premium Health Product Showcase
   Replaces old brands/PV/trust blocks with five live products.
   ============================================================ */

.ovia-health-showcase{
  margin-top:16px!important;
  padding:22px!important;
  border:1px solid #dce6f1!important;
  border-radius:16px!important;
  background:
    radial-gradient(circle at 92% 4%,rgba(23,161,102,.10),transparent 23%),
    radial-gradient(circle at 5% 100%,rgba(7,91,225,.07),transparent 24%),
    linear-gradient(180deg,#ffffff 0%,#fbfdff 100%)!important;
  box-shadow:0 10px 32px rgba(10,48,91,.055)!important;
}

.ovia-health-head{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:28px!important;
  margin-bottom:18px!important;
}
.ovia-health-head>div{max-width:760px!important}
.ovia-health-kicker{
  display:inline-flex!important;
  align-items:center!important;
  min-height:24px!important;
  padding:0 9px!important;
  border-radius:999px!important;
  background:#eaf8f1!important;
  color:#0b8f58!important;
  font-size:8.5px!important;
  font-weight:900!important;
  letter-spacing:.10em!important;
}
.ovia-health-head h2{
  margin:8px 0 5px!important;
  color:#10345a!important;
  font-size:24px!important;
  line-height:1.06!important;
  letter-spacing:-.025em!important;
}
.ovia-health-head p{
  margin:0!important;
  color:#647a92!important;
  font-size:11px!important;
  line-height:1.5!important;
}
.ovia-health-head>a{
  min-height:38px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  padding:0 14px!important;
  border-radius:8px!important;
  background:linear-gradient(100deg,#075be1,#0877f0)!important;
  color:#fff!important;
  font-size:9.5px!important;
  font-weight:900!important;
  white-space:nowrap!important;
  box-shadow:0 7px 18px rgba(7,91,225,.16)!important;
}

.ovia-health-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:13px!important;
}
.ovia-health-card{
  position:relative!important;
  min-width:0!important;
  overflow:hidden!important;
  border:1px solid #dce6ef!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:0 8px 22px rgba(9,47,89,.055)!important;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important;
}
.ovia-health-card:hover{
  transform:translateY(-4px)!important;
  border-color:#bfd9d0!important;
  box-shadow:0 15px 34px rgba(7,73,94,.11)!important;
}
.ovia-health-card:after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:4px!important;
  background:linear-gradient(90deg,#0ca36a,#14b98a,#075be1)!important;
}

.ovia-health-card-top{
  position:absolute!important;
  left:10px!important;
  right:10px!important;
  top:10px!important;
  z-index:3!important;
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:6px!important;
  pointer-events:none!important;
}
.ovia-health-no{
  width:28px!important;
  height:28px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:8px!important;
  background:#10345a!important;
  color:#fff!important;
  font-size:8px!important;
  font-weight:900!important;
}
.ovia-health-pv{
  min-height:25px!important;
  display:inline-flex!important;
  align-items:center!important;
  padding:0 8px!important;
  border-radius:999px!important;
  background:#e7f8ee!important;
  color:#0a8d54!important;
  border:1px solid #c9ead8!important;
  font-size:7.5px!important;
  font-weight:900!important;
}

.ovia-health-image{
  height:205px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 25%,rgba(14,161,103,.08),transparent 40%),
    linear-gradient(145deg,#f9fcfb,#eef7f4)!important;
  border-bottom:1px solid #e6edf2!important;
}
.ovia-health-image img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  padding:16px!important;
  transition:transform .24s ease!important;
}
.ovia-health-card:hover .ovia-health-image img{
  transform:scale(1.045)!important;
}

.ovia-health-body{
  padding:13px 13px 15px!important;
}
.ovia-health-category{
  color:#0b9560!important;
  font-size:7.5px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.07em!important;
  text-transform:uppercase!important;
}
.ovia-health-body h3{
  min-height:38px!important;
  margin:6px 0 6px!important;
  font-size:13px!important;
  line-height:1.25!important;
}
.ovia-health-body h3 a{
  color:#12395f!important;
  text-decoration:none!important;
}
.ovia-health-rating{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  min-height:17px!important;
}
.ovia-health-rating span{
  color:#f2a000!important;
  font-size:9px!important;
  letter-spacing:.02em!important;
}
.ovia-health-rating small{
  color:#8090a2!important;
  font-size:7.5px!important;
}
.ovia-health-price{
  margin-top:7px!important;
  display:flex!important;
  align-items:baseline!important;
  gap:6px!important;
  flex-wrap:wrap!important;
}
.ovia-health-price strong{
  color:#10345a!important;
  font-size:16px!important;
  line-height:1!important;
}
.ovia-health-price del{
  color:#8b99a8!important;
  font-size:8.5px!important;
}

.ovia-health-actions{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  gap:7px!important;
  margin-top:11px!important;
}
.ovia-health-actions .mp-add-cart{
  min-height:36px!important;
  border:0!important;
  border-radius:8px!important;
  background:linear-gradient(100deg,#0b9d62,#10b579)!important;
  color:#fff!important;
  font-size:9px!important;
  font-weight:900!important;
  cursor:pointer!important;
  box-shadow:0 6px 14px rgba(11,157,98,.16)!important;
}
.ovia-health-actions>a{
  min-height:36px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 10px!important;
  border:1px solid #cddae7!important;
  border-radius:8px!important;
  background:#f8fbfe!important;
  color:#14518d!important;
  font-size:8.5px!important;
  font-weight:900!important;
}

.ovia-health-confidence{
  margin-top:14px!important;
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  border:1px solid #dce6ef!important;
  border-radius:11px!important;
  overflow:hidden!important;
  background:#fff!important;
}
.ovia-health-confidence>div{
  min-height:58px!important;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  padding:10px 13px!important;
  border-right:1px solid #e4ebf2!important;
}
.ovia-health-confidence>div:last-child{border-right:0!important}
.ovia-health-confidence i{
  width:30px!important;
  height:30px!important;
  flex:0 0 30px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:#edf7f3!important;
  color:#0b9560!important;
  font-size:9px!important;
  font-style:normal!important;
  font-weight:900!important;
}
.ovia-health-confidence b{
  display:block!important;
  color:#173a5d!important;
  font-size:9px!important;
}
.ovia-health-confidence small{
  display:block!important;
  margin-top:2px!important;
  color:#71849a!important;
  font-size:7.5px!important;
  line-height:1.25!important;
}

@media(max-width:1200px){
  .ovia-health-grid{grid-template-columns:repeat(3,1fr)!important}
  .ovia-health-card:nth-child(n+4){display:none!important}
}
@media(max-width:760px){
  .ovia-health-showcase{padding:16px!important}
  .ovia-health-head{align-items:flex-start!important;flex-direction:column!important;gap:12px!important}
  .ovia-health-head h2{font-size:21px!important}
  .ovia-health-grid{
    display:flex!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
    gap:10px!important;
    padding-bottom:4px!important;
  }
  .ovia-health-card{
    flex:0 0 78%!important;
    scroll-snap-align:start!important;
  }
  .ovia-health-card:nth-child(n+4){display:block!important}
  .ovia-health-image{height:220px!important}
  .ovia-health-confidence{
    grid-template-columns:1fr 1fr!important;
  }
  .ovia-health-confidence>div:nth-child(2){border-right:0!important}
  .ovia-health-confidence>div:nth-child(-n+2){border-bottom:1px solid #e4ebf2!important}
}