/* Once-only entrances for ordinary Home content. Choreographed scenes keep their timelines. */
#home .home-enter{opacity:0;translate:0 14px;transition:opacity .65s ease var(--entry-delay,0ms),translate .75s cubic-bezier(.2,.7,.2,1) var(--entry-delay,0ms)}
#home .home-enter.is-entered{opacity:1;translate:0 0}
#home #experience>.cards{opacity:1;transform:none}
#home #experience>.cards>#kit{opacity:var(--kit-entry,0);translate:0 calc((1 - var(--kit-entry,0))*32px)}
#home #experience>.cards>.twin-card{opacity:var(--twin-entry,0);translate:0 calc((1 - var(--twin-entry,0))*32px)}
#health-stories .hs-node[data-demo]:not(:disabled) .hs-portrait::before{content:"";visibility:visible;position:absolute;inset:-10px;border-radius:50%;pointer-events:none;background:conic-gradient(#f16846,#fff5d1,#19cddb,#fff5d1,#f16846);mask:radial-gradient(closest-side,transparent 76%,#000 84%,transparent 100%);filter:blur(4px);animation:reel-heartbeat 2.8s ease-in-out infinite;animation-play-state:paused}
#health-stories[data-motion="running"] .hs-node[data-demo]:not(:disabled) .hs-portrait::before{animation-play-state:running}
#health-stories .hs-node[data-index="1"] .hs-portrait::before{animation-delay:-.35s}
#health-stories .hs-node[data-index="2"] .hs-portrait::before{animation-delay:-.7s}
#health-stories .hs-node[data-index="3"] .hs-portrait::before{animation-delay:-1.05s}
@keyframes reel-heartbeat{0%,45%,100%{opacity:.3;scale:1}15%{opacity:.7;scale:1.07}25%{opacity:.4;scale:1.025}34%{opacity:.58;scale:1.05}}
@media(prefers-reduced-motion:reduce){#home .home-enter{opacity:1;translate:none;transition:none}#health-stories .hs-node[data-demo]:not(:disabled) .hs-portrait::before{animation:none;opacity:.4}#home #experience>.cards>#kit,#home #experience>.cards>.twin-card{opacity:1;translate:none}}
#drop-transition:not(.has-motion) .hs-node[data-demo]:not(:disabled) .hs-portrait::before{animation:none;opacity:.4}

/* Product entrances follow the final film progress, without a delayed visibility gate. */
#home #product-shell #experience>.cards>.card{opacity:var(--kit-entry,0);translate:0 calc((1 - var(--kit-entry,0))*22px);visibility:hidden;transition:none}
#home #product-shell #experience>.cards>.twin-card{opacity:var(--twin-entry,0);translate:0 calc((1 - var(--twin-entry,0))*22px)}
#home #product-shell[data-cards-introduced=true] #experience>.cards>.card{visibility:visible}
.hero-awards{display:flex;align-items:center;gap:22px;margin-top:28px;width:max-content;max-width:100%;color:#97733c}
.hero-award{display:flex;align-items:center;justify-content:center;gap:4px;text-align:center;min-width:150px;filter:drop-shadow(0 1px 1px #fff8)}
.hero-award>svg{width:25px;height:64px;flex:none}.hero-award>svg:last-child{scale:-1 1}.hero-award>span{display:flex;flex-direction:column;gap:3px}.hero-award strong{font-size:12px;line-height:1.22;font-weight:600}.hero-award small{font-size:10px;letter-spacing:.06em;text-transform:uppercase}.hero-award b{font-size:12px;font-weight:500}
@media(min-width:981px){.hero-copy{transform:translateY(-44%)}}
@media(max-width:600px){.hero-awards{width:100%;gap:6px;margin-top:20px;justify-content:space-between}.hero-award{min-width:0;flex:1;gap:1px}.hero-award>svg{width:17px;height:53px}.hero-award strong{font-size:9px}.hero-award small{font-size:8px}.hero-award b{font-size:10px}.hero-copy{bottom:84px}}
@media(prefers-reduced-motion:reduce){#home #product-shell #experience>.cards>.card{opacity:1;translate:none;visibility:visible;transition:none}}

.award-event{font-size:9px;font-style:normal;font-weight:500;letter-spacing:.04em}@media(max-width:600px){.award-event{font-size:8px}}

/* Make the existing twin modal entry cards visibly interactive. */
#home #product-shell .twin-card :is(.benefit-summary,.entry-points) button[data-detail]{transition:background-color .22s ease,border-color .22s ease,box-shadow .22s ease;cursor:pointer}
@media(hover:hover) and (pointer:fine){#home #product-shell .twin-card :is(.benefit-summary,.entry-points) button[data-detail]:hover{background:#fff;border-color:#fff;box-shadow:0 4px 16px #24443d0a}}
#home #product-shell .twin-card :is(.benefit-summary,.entry-points) button[data-detail]:focus-visible{background:#fff;border-color:#fff;box-shadow:0 4px 16px #24443d0a;outline:2px solid #346a5f;outline-offset:3px}
#home #product-shell .twin-card :is(.benefit-summary,.entry-points) button[data-detail]:active{background:#fff;border-color:#fff}
@media(prefers-reduced-motion:reduce){#home #product-shell .twin-card :is(.benefit-summary,.entry-points) button[data-detail]{transition:none}}

/* Linked awards retain the compact gold laurel treatment. */
.hero-award{color:inherit;text-decoration:none;border-radius:12px;padding:5px 2px;transition:background .2s,transform .2s;cursor:pointer}.hero-award:hover{background:#fff9;transform:translateY(-2px)}.hero-award:focus-visible{outline:2px solid #97733c;outline-offset:4px}.hero-award strong{white-space:nowrap}
/* A diffuse double pulse makes the four interactive Health Reels recognisable. */
#health-stories .hs-node[data-demo]:not(:disabled) .hs-portrait::before{inset:-17px;filter:blur(6px);mask:radial-gradient(closest-side,transparent 65%,#000 80%,transparent 100%);animation-name:reel-diffusion;animation-duration:2.8s;opacity:.65}
#health-stories .hs-node[data-demo]:not(:disabled) .hs-portrait::after{content:"";position:absolute;pointer-events:none;inset:-8px;border-radius:50%;border:2px solid #e8b77388;box-shadow:0 0 12px #6fd5d666,0 0 20px #efa07866;animation:reel-ripple 2.8s ease-out infinite;animation-play-state:paused}
#health-stories[data-motion="running"] .hs-node[data-demo]:not(:disabled) .hs-portrait::after{animation-play-state:running}
@keyframes reel-diffusion{0%,100%{opacity:.42;scale:1}18%{opacity:.95;scale:1.12}34%{opacity:.52;scale:1.03}49%{opacity:.88;scale:1.15}80%{opacity:.38;scale:1.03}}
@keyframes reel-ripple{0%{opacity:0;scale:.98}15%{opacity:.75}62%,100%{opacity:0;scale:1.35}}
#health-stories .hs-node[data-index="1"] .hs-portrait::after{animation-delay:-.35s}#health-stories .hs-node[data-index="2"] .hs-portrait::after{animation-delay:-.7s}#health-stories .hs-node[data-index="3"] .hs-portrait::after{animation-delay:-1.05s}
@media(prefers-reduced-motion:reduce){#health-stories .hs-node[data-demo]:not(:disabled) .hs-portrait::before{animation:none;opacity:.55}#health-stories .hs-node[data-demo]:not(:disabled) .hs-portrait::after{animation:none;opacity:.35}.hero-award{transition:none}}
#drop-transition:not(.has-motion) .hs-node[data-demo]:not(:disabled) .hs-portrait::after{animation:none;opacity:.35}
