/* Shared composition limits also apply when browser zoom increases the CSS viewport. */
/* Canonical layout tokens are supplied by design-system.css. */
@media(prefers-reduced-motion:no-preference){#heroSticky{height:var(--a5-scene)!important}#heroRunway{height:calc(var(--a5-scene)*2.6)!important}}
#vidLayer.device-cinema{padding-inline:var(--a5-edge);align-content:center;grid-template-rows:auto minmax(0,1fr);padding-top:90px;gap:30px}
.device-cinema-heading{justify-content:flex-start;gap:clamp(40px,7vw,100px)}
.device-support{max-width:29ch;color:#ACAEAD;margin-top:26px}
.device-cinema-stage{max-height:526px}
.device-cinema-window{left:0;transform:translateY(-50%) scale(var(--device-scale,.9));transform-origin:left center}
.device-time>strong.brand-five{position:relative;display:block;width:.71em;height:1em;padding:0;font-size:clamp(120px,17vh,158px);line-height:1;flex:none;color:transparent;background:none!important;animation:none;overflow:visible}
.brand-five:after{content:'';position:absolute;inset:0;background:linear-gradient(168deg,#8FE0C6 0%,#5FC5A6 38%,#2F8E72 78%,#256B57 100%);background-size:320% 180%;mask:url('./brand-five.svg') center/contain no-repeat;-webkit-mask:url('./brand-five.svg') center/contain no-repeat;animation:brand-current 4.8s ease-in-out infinite alternate;animation-play-state:paused}
#vidLayer[data-flow-active="true"] .brand-five:after,.design-scene .brand-five:after{animation-play-state:running}
@keyframes brand-current{from{background-position:0% 15%}to{background-position:100% 85%}}
body #heroMore{background:#BFECD4!important;border:1px solid #CEF4DF!important;color:#102B1C!important;min-height:46px!important;padding:0 27px!important;font-size:12px!important;letter-spacing:.12em!important;box-shadow:0 5px 24px #0003}
body #heroMore:hover{background:#E0FAEB!important;box-shadow:0 8px 28px #70cfa22b}
body #heroCta .hero-benefit{display:grid;position:relative;isolation:isolate;overflow:hidden;place-items:center;width:min(94vw,680px);min-height:46px;gap:0;font-size:clamp(22px,2.4vw,34px)!important;line-height:1.2;padding:7px 0;perspective:700px}
.hero-benefit-time,.hero-benefit strong{grid-area:1/1!important;display:block;white-space:normal;text-align:center;font-size:inherit!important;transform-origin:50% 50%;will-change:transform,opacity,clip-path}
.hero-benefit-time{color:#C3CBC6;font-weight:450}.hero-benefit strong{color:#F4F6F4;font-weight:600}
.hero-benefit-sweep{position:absolute;width:3px;inset-block:0;left:calc(var(--benefit-p,0)*100%);opacity:var(--benefit-glow,0);background:#A7F8C7;box-shadow:0 0 15px 5px #62DFA985;transform:skewX(-14deg);pointer-events:none}
html:not([data-hero-design="B"]):not([data-hero-design="C"]) .hero-benefit-time{clip-path:inset(0 0 0 calc(var(--benefit-p,0)*100%))}
html:not([data-hero-design="B"]):not([data-hero-design="C"]) .hero-benefit strong{clip-path:inset(0 calc((1 - var(--benefit-p,0))*100%) 0 0)}
[data-hero-design="B"] .hero-benefit-time{opacity:var(--benefit-out,1);transform:translateY(calc(var(--benefit-p,0)*-110%)) rotateX(calc(var(--benefit-p,0)*60deg))}
[data-hero-design="B"] .hero-benefit strong{opacity:var(--benefit-in,0);transform:translateY(calc((1 - var(--benefit-p,0))*110%)) rotateX(calc((1 - var(--benefit-p,0))*-60deg))}
[data-hero-design="C"] .hero-benefit-time{opacity:var(--benefit-out,1);filter:blur(calc(var(--benefit-p,0)*9px));transform:scale(calc(1 + var(--benefit-p,0)*.08))}
[data-hero-design="C"] .hero-benefit strong{opacity:var(--benefit-in,0);filter:blur(calc((1 - var(--benefit-p,0))*9px));transform:scale(calc(.94 + var(--benefit-p,0)*.06))}
[data-hero-design="B"] .hero-benefit-sweep,[data-hero-design="C"] .hero-benefit-sweep{display:none}
/* Continuous text handoff; visibility changes only after the outgoing fade. */
.bone-story-copy{left:var(--a5-edge);width:min(650px,46%)}
.bone-story-copy p{color:#A5A5A5}.bone-story-copy p strong{color:#FAFAF8;font-weight:600}
.bone-story-copy>div,.bone-story[data-stage="healing"] .bone-story-healing{transition:opacity .6s ease,transform .8s cubic-bezier(.22,.7,.25,1),visibility 0s linear .8s;transition-delay:0s,0s,.8s}
.bone-story[data-stage="vibration"] .bone-story-vibration,.bone-story[data-stage="healing"] .bone-story-healing{transition-delay:.14s,.14s,0s;visibility:visible}
.bone-story-copy>div>h2,.bone-story-copy>div>p{transition-duration:.6s,.8s;transition-delay:0s}
.bone-story[data-stage="vibration"] .bone-story-vibration>p,.bone-story[data-stage="healing"] .bone-story-healing>p{transition-delay:.12s}
.bone-story-loop-bridge{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%;z-index:1;pointer-events:none;opacity:0;transition:opacity .95s ease}
.bone-story-loop-bridge[data-hold="true"]{opacity:1;transition:none}
.bone-story-note{left:var(--a5-edge)}
.doctor-section{padding-inline:var(--a5-edge)}
.doctor-player{--watch-height:56.25cqw;margin-left:0;margin-right:auto}
.doctor-library[data-playing="true"] .doctor-player{transform:none}
.doctor-quote{max-width:none;margin-inline:0}
.doctor-playlist{box-sizing:border-box}
@media(min-width:1051px){.doctor-playlist{height:var(--doctor-stage-height,400px)}.doctor-choices{height:100%;grid-template-rows:repeat(3,minmax(0,1fr));align-content:stretch}.doctor-choice{min-height:0;height:100%;box-sizing:border-box}}
@media(min-width:761px) and (max-width:1050px){.doctor-watch{grid-template-columns:1fr}.doctor-choices{grid-template-columns:repeat(3,minmax(0,1fr))}.doctor-choice{grid-template-columns:48px minmax(0,1fr);min-height:100px}.doctor-choice-thumbnail{width:48px}.doctor-choice-arrow{display:none}.doctor-choice strong{font-size:13px}.doctor-playlist{padding:10px}.doctor-choice{padding:10px;gap:10px}}
#ritual{padding-inline:var(--a5-edge)!important}#ritual>div{max-width:var(--a5-content)!important}
#cta footer>div{box-sizing:content-box;max-width:var(--a5-content)!important;padding-inline:var(--a5-gutter)!important}
/* B: a unified left type column and a large right film; benefits make its caption. */
[data-banner-design="B"] #vidLayer{grid-template-columns:minmax(270px,.8fr) minmax(0,1.55fr);grid-template-rows:1fr;gap:clamp(36px,5vw,74px);align-items:center}
[data-banner-design="B"] .device-cinema-heading{display:block}
[data-banner-design="B"] .device-support{margin-top:30px;font-size:21px;max-width:24ch}
[data-banner-design="B"] .device-cinema-content{display:flex;height:auto;flex-direction:column;gap:30px}
[data-banner-design="B"] .device-cinema-stage{height:auto;aspect-ratio:16/9;flex:none}
[data-banner-design="B"] .device-cinema-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
[data-banner-design="B"] .device-cinema-point{display:block;border-top:1px solid #58685c88;padding-top:14px}
[data-banner-design="B"] .device-cinema-number{display:block;padding:0;margin-bottom:10px}
[data-banner-design="B"] .device-cinema-point h3{font-size:clamp(17px,1.5vw,22px)}
/* C: an editorial masthead, full-width film, and a compact benefit rail. */
[data-banner-design="C"] #vidLayer{grid-template-rows:auto minmax(0,1fr);gap:24px}
[data-banner-design="C"] .device-cinema-heading{border-top:1px solid #60716777;padding-top:22px;justify-content:space-between}
[data-banner-design="C"] .device-title{display:flex;align-items:center;gap:30px}
[data-banner-design="C"] .device-prelude{width:90px;font-size:20px;line-height:1.3;margin:0}
[data-banner-design="C"] .device-time>strong{font-size:106px}
[data-banner-design="C"] .device-time>span{font-size:36px}
[data-banner-design="C"] .device-support{max-width:29ch;margin:0;font-size:20px}
[data-banner-design="C"] .device-cinema-content{grid-template-columns:minmax(0,1fr) 204px;gap:36px}
[data-banner-design="C"] .device-cinema-point{border-bottom:1px solid #60716766;padding-bottom:20px}
[data-banner-design="C"] .device-cinema-point h3{font-size:25px}
/* Availability alternatives retain the supplied copy and shared eyebrow. */
.availability-section{padding:80px var(--a5-edge);text-align:left}
.availability-section>div{max-width:var(--a5-content);border-top:1px solid #A6C5B14D;padding-top:32px;display:grid;grid-template-columns:.55fr 1fr;gap:40px;align-items:start}
.availability-section h2.site-eyebrow{margin:8px 0 0;text-indent:0}
.availability-section p .prescription-label{font-size:clamp(32px,3.8vw,54px);font-weight:550}
.availability-section p span{color:#B5B8B6;font-size:20px;margin-top:12px}
[data-rx-design="B"] .availability-section{background:#DEE9E1;color:#183528}
[data-rx-design="B"] .availability-section>div{border:0;padding:0;display:block;text-align:center}
[data-rx-design="B"] .availability-section h2.site-eyebrow{color:#53655A;margin:0 0 22px}
[data-rx-design="B"] .availability-section p .prescription-label{color:#183528;font-size:clamp(36px,4.4vw,64px)}
[data-rx-design="B"] .availability-section p span{color:#52665A}
[data-rx-design="C"] .availability-section{background:radial-gradient(ellipse at 50% 120%,#215B40,transparent 70%),#0B1710;text-align:center}
[data-rx-design="C"] .availability-section>div{display:block;max-width:800px;border:0;padding:0}
[data-rx-design="C"] .availability-section h2.site-eyebrow{margin:0 0 28px}
[data-rx-design="C"] .availability-section p .prescription-label{font-size:clamp(36px,4.5vw,60px)}
[data-rx-design="C"] .availability-section p:after{content:'';display:block;width:54px;height:2px;background:#80C29F;margin:32px auto 0}
@media(max-width:760px){
 @media(prefers-reduced-motion:no-preference){#heroRunway{height:calc(var(--a5-scene)*2.2)!important}}
 #vidLayer.device-cinema{padding:84px 24px 74px;gap:24px;grid-template-rows:auto auto}
 .device-time>strong.brand-five{font-size:clamp(100px,30vw,128px)}.device-time>span{font-size:clamp(29px,8.4vw,35px)}
 .device-support{font-size:18px;margin-top:18px}.device-cinema-content{gap:22px}
 body #heroCta .hero-benefit{font-size:clamp(20px,5.5vw,28px)!important;width:92vw;min-height:62px;padding:3px 12px;box-sizing:border-box}
 .bone-story-copy{width:calc(100% - 48px);left:24px}.bone-story-loop-bridge{object-position:66% 50%}
 .bone-story-copy>div,.bone-story[data-stage="healing"] .bone-story-healing{transition-duration:.4s,.5s,0s;transition-delay:0s,0s,.5s!important}
 .bone-story[data-stage="vibration"] .bone-story-vibration,.bone-story[data-stage="healing"] .bone-story-healing{transition-delay:.08s,.08s,0s!important}
 .bone-story-copy>div>h2,.bone-story-copy>div>p{transition-duration:.4s,.5s}
 [data-banner-design="B"] #vidLayer{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto;gap:26px}
 [data-banner-design="B"] .device-cinema-heading{display:grid;grid-template-columns:1fr;gap:0}
 [data-banner-design="B"] .device-support{max-width:30ch;margin-top:18px;font-size:18px}
 [data-banner-design="B"] .device-cinema-content{gap:22px}
 [data-banner-design="B"] .device-cinema-points{gap:12px}
 [data-banner-design="B"] .device-cinema-point h3{font-size:16px;line-height:1.2}
 [data-banner-design="B"] .device-cinema-point h3 br{display:none}
 [data-banner-design="C"] .device-cinema-heading{display:block;padding-top:16px}
 [data-banner-design="C"] .device-title{gap:18px}
 [data-banner-design="C"] .device-prelude{width:64px;font-size:16px}
 [data-banner-design="C"] .device-time{gap:12px}
 [data-banner-design="C"] .device-time>strong{font-size:90px}
 [data-banner-design="C"] .device-time>span{font-size:28px}
 [data-banner-design="C"] .device-support{margin-top:20px;font-size:17px;max-width:34ch}
 [data-banner-design="C"] .device-cinema-content{grid-template-columns:1fr;gap:20px}
 [data-banner-design="C"] .device-cinema-points{gap:12px}
 [data-banner-design="C"] .device-cinema-point{padding-bottom:10px}
 [data-banner-design="C"] .device-cinema-point h3{font-size:19px}
 .availability-section{padding:56px 24px}.availability-section>div{display:block;padding-top:24px}.availability-section h2.site-eyebrow{margin:0 0 22px}
 .availability-section p .prescription-label{font-size:34px}.availability-section p span{font-size:18px;line-height:1.4}
}
@media(max-height:720px) and (max-width:760px){#vidLayer.device-cinema{padding:64px 20px 32px;gap:18px}.device-time>strong.brand-five{font-size:78px}.device-time>span{font-size:29px}.device-support{font-size:16px;margin-top:12px}.device-cinema-content{gap:16px}.device-cinema-points{gap:10px}[data-banner-design="B"] .device-support{font-size:16px;margin-top:12px}[data-banner-design="C"] .device-time>strong{font-size:68px}[data-banner-design="C"] .device-time>span{font-size:24px}[data-banner-design="C"] .device-support{margin-top:12px;font-size:16px}[data-banner-design="C"] .device-prelude{width:58px;font-size:15px}[data-banner-design="C"] .device-cinema-point{padding-bottom:6px}}
@media(prefers-reduced-motion:reduce){
 #heroSticky{height:auto!important}.brand-five:after{animation:none;background-position:45% 50%}
 body #heroCta .hero-benefit{display:flex;flex-direction:column;gap:8px;overflow:visible}
 .hero-benefit-time,.hero-benefit strong{opacity:1!important;transform:none!important;clip-path:none!important;filter:none!important;will-change:auto}
 .hero-benefit-sweep{display:none}
 #vidLayer.device-cinema{min-height:0;grid-template-rows:auto auto;padding-block:50px}
 .device-cinema-window{transform:translateY(-50%)!important}
 .bone-story-copy{position:relative;left:auto;width:100%}.bone-story-copy>div{transition:none!important}
 .bone-story-loop-bridge{display:none}.bone-story-copy>*{opacity:1!important;visibility:visible!important}
}
/* Compact landscape keeps the scene readable instead of clipping a desktop grid. */
@media(min-width:761px) and (max-height:650px){
 #vidLayer.device-cinema{padding-block:58px 24px;gap:16px}
 .device-time>strong.brand-five{font-size:88px}.device-time>span{font-size:32px}
 .device-prelude{font-size:16px}.device-support{font-size:18px;margin-top:14px}
 .device-cinema-points{gap:20px}.device-cinema-point h3{font-size:24px}
 [data-banner-design="B"] .device-cinema-content{gap:18px}
 [data-banner-design="B"] .device-cinema-point{padding-top:8px}
 [data-banner-design="B"] .device-cinema-number{margin-bottom:6px}
 [data-banner-design="C"] .device-cinema-heading{padding-top:12px}
}
@media(max-width:760px) and (max-height:720px){
 [data-banner-design="B"] #vidLayer{padding:54px 20px 90px;gap:14px}
 [data-banner-design="B"] .device-time>strong.brand-five{font-size:64px}
 [data-banner-design="B"] .device-support{margin-top:10px;font-size:15px}
 [data-banner-design="B"] .device-cinema-content{gap:14px}
 [data-banner-design="B"] .device-cinema-point h3{font-size:15px}
}

/* Full-bleed scene backgrounds must not inherit the inner media's zoom. */
#vidLayer.device-cinema{transform:none!important;border-radius:0}
#vidLayer>.device-cinema-heading,#vidLayer>.device-cinema-content{opacity:var(--handoff-content-opacity,1)}
@media(prefers-reduced-motion:reduce){#vidLayer>.device-cinema-heading,#vidLayer>.device-cinema-content{opacity:1!important}}

/* Selected release: B2 only. Hero and availability keep their existing composition. */
html:not([data-hero-design="original"]) .hero-benefit-arrow{display:none}
[data-hero-design="original"] body #heroCta .hero-benefit{display:flex;gap:18px;align-items:center;justify-content:center;min-height:0;width:auto;max-width:none;overflow:visible;padding:0;perspective:none;font-size:clamp(17px,1.4vw,22px)!important}
[data-hero-design="original"] .hero-benefit-time,[data-hero-design="original"] .hero-benefit strong{clip-path:none!important;opacity:1!important;transform:none!important;filter:none!important;will-change:auto}
[data-hero-design="original"] .hero-benefit-time{color:#A6B6AC}
[data-hero-design="original"] .hero-benefit-sweep{display:none}
[data-hero-design="original"] .hero-benefit-arrow{display:block;color:#8BAA99;font-size:17px}
[data-rx-design="original"] .availability-section{background:#0C1510;padding:64px 24px;text-align:center}
[data-rx-design="original"] .availability-section>div{max-width:800px;display:block;margin:auto;border:0;padding:0}
[data-rx-design="original"] .availability-section h2.site-eyebrow{margin:0 0 22px;text-indent:.22em}
[data-rx-design="original"] .availability-section p .prescription-label{font-size:clamp(28px,2.7vw,38px);font-weight:600}
[data-rx-design="original"] .availability-section p span{font-size:18px;color:#A9BCAF;margin-top:13px}
@media(max-width:760px){
 [data-hero-design="original"] body #heroCta .hero-benefit{display:grid;grid-template-columns:auto auto;column-gap:10px;row-gap:5px;font-size:17px!important}
 [data-hero-design="original"] .hero-benefit-time{grid-area:1/1!important;font-size:16px!important}
 [data-hero-design="original"] .hero-benefit strong{grid-area:2/1/3/3!important;font-size:20px!important}
 [data-hero-design="original"] .hero-benefit-arrow{grid-area:1/2;font-size:15px}
 [data-rx-design="original"] .availability-section{padding:48px 24px}
 [data-rx-design="original"] .availability-section p .prescription-label{font-size:28px}
}