/* VitaGen V40 – calm premium hero, seamless navigation, and controlled chapter motion.
   Content, pricing, forms, and other product areas remain unchanged. */
:root{--v40-hero-top:#f1f7f6;--v40-hero-bottom:#eaf3f1;--v40-ink:#163e48;--v40-gold:#a77e4e;--v40-border:rgba(147,116,77,.22)}

/* The header starts as part of the pale hero surface and changes only after scrolling. */
html body.page-v40-home .site-header:not(.scrolled),
html body.page-v40-supplements .site-header:not(.scrolled){
  background:var(--v40-hero-top)!important;
  border-bottom:1px solid transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html body.page-v40-home .site-header.scrolled,
html body.page-v40-supplements .site-header.scrolled{
  background:rgba(255,255,253,.96)!important;
  border-bottom:1px solid rgba(169,130,77,.22)!important;
  box-shadow:0 12px 32px rgba(21,65,69,.09)!important;
  backdrop-filter:blur(18px) saturate(135%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(135%)!important;
}
html body.page-v40-home .site-header,
html body.page-v40-supplements .site-header{
  transition:height .4s cubic-bezier(.2,.7,.2,1),background-color .38s,box-shadow .4s,border-color .4s!important;
}
html body.page-v40-home .site-nav,
html body.page-v40-supplements .site-nav{gap:clamp(16px,2vw,30px)}
html body.page-v40-home .site-header .site-nav > a:not(.nav-cta),
html body.page-v40-supplements .site-header .site-nav > a:not(.nav-cta){
  letter-spacing:.045em;
  font-size:12px;
  transition:color .24s ease;
}
html body.page-v40-home .site-header .site-nav > a.nav-cta,
html body.page-v40-supplements .site-header .site-nav > a.nav-cta{
  min-height:40px;
  border-radius:9px!important;
  padding:10px 16px!important;
  gap:14px;
  transition:background .28s,border-color .28s,transform .28s!important;
}
html body.page-v40-home .site-header .site-nav > a.nav-cta:hover,
html body.page-v40-supplements .site-header .site-nav > a.nav-cta:hover{transform:translateY(-1px)}

/* Same color family, no disconnected strip at the top of the hero. */
html body.page-v40-home .hero.hero-persona,
html body.page-v40-supplements .hero-persona--detail.detail-hero{
  background:linear-gradient(180deg,var(--v40-hero-top) 0%,#f2f8f7 45%,var(--v40-hero-bottom) 100%)!important;
}
html body .hero-persona::before{
  background:radial-gradient(ellipse 46% 60% at 70% 36%,rgba(205,226,223,.33),transparent 80%),
             radial-gradient(ellipse 42% 65% at 5% 79%,rgba(207,226,223,.25),transparent 86%)!important;
}
html body .hero-persona::after{opacity:.050!important;}

/* The hero ends with a defined, clean baseline. */
@media(min-width:1051px){
  html body.page-v40-home .hero.hero-persona,
  html body.page-v40-supplements .hero-persona--detail.detail-hero{
    padding-top:clamp(116px,9.4vw,138px)!important;
    padding-bottom:clamp(95px,7.4vw,125px)!important;
    min-height:0!important;
  }
  html body .hero-persona-inner,
  html body .hero-persona--detail .hero-persona-inner{
    grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr)!important;
    gap:clamp(48px,5.2vw,90px)!important;
    align-items:center!important;
  }
  html body .hero-persona .hero-persona-copy{max-width:100%;}
  html body .hero-persona .hero-persona-copy h1,
  html body.novodailies-only .detail-hero.hero-persona .detail-copy h1{
    font-size:clamp(54px,5vw,76px)!important;
    line-height:1.075!important;
    letter-spacing:-.039em!important;
    font-weight:300!important;
    max-width:690px!important;
    text-wrap:balance;
  }
  html body .hero-persona .hero-persona-copy .hero-subline,
  html body.novodailies-only .detail-hero.hero-persona .detail-intro{
    margin-top:22px!important;
    max-width:620px!important;
    color:#4c6970!important;
    font-size:clamp(16px,1.25vw,18px)!important;
    line-height:1.62!important;
    letter-spacing:0!important;
  }
  html body .hero-persona .hero-value-card{
    margin-top:24px!important;
    padding:20px 24px!important;
    border-radius:19px!important;
    box-shadow:0 16px 36px rgba(23,70,75,.055)!important;
    background:rgba(255,255,255,.83)!important;
    border-color:rgba(164,125,77,.23)!important;
  }
  html body .hero-persona .hero-value-price strong{font-size:44px!important;font-weight:300!important;}
  html body .hero-persona .hero-value-content strong{font-weight:600!important;font-size:15px!important;}
  html body .hero-persona .hero-value-content span{font-size:13px!important;line-height:1.55!important;}
  html body .hero-persona .hero-service-points{margin-top:18px!important;gap:10px!important;}
  html body .hero-persona .hero-service-points li{font-size:13.5px!important;}
  html body .hero-persona .hero-persona-visual{
    min-height:565px!important;
    margin-top:2px;
  }
  html body .hero-persona .hero-product-stage{
    width:min(100%,520px)!important;
    min-height:565px!important;
    margin:0 auto!important;
  }
  html body .hero-persona .hero-product-main-card{
    top:0!important;right:6%!important;
    width:84%!important;
    aspect-ratio:auto!important;
    height:465px!important;
    border-radius:28px!important;
    box-shadow:0 28px 56px rgba(22,69,73,.12)!important;
    border:1px solid rgba(255,255,255,.94)!important;
  }
  html body .hero-persona .hero-product-main-card img{object-position:center 46%;}
  html body .hero-persona .hero-product-floating{border-radius:18px!important;box-shadow:0 12px 30px rgba(22,69,73,.12)!important;}
  html body .hero-persona .hero-product-floating--one{
    bottom:104px!important;left:0!important;
    width:30%!important;aspect-ratio:1.1!important;
  }
  html body .hero-persona .hero-product-floating--two{
    bottom:90px!important;right:0!important;
    width:32%!important;aspect-ratio:1.08!important;
  }
  html body .hero-persona .hero-product-caption{display:none!important;}
  html body .hero-persona .hero-product-badge{
    position:absolute!important;
    inset:auto 3% 0 3%!important;
    max-width:none!important;width:auto!important;
    margin:0!important;padding:11px 6px 0!important;
    border-radius:0!important;
    border:0!important;
    border-top:1px solid rgba(164,125,77,.25)!important;
    box-shadow:none!important;
    background:transparent!important;
    color:#234e55!important;
    text-align:center!important;
  }
  html body .hero-persona .hero-product-badge strong{display:inline!important;font-size:13px!important;font-weight:600!important;margin:0 6px 0 0!important;color:#234e55!important;}
  html body .hero-persona .hero-product-badge span{display:inline!important;font-size:12.5px!important;color:#647d81!important;line-height:1.5!important;}
}

/* CTA refinements: small line arrows, one clear primary action. */
@media(min-width:721px){
  html body .hero-persona .hero-persona-actions,
  html body.novodailies-only .hero-persona .detail-hero-actions{
    display:flex!important;flex-direction:row!important;align-items:center!important;
    justify-content:flex-start!important;gap:18px!important;margin-top:26px!important;
  }
  html body .hero-persona .hero-persona-actions .cta-v33--hero{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    gap:19px!important;min-height:52px!important;
    padding:12px 15px 12px 23px!important;
    border-radius:999px!important;
    background:linear-gradient(115deg,#e5cba2,#cfa673)!important;
    color:#254750!important;
    border:1px solid rgba(174,129,75,.1)!important;
    box-shadow:0 10px 22px rgba(147,103,59,.11)!important;
    font-weight:600!important;font-size:13px!important;letter-spacing:.008em!important;
    white-space:nowrap;
    transition:transform .3s ease,box-shadow .3s ease,background .3s ease!important;
  }
  html body .hero-persona .hero-persona-actions .cta-v33--hero svg{
    width:27px!important;height:27px!important;padding:6px!important;
    border:1px solid rgba(37,71,80,.16);border-radius:50%;
    stroke:currentColor!important;color:#254750!important;
  }
  html body .hero-persona .hero-persona-actions .cta-v33--hero:hover{transform:translateY(-2px)!important;box-shadow:0 15px 27px rgba(147,103,59,.18)!important;}
  html body .hero-persona .hero-persona-actions .detail-hero-cta{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    gap:10px!important;min-height:48px!important;padding:7px 4px!important;
    border:0!important;border-radius:0!important;background:transparent!important;
    box-shadow:none!important;color:#27535d!important;
    font-size:13px!important;font-weight:600!important;
    white-space:nowrap;
  }
  html body .hero-persona .hero-persona-actions .detail-hero-cta svg{width:17px!important;height:17px!important;transition:transform .3s!important;}
  html body .hero-persona .hero-persona-actions .detail-hero-cta:hover svg{transform:translateX(4px)}
}
html body .hero-persona .hero-persona-phone,
html body .hero-persona .detail-hero-phone{
  margin-top:14px!important;
  font-size:12.5px!important;font-weight:400!important;letter-spacing:.018em!important;
  color:#52727a!important;
}
html body .hero-persona .hero-persona-phone a,
html body .hero-persona .detail-hero-phone a{font-weight:600!important;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(42,82,88,.23)!important;}

/* The next chapter belongs to the same hero experience, not a detached strip. */
html body.page-v40-home .hero.hero-persona{position:relative;}
html body.page-v40-home .membership-snapshot{
  position:relative;z-index:3;
  margin-top:-66px!important;
  padding:0 0 clamp(38px,4vw,55px)!important;
  background:linear-gradient(180deg,var(--v40-hero-bottom) 0%,#f5faf8 77%,#f8fbfa 100%)!important;
  border:0!important;
}
html body.page-v40-home .membership-snapshot-inner{
  display:grid;grid-template-columns:minmax(180px,.27fr) minmax(0,1fr);
  align-items:center!important;gap:clamp(22px,3vw,50px)!important;
  margin-inline:auto;
  padding:clamp(26px,2.8vw,36px)!important;
  border:1px solid rgba(165,134,90,.19);
  border-radius:24px;
  background:rgba(255,255,254,.93);
  box-shadow:0 25px 55px rgba(22,70,75,.08);
}
html body.page-v40-home .membership-snapshot h2{
  font-size:clamp(25px,2.35vw,32px)!important;
  font-weight:350!important;
  line-height:1.14!important;
  letter-spacing:-.028em!important;
}
html body.page-v40-home .membership-snapshot-grid{gap:clamp(15px,1.6vw,25px)!important;}
html body.page-v40-home .membership-snapshot-item{
  padding:0 0 0 17px!important;
  border-top:0!important;
  border-left:1px solid rgba(170,129,83,.34);
}
html body.page-v40-home .membership-snapshot-item .snapshot-number{
  margin-bottom:8px!important;
  font-size:11px!important;
  font-weight:600!important;
  color:#a47c4a!important;
}
html body.page-v40-home .membership-snapshot-item h3{
  margin-bottom:8px!important;
  font-size:clamp(17px,1.25vw,19px)!important;
  line-height:1.22!important;
  font-weight:500!important;
}
html body.page-v40-home .membership-snapshot-item p{
  line-height:1.58!important;
  font-size:12.5px!important;
}
html body.page-v40-home #personalisierung{padding-top:clamp(64px,5vw,86px)!important;}

/* Smooth visual continuity and responsive tablet behavior. */
@media(min-width:721px) and (max-width:1050px){
  html body.page-v40-home .hero.hero-persona,
  html body.page-v40-supplements .hero-persona--detail.detail-hero{padding-bottom:80px!important;}
  html body.page-v40-home .membership-snapshot{margin-top:-35px!important;}
  html body.page-v40-home .membership-snapshot-inner{grid-template-columns:1fr!important;gap:20px!important;}
  html body.page-v40-home .membership-snapshot-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  html body .hero-persona .hero-product-caption{display:none!important;}
}
@media(max-width:720px){
  html body.page-v40-home .membership-snapshot{
    margin-top:-4px!important;
    padding:0 0 35px!important;
    border:0!important;
    background:linear-gradient(180deg,#ebf4f2,#f9fbfa)!important;
  }
  html body.page-v40-home .membership-snapshot-inner{
    display:grid;grid-template-columns:1fr!important;
    padding:23px 21px!important;
    gap:17px!important;
    background:rgba(255,255,255,.9)!important;
    border:1px solid rgba(167,127,80,.18)!important;
    border-radius:20px!important;
    box-shadow:0 18px 36px rgba(20,67,73,.055)!important;
  }
  html body.page-v40-home .membership-snapshot h2{font-size:26px!important;letter-spacing:-.02em!important;}
  html body.page-v40-home .membership-snapshot-grid{grid-template-columns:1fr!important;gap:16px!important;}
  html body.page-v40-home .membership-snapshot-item{
    border-top:1px solid rgba(167,127,80,.22)!important;
    border-left:0!important;padding:14px 0 0!important;
  }
  html body.page-v40-home .membership-snapshot-item .snapshot-number{margin-bottom:5px!important;}
  html body.page-v40-home .membership-snapshot-item h3{font-size:18px!important;margin-bottom:5px!important;}
  html body.page-v40-home .membership-snapshot-item p{font-size:12.5px!important;}
  html body.page-v40-home .hero.hero-persona,
  html body.page-v40-supplements .detail-hero.hero-persona{background:linear-gradient(180deg,var(--v40-hero-top) 0%,#f3f8f7 65%,#ebf4f2 100%)!important;}
  html body.page-v40-home #personalisierung{padding-top:40px!important;}
  html body .hero-persona .hero-scroll{display:none!important;}
  html body.page-v40-home .site-header .site-nav,
  html body.page-v40-supplements .site-header .site-nav{background:#f8faf9!important;}
}

/* Scroll animation: added only after the JS has confirmed support. */
.v40-motion .v40-rise{
  opacity:0;
  transform:translate3d(0,24px,0);
  transition:opacity .8s cubic-bezier(.18,.7,.22,1),transform .9s cubic-bezier(.18,.7,.22,1);
  transition-delay:var(--v40-delay,0ms);
  will-change:opacity,transform;
}
.v40-motion .v40-rise.v40-visible{opacity:1;transform:translate3d(0,0,0);will-change:auto;}
.v40-motion .premium-reveal{
  transition:opacity .75s cubic-bezier(.18,.7,.22,1),transform .85s cubic-bezier(.18,.7,.22,1);
  transition-delay:calc(var(--reveal-order,0) * 80ms);
}
@media(min-width:1051px){
  html body .hero-persona .hero-product-stage{transform:translateY(var(--v40-hero-shift,0px));}
}
@media(prefers-reduced-motion:reduce){
  .v40-motion .v40-rise,.v40-motion .v40-rise.v40-visible{opacity:1!important;transform:none!important;transition:none!important;}
  .v40-motion .premium-reveal{transition:none!important;}
  html body .hero-persona .hero-product-stage{transform:none!important;}
  html body.page-v40-home .site-header,html body.page-v40-supplements .site-header{transition:none!important;}
}

/* Final controls and small editorial cleanup. */
@media(min-width:721px){
  html body .hero-persona .hero-persona-actions .cta-v33--hero svg{
    width:18px!important;height:18px!important;flex:0 0 18px!important;
    padding:0!important;border:0!important;border-radius:0!important;
    color:#214751!important;stroke:currentColor!important;
  }
  html body .hero-persona .hero-persona-actions .cta-v33--hero svg path{
    stroke-width:1.8!important;
  }
}
html body.page-v40-supplements .hero-persona-kicker{display:none!important;}
