/* Regeneración Capilar Canary V6.2 — value cards directly below hero. */
@import url("./treatment-landing-capilar-v63-treatment-results.css");

body.zv-capilar-canary-v6 .zvtl5-value-rail{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  grid-auto-rows:1fr!important;
  align-items:stretch!important;
  gap:20px!important;
  width:100%!important;
  margin:34px 0 0!important;
  padding:0!important;
}

body.zv-capilar-canary-v6 .zvtl5-value,
body.zv-capilar-canary-v6 .zvtl5-value:first-child,
body.zv-capilar-canary-v6 .zvtl5-value:nth-child(n){
  grid-column:auto!important;
  grid-row:auto!important;
  align-self:stretch!important;
  justify-self:stretch!important;
  width:100%!important;
  min-width:0!important;
  min-height:220px!important;
  height:220px!important;
  margin:0!important;
  inset:auto!important;
  padding:28px 24px 26px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  border:1px solid rgba(184,141,51,.18)!important;
  border-radius:28px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 12px 34px rgba(76,55,35,.045)!important;
  overflow:hidden!important;
  position:relative!important;
  isolation:isolate!important;
  transition:transform .28s cubic-bezier(.2,.75,.2,1),border-color .28s ease,box-shadow .28s ease,background .28s ease!important;
}

body.zv-capilar-canary-v6 .zvtl5-value:not(:hover){
  transform:none!important;
}

body.zv-capilar-canary-v6 .zvtl5-value:before{
  content:""!important;
  position:absolute!important;
  z-index:-1!important;
  inset:-45% -90%!important;
  background:linear-gradient(108deg,transparent 37%,rgba(255,255,255,.1) 44%,rgba(255,244,213,.96) 50%,rgba(202,166,87,.22) 56%,transparent 65%)!important;
  transform:translateX(-55%) rotate(7deg)!important;
  opacity:0!important;
  transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .22s ease!important;
  pointer-events:none!important;
}

body.zv-capilar-canary-v6 .zvtl5-value:hover{
  transform:translateY(-7px)!important;
  border-color:rgba(184,141,51,.42)!important;
  background:linear-gradient(145deg,#fffdfa 0%,#f6e3bc 100%)!important;
  box-shadow:0 22px 52px rgba(112,79,37,.10)!important;
}

body.zv-capilar-canary-v6 .zvtl5-value:hover:before{
  transform:translateX(45%) rotate(7deg)!important;
  opacity:1!important;
}

body.zv-capilar-canary-v6 .zvtl5-value__icon{
  width:60px!important;
  height:60px!important;
  min-width:60px!important;
  margin:0 auto 18px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  border:1px solid rgba(184,141,51,.24)!important;
  background:#fff7e8!important;
  color:#B88D33!important;
  font-size:24px!important;
  line-height:1!important;
  box-shadow:0 12px 30px rgba(184,141,51,.09)!important;
  transition:transform .28s ease,background .28s ease,color .28s ease,box-shadow .28s ease!important;
}

body.zv-capilar-canary-v6 .zvtl5-value:hover .zvtl5-value__icon{
  transform:scale(1.08) rotate(-2deg)!important;
  background:#B88D33!important;
  color:#fff!important;
  box-shadow:0 14px 34px rgba(184,141,51,.22)!important;
}

body.zv-capilar-canary-v6 .zvtl5-value > p:nth-of-type(2){
  margin:0!important;
  max-width:260px!important;
}

body.zv-capilar-canary-v6 .zvtl5-value strong{
  display:block!important;
  margin:0!important;
  color:#2d251f!important;
  font-family:"Cormorant Garamond",serif!important;
  font-size:24px!important;
  font-weight:600!important;
  line-height:1.04!important;
  letter-spacing:-.02em!important;
}

body.zv-capilar-canary-v6 .zvtl5-value p:last-child{
  max-width:270px!important;
  margin:12px auto 0!important;
  color:#817166!important;
  font:500 11px/1.58 Manrope,sans-serif!important;
}

/* Keep a clear editorial pause between the diagnostic cards and treatments. */
body.zv-capilar-canary-v6 .zvtl5-value-rail + .zvtl5-treatments,
body.zv-capilar-canary-v6 .zvtl5-treatments{
  margin-top:52px!important;
  scroll-margin-top:28px;
}

@media(max-width:980px){
  body.zv-capilar-canary-v6 .zvtl5-value-rail{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:16px!important;
    margin-top:30px!important;
  }
  body.zv-capilar-canary-v6 .zvtl5-treatments{margin-top:44px!important}
  body.zv-capilar-canary-v6 .zvtl5-value,
  body.zv-capilar-canary-v6 .zvtl5-value:first-child,
  body.zv-capilar-canary-v6 .zvtl5-value:nth-child(n){
    height:205px!important;
    min-height:205px!important;
  }
}

@media(max-width:620px){
  body.zv-capilar-canary-v6 .zvtl5-value-rail{
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin-top:24px!important;
  }
  body.zv-capilar-canary-v6 .zvtl5-treatments{margin-top:34px!important}
  body.zv-capilar-canary-v6 .zvtl5-value,
  body.zv-capilar-canary-v6 .zvtl5-value:first-child,
  body.zv-capilar-canary-v6 .zvtl5-value:nth-child(n){
    height:auto!important;
    min-height:178px!important;
    padding:24px 20px!important;
  }
  body.zv-capilar-canary-v6 .zvtl5-value__icon{
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
    margin-bottom:14px!important;
  }
  body.zv-capilar-canary-v6 .zvtl5-value strong{font-size:23px!important}
}