/* VitaGen V43: edge-to-edge editorial photography and compact mobile hero.
   Specific to homepage and NovoDailies detail hero; the remainder of the site is untouched. */
html body.page-v40-home .hero.hero-persona,
html body.page-v40-supplements .detail-hero.hero-persona{
  isolation:isolate;
  overflow:hidden;
  background:#f4f9f8!important;
}
/* Previously layered background graphics are replaced by an unobtrusive
   left-to-right veil, keeping contrast reliable for every line of text. */
html body.page-v40-home .hero.hero-persona::before,
html body.page-v40-supplements .detail-hero.hero-persona::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(90deg,
    #f4f9f8 0%,
    rgba(244,249,248,.995) 23%,
    rgba(244,249,248,.96) 34%,
    rgba(244,249,248,.77) 47%,
    rgba(244,249,248,.21) 63%,
    rgba(244,249,248,0) 79%)!important;
}
/* DNA watermark remains behind the copy, not a separate visual card. */
html body .hero-persona::after{z-index:1!important;opacity:.034!important;}
html body .hero-persona .hero-fullbleed-photo{
  position:absolute;
  inset:0 0 0 auto;
  z-index:0;
  display:block;
  width:62.5%;
  height:100%;
  overflow:hidden;
  pointer-events:none;
  border:none;
  border-radius:0;
  box-shadow:none;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.13) 13%,#000 39%);
  mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.13) 13%,#000 39%);
}
html body .hero-persona .hero-fullbleed-photo img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:51% 49%;
  transform:scale(1.035);
  animation:v43-arrive 1.55s cubic-bezier(.22,.65,.25,1) both;
}
@keyframes v43-arrive{
  from{opacity:.62;transform:scale(1.09) translateX(1.2%)}
  to{opacity:1;transform:scale(1.035) translateX(0)}
}
html body .hero-persona .hero-persona-inner,
html body .hero-persona--detail .hero-persona-inner{
  display:block!important;
  grid-template-columns:none!important;
  position:relative!important;
  z-index:2!important;
}
html body .hero-persona .hero-persona-copy,
html body.novodailies-only .detail-hero.hero-persona .detail-copy{
  max-width:620px!important;
  position:relative;
  z-index:2;
}
html body .hero-persona .hero-persona-copy h1,
html body.novodailies-only .detail-hero.hero-persona .detail-copy h1{
  max-width:630px!important;
}
html body .hero-persona .hero-value-card{
  backdrop-filter:blur(12px);
}
html body .hero-persona .hero-proof-line{
  position:relative;
  z-index:2;
  margin:17px 0 0;
  max-width:550px;
  padding:0 0 0 15px;
  border-left:2px solid rgba(178,136,87,.55);
  font-size:12.5px;
  line-height:1.6;
  color:#42636a;
}
@media(min-width:1051px){
  html body.page-v40-home .hero.hero-persona,
  html body.page-v40-supplements .detail-hero.hero-persona{
    min-height:720px!important;
    padding-top:clamp(112px,8.3vw,138px)!important;
    padding-bottom:clamp(102px,7vw,124px)!important;
  }
  html body.page-v40-home .hero .hero-persona-inner,
  html body.page-v40-supplements .hero-persona-inner{
    width:min(100% - 64px,1320px)!important;
  }
  html body.page-v40-home .hero .hero-persona-copy,
  html body.page-v40-supplements .hero-persona .hero-persona-copy{
    width:min(52%,620px)!important;
  }
  html body .hero-persona .hero-value-card{
    max-width:570px!important;
    box-shadow:0 14px 36px rgba(23,70,75,.055)!important;
  }
  html body.page-v40-home .membership-snapshot{
    margin-top:-42px!important;
  }
}
/* Tablet: image stays at the side, with a stronger veil behind the text. */
@media(min-width:721px) and (max-width:1050px){
  html body.page-v40-home .hero.hero-persona,
  html body.page-v40-supplements .detail-hero.hero-persona{
    padding-top:112px!important;
    padding-bottom:78px!important;
    min-height:0!important;
  }
  html body .hero-persona .hero-fullbleed-photo{width:67%;}
  html body.page-v40-home .hero.hero-persona::before,
  html body.page-v40-supplements .detail-hero.hero-persona::before{
    background:linear-gradient(90deg,#f4f9f8 0%,rgba(244,249,248,.995) 36%,rgba(244,249,248,.88) 55%,rgba(244,249,248,.42) 79%,rgba(244,249,248,.16) 100%)!important;
  }
  html body .hero-persona .hero-persona-copy{width:min(100%,690px)!important;}
}
@media(max-width:720px){
  html body.page-v40-home .hero.hero-persona,
  html body.page-v40-supplements .detail-hero.hero-persona{
    padding:108px 0 0!important;
    background:#f5faf9!important;
    min-height:0!important;
  }
  html body .hero-persona .container,
  html body.page-v40-home .hero .hero-persona-inner,
  html body.page-v40-supplements .hero .hero-persona-inner{
    width:calc(100% - 40px)!important;
    max-width:560px!important;
    margin-inline:auto!important;
  }
  html body.page-v40-home .hero.hero-persona::before,
  html body.page-v40-supplements .detail-hero.hero-persona::before{
    z-index:0;
    background:linear-gradient(180deg,#f5faf9 0%,rgba(245,250,249,.99) 60%,rgba(245,250,249,.84) 73%,rgba(245,250,249,0) 100%)!important;
  }
  html body .hero-persona .hero-fullbleed-photo{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    width:100vw!important;
    height:clamp(255px,75vw,390px)!important;
    margin:0 0 0 calc(50% - 50vw)!important;
    z-index:0!important;
    overflow:hidden!important;
    /* Gradient into the surrounding pale hero, no visible image edge. */
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 17%,#000 86%,transparent 100%);
    mask-image:linear-gradient(to bottom,transparent 0%,#000 17%,#000 86%,transparent 100%);
  }
  html body .hero-persona .hero-fullbleed-photo img{
    width:100%!important;
    height:100%!important;
    object-position:59% 46%!important;
  }
  /* Reorder the existing photo visually after the text without scripting. */
  html body .hero-persona{display:flex!important;flex-direction:column!important;}
  html body .hero-persona .hero-persona-inner{order:1!important;}
  html body .hero-persona .hero-fullbleed-photo{order:2!important;margin-top:19px!important;}
  html body .hero-persona .hero-persona-copy{max-width:none!important;width:100%!important;}
  html body .hero-persona .hero-persona-copy h1,
  html body.novodailies-only .detail-hero.hero-persona .detail-copy h1{
    font-size:clamp(32px,9.6vw,43px)!important;
    line-height:1.05!important;
    letter-spacing:-.03em!important;
  }
  html body .hero-persona .hero-persona-copy .hero-subline,
  html body.novodailies-only .detail-hero.hero-persona .detail-intro{
    margin:15px 0 0!important;
    font-size:14.4px!important;
    line-height:1.52!important;
    color:#47696f!important;
  }
  /* The price card now contains only price and service; no second competing photograph. */
  html body .hero-persona .hero-value-card{
    display:grid!important;
    grid-template-columns:minmax(90px,.41fr) minmax(0,.9fr)!important;
    grid-template-rows:1fr!important;
    grid-template-areas:'price content'!important;
    align-items:center!important;
    gap:14px!important;
    margin:20px 0 0!important;
    padding:16px 17px!important;
    min-height:116px!important;
    border-radius:18px!important;
    background:rgba(255,255,255,.94)!important;
    box-shadow:0 9px 26px rgba(21,68,74,.055)!important;
  }
  html body .hero-persona .hero-value-image{display:none!important;}
  html body .hero-persona .hero-value-price{
    grid-area:price!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:5px!important;
    padding:0!important;
    min-width:0!important;
  }
  html body .hero-persona .hero-value-price strong{
    font-size:clamp(33px,9vw,42px)!important;
    line-height:1!important;
    letter-spacing:-.055em!important;
    white-space:nowrap!important;
  }
  html body .hero-persona .hero-value-price span{font-size:12px!important;white-space:nowrap!important;}
  html body .hero-persona .hero-value-content{
    grid-area:content!important;
    padding:0 0 0 14px!important;
    border-left:1px solid rgba(178,136,87,.25)!important;
  }
  html body .hero-persona .hero-value-content strong{
    display:block;
    font-size:12.6px!important;
    line-height:1.33!important;
  }
  html body .hero-persona .hero-value-content span{
    font-size:11.4px!important;
    line-height:1.4!important;
    margin-top:5px!important;
  }
  html body .hero-persona .hero-service-points{
    margin:17px 0 0!important;
    display:grid!important;
    gap:9px!important;
  }
  html body .hero-persona .hero-service-points li{
    font-size:12.9px!important;
    line-height:1.44!important;
    align-items:start!important;
  }
  html body .hero-persona .hero-persona-actions,
  html body.novodailies-only .detail-hero.hero-persona .detail-hero-actions{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    margin:20px 0 0!important;
  }
  html body .hero-persona .hero-persona-actions .cta-v33--hero{
    width:100%!important;
    min-height:50px!important;
    padding:12px 18px!important;
    justify-content:center!important;
    font-size:13.3px!important;
  }
  html body .hero-persona .hero-proof-line{
    margin:15px 0 0!important;
    font-size:11.9px!important;
    line-height:1.55!important;
    max-width:100%!important;
    padding-left:12px!important;
  }
  html body.novodailies-only .detail-hero.hero-persona .breadcrumb{
    position:relative!important;
    z-index:2!important;
    margin:0 0 19px!important;
  }
  html body.page-v40-home .membership-snapshot{margin-top:0!important;}
}
@media(max-width:359px){
  html body .hero-persona .container{width:calc(100% - 32px)!important;}
  html body .hero-persona .hero-value-card{gap:8px!important;padding:13px!important;grid-template-columns:minmax(80px,.38fr) minmax(0,.9fr)!important;}
  html body .hero-persona .hero-value-price strong{font-size:33px!important;}
  html body .hero-persona .hero-value-content{padding-left:9px!important;}
  html body .hero-persona .hero-value-content strong{font-size:12px!important;}
}
@media(prefers-reduced-motion:reduce){
  html body .hero-persona .hero-fullbleed-photo img{animation:none!important;transform:none!important;}
}