html{scroll-padding-top:0}body{background:#fff}.reference-page{width:100%;overflow:hidden}.reference-panel{position:relative;width:100%;margin:0;padding:0;line-height:0}.reference-panel>img{display:block;width:100%;height:auto;max-width:none;object-fit:contain}.image-action{position:absolute;display:block;padding:0;border:0;background:transparent;cursor:pointer;border-radius:999px;line-height:1}.image-action:hover{background:#ffffff18;box-shadow:0 0 0 2px #00845b66}.image-action:focus-visible{outline:3px solid #003f30;outline-offset:4px;background:#ffffff33}.hero-quiz{left:14%;top:52%;width:15.8%;height:5.7%}.hero-more{left:30.4%;top:52%;width:11.2%;height:5.7%}.hero-consult{left:64.5%;top:3.5%;width:11.4%;height:4.5%}.hero-nav-about{left:35.7%;top:3.6%;width:4.1%;height:4%}.hero-nav-benefits{left:40.8%;top:3.6%;width:5.2%;height:4%}.hero-nav-stories{left:47.3%;top:3.6%;width:3.3%;height:4%}.hero-nav-ritual{left:51.7%;top:3.6%;width:6%;height:4%}.selection-hit{left:70%;top:60%;width:26.5%;height:11%}.product-hit{left:23.5%;top:64%;width:13%;height:29%}.partner-hit{left:44.3%;top:60.6%;width:19%;height:10%}.final-hit{left:36.5%;top:53%;width:29%;height:11%}

/* Section 2 has blank bands baked into its 2103 × 748 source.
   Display rows 80–658 without changing the original or scaling its contents. */
#situations{aspect-ratio:2103 / 578;overflow:hidden}
#situations>img{position:absolute;left:0;top:calc(-80 / 578 * 100%);width:100%;height:auto}

/* A separate header replaces the navigation baked into the hero artwork. */
.site-masthead{position:relative;z-index:10;background:#fafbf7;box-shadow:0 1px 0 #164e3510}
.masthead-inner{max-width:1440px;min-height:104px;padding:18px 40px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:28px}
.masthead-brand{display:flex;align-items:center;gap:18px;text-decoration:none;flex-shrink:0}
.brand-art{display:block;width:176px;height:48px;background:url('sections/section-1.webp') -286px -34px / 2129px 1064px no-repeat;mix-blend-mode:multiply}
.brand-caption{font-size:15px;font-weight:500;line-height:1.5;color:#345448}
.masthead-nav{display:flex;align-items:center;gap:28px}
.masthead-nav a{color:#19392e;text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap}
.masthead-nav a:hover{color:#008958}
.masthead-cta{border:0;border-radius:999px;padding:17px 24px;background:#00865a;color:white;font:600 13px Manrope,sans-serif;cursor:pointer;white-space:nowrap;display:flex;align-items:center;gap:22px}
.masthead-cta span{font-size:24px;line-height:1}
.masthead-cta:hover{background:#006d49}
.reference-hero{margin-top:-5.5vw;clip-path:inset(11% 0 0)}
/* Uneven paper edges stay in the artwork margins. Geometry scales with images,
   so it cannot drift over the embedded text on narrower screens. */
.reference-panel:not(:last-child){isolation:auto}
.reference-panel:not(:last-child)::after{content:"";position:absolute;z-index:2;left:-1%;width:102%;height:2.8vw;bottom:-1.1vw;pointer-events:none;background:linear-gradient(174deg,#f8faf6 12%,#edf2e9 68%,#d4dfd3);clip-path:polygon(0 12%,3% 22%,5% 15%,8% 29%,11% 19%,15% 30%,18% 23%,21% 35%,24% 20%,28% 29%,31% 17%,34% 25%,38% 13%,41% 22%,45% 16%,49% 28%,52% 20%,55% 33%,59% 21%,63% 32%,66% 18%,70% 26%,74% 15%,77% 25%,81% 14%,84% 28%,88% 17%,91% 28%,95% 16%,98% 24%,100% 15%,100% 69%,97% 79%,94% 70%,90% 85%,87% 76%,83% 88%,80% 73%,76% 86%,73% 77%,69% 91%,65% 81%,62% 94%,58% 80%,54% 91%,51% 76%,47% 88%,44% 79%,40% 90%,36% 74%,33% 86%,29% 77%,26% 89%,22% 74%,19% 85%,15% 71%,12% 83%,8% 69%,5% 80%,2% 68%,0 76%)}
#situations{overflow:visible}
#situations>img{clip-path:inset(10.695% 0 12.032%)}
#stories{z-index:3;margin-bottom:2.3vw}
#stories::before{content:"";position:absolute;left:0;right:0;bottom:-3.5vw;height:4vw;background:linear-gradient(#edf3ec,#f7f8ef);pointer-events:none}
#stories::after{height:4.5vw;bottom:-4.3vw;background:linear-gradient(175deg,#f4f7ef 20%,#e5eddf 72%,#bacdb9)}
#partner{z-index:1}
#partner::after{background:linear-gradient(170deg,#075140,#003e30 65%,#34745b)}
@media(max-width:1100px){.masthead-inner{padding:16px 24px;gap:16px}.brand-caption{display:none}.masthead-nav{gap:18px}.masthead-nav a{font-size:12px}.masthead-cta{padding:15px 18px}}
@media(max-width:760px){.masthead-inner{min-height:100px;flex-wrap:wrap;gap:12px;padding:12px 18px}.brand-art{width:132px;height:36px;background-size:1597px 798px;background-position:-215px -25px}.masthead-cta{font-size:10px;padding:12px 14px;gap:10px}.masthead-nav{order:3;width:100%;justify-content:space-between;gap:8px}.masthead-nav a{font-size:10px}.reference-hero{margin-top:-5.5vw}}



/* The video occupies only the photo area; the original text and actions stay visible. */
.hero-motion{position:absolute;right:0;top:11%;width:57%;height:71%;overflow:hidden;opacity:0;transition:opacity .35s ease;pointer-events:none}
.hero-motion.is-ready{opacity:1}
.hero-motion video{display:block;width:100%;height:100%;object-fit:cover;object-position:center;mask-image:linear-gradient(90deg,transparent,#000 12%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%)}
.hero-motion-toggle{position:absolute;right:4%;bottom:5%;border:1px solid #ffffff80;border-radius:999px;background:#fffffff0;color:#215e4d;font:500 12px Manrope,sans-serif;padding:10px 15px;cursor:pointer;pointer-events:auto;line-height:1.3}
.reference-hero>.image-action{z-index:1}
@media(prefers-reduced-motion:reduce){.hero-motion{transition:none}}
@media(max-width:600px){.hero-motion-toggle{font-size:9px;padding:6px 9px}}

.partner-motion{left:0;right:auto;top:0;width:44%;height:79.3%}
.partner-motion video{object-fit:cover;mask-image:linear-gradient(90deg,#000 89%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 89%,transparent)}
.partner-motion .hero-motion-toggle{right:12%;bottom:3%;font-size:10px;padding:7px 12px}

.partner-motion.is-photo{opacity:1}.partner-motion.is-photo video,.partner-motion.is-photo button{display:none}.partner-portrait{display:block;width:100%;height:100%;object-fit:cover;object-position:center;mask-image:linear-gradient(90deg,#000 89%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 89%,transparent)}
@media(max-width:760px){.partner-portrait{mask-image:none;-webkit-mask-image:none}}