/* One source-based spatial composition, rather than a sequence of small windows. */
.world-stage{display:none}
body{overflow-x:clip}
.hero-camera{transform-style:preserve-3d}
.hero-plan-surface,.hero-photo-surface{display:none}
.hero{min-height:max(860px,100svh);padding-top:calc(var(--header-h) + 75px);background:#122a20}
.hero .hero-layout{display:block;position:relative;z-index:1}
.hero .hero-copy{width:44%;max-width:760px;z-index:4}
.hero .hero-copy::before{content:"";position:absolute;inset:-35px -70px -35px -60px;background:linear-gradient(90deg,#122a20 0 calc(100% - 70px),#122a2000 100%);z-index:-1;pointer-events:none}
.hero .hero-copy h1{font-size:clamp(72px,7.5vw,144px);line-height:.98;letter-spacing:-.055em}
.hero .hero-copy>p{font-size:18px;line-height:1.65;max-width:580px}
.hero .hero-product{position:absolute;left:49%;right:-22%;top:4%;height:100%;padding:0;perspective:1600px;z-index:2;pointer-events:none}
.hero .hero-product::before{inset:-9% -15% -4% 5%;border:1px solid #9eaa7336;transform:rotate(-14deg)}
.hero .hero-camera{width:100%;position:absolute;top:13%;transform:rotateX(42deg) rotateZ(-13deg);transform-origin:center}
.hero .hero-screen{aspect-ratio:1600/864;transform:none;border:0;border-radius:1px;box-shadow:0 70px 100px #0008,0 3px 0 #d0d8c3,0 7px 0 #879576}
.hero .hero-screen img{position:absolute;inset:0;opacity:1;height:100%;object-fit:contain}.hero[data-cinema=on] .hero-screen img{opacity:0}
.hero .hero-plan-surface{display:block;width:100%;height:100%}
.hero .hero-photo-surface{display:block;position:absolute;width:29%;height:auto;right:9%;top:59%;box-shadow:0 30px 55px #0006;border:5px solid #eef2df;transform:rotate(-5deg)}
.hero .hero-product figcaption{position:absolute;top:0;bottom:auto;left:12%;font-size:10px;color:#c5d4b0}
.hero .hero-foot{position:relative;z-index:5;margin-top:80px}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#122a20 0%,#122a20f5 24%,#122a20a0 43%,#122a2000 61%);z-index:0}
.hero .hero-grid{opacity:.14;background-size:65px 65px}
html[data-motion=source-world] .product-story{display:grid;grid-template-columns:minmax(0,1fr);background:#132a21;position:relative;isolation:isolate}
html[data-motion=source-world] .world-stage{display:block;position:sticky;top:var(--header-h);height:calc(100svh - var(--header-h));grid-area:1/1;align-self:start;overflow:hidden;perspective:1600px;background:radial-gradient(ellipse at 77% 47%,#516444 0%,#203c2c 44%,#10271d 80%);isolation:isolate}
.world-light{position:absolute;width:100%;height:100%;background-image:linear-gradient(#acc48c10 1px,transparent 1px),linear-gradient(90deg,#acc48c10 1px,transparent 1px);background-size:90px 90px;mask-image:linear-gradient(90deg,transparent,#000)}
.world-orbit{position:absolute;width:88vw;height:66vw;border:1px solid #a7bd7b29;left:29%;top:4%;transform:rotate(-17deg);border-radius:50%}
.world-paper{position:absolute;aspect-ratio:1600/864;background:#fff;transform-style:preserve-3d;transform-origin:center;box-shadow:0 65px 95px #0007,0 2px 0 #e3e7da,0 7px 0 #a5b299;z-index:1}
.world-paper canvas,.world-catalog canvas,.world-photo canvas,.world-folio canvas{display:block;width:100%;height:100%}
.world-catalog,.world-photo{position:absolute;opacity:0;background:#fff;box-shadow:0 35px 60px #0006;border:5px solid #e5edda;z-index:3;transform-style:preserve-3d}
.world-catalog{width:23vw;max-width:370px;right:4%;top:7%}
.world-photo{width:21vw;max-width:330px;right:7%;bottom:7%}
.world-folio{position:absolute;left:75%;top:51%;width:min(53vw,900px);aspect-ratio:1080/556;opacity:0;background:white;box-shadow:0 65px 110px #0007,0 4px 0 #c6d2b5;border:10px solid #f7f9f1;z-index:4}
.world-vignette{position:absolute;inset:0;z-index:5;pointer-events:none;background:linear-gradient(90deg,#132a21 0%,#132a21fa 23%,#132a21dd 32%,#132a2180 43%,#132a2100 59%)}
.world-track{position:absolute;right:18px;top:16%;height:68%;width:1px;background:#90a36b55;z-index:6}.world-track i{display:block;height:100%;background:#c5d99a;transform:scaleY(0);transform-origin:top}
html[data-motion=source-world] .story-chapters{grid-area:1/1;position:relative;z-index:2;min-width:0;pointer-events:none}
html[data-motion=source-world] .story-scene{position:relative;min-height:170svh;border:0;background:none}
html[data-motion=source-world] .scene-inner{position:sticky;top:var(--header-h);height:calc(100svh - var(--header-h));min-height:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:48px var(--gutter);gap:20px;background:none;color:#edf2e2}
html[data-motion=source-world] .scene-copy{width:35%;max-width:560px;pointer-events:auto}
html[data-motion=source-world] .scene-copy h2{font-size:clamp(40px,4.6vw,82px);line-height:1.03;letter-spacing:-.045em;margin-bottom:28px}
html[data-motion=source-world] .scene-copy p{font-size:18px;line-height:1.65;color:#e0ead6}
html[data-motion=source-world] .scene-copy .secondary{font-size:15px;color:#c0d0b3}
html[data-motion=source-world] .scene-copy .eyebrow{color:#c4d89d;letter-spacing:.16em}
html[data-motion=source-world] .source-visual{width:35%;max-width:560px;perspective:none}
html[data-motion=source-world] .source-visual .source-window{display:none}
html[data-motion=source-world] .source-visual figcaption{margin:0;font-size:10px;line-height:1.6;color:#b5c8a4}
html[data-motion=source-world] .scene-meter{background:#7d94604d;width:110px;margin-top:30px}
html[data-motion=source-world] .scene-meter i{background:#c5d99a}
html[data-motion=source-world] .scene-copy .text-link{color:#e2edcd;font-size:12px}
.demo{position:relative;z-index:3}.demo-player{position:relative}
.handoff{overflow:clip}.handoff-route figure{perspective:1600px;transform-style:preserve-3d}.handoff-route img{box-shadow:0 35px 55px #0c1b1c44;transform-origin:center}
.benefit{position:relative}.benefit::before{content:"";position:absolute;left:0;top:-1px;width:100%;height:1px;background:#788f51;transform:scaleX(var(--rule-reveal,0));transform-origin:left}
@media(min-width:1800px){html[data-motion=source-world] .scene-copy p{font-size:22px}html[data-motion=source-world] .scene-copy .secondary{font-size:18px}.hero .hero-copy>p{font-size:22px}}
@media(max-width:1100px) and (min-width:761px){.hero .hero-copy{width:51%}.hero .hero-copy h1{font-size:70px}.hero .hero-copy>p{font-size:17px}.hero .hero-product{left:46%;right:-22%;top:12%}html[data-motion=source-world] .scene-copy,html[data-motion=source-world] .source-visual{width:39%}html[data-motion=source-world] .scene-copy h2{font-size:43px}html[data-motion=source-world] .scene-copy p{font-size:16px}html[data-motion=source-world] .scene-copy .secondary{font-size:14px}.world-vignette{background:linear-gradient(90deg,#132a21 0%,#132a21f5 29%,#132a21c0 38%,#132a2100 65%)}.world-folio{left:76%;width:52vw}}
@media(max-width:760px){.hero{padding-top:calc(var(--header-h) + 44px);padding-bottom:30px;min-height:0}.hero .hero-copy{width:100%;max-width:580px}.hero .hero-copy h1{font-size:clamp(55px,13vw,88px);margin-bottom:24px}.hero .hero-copy>p{font-size:16px;line-height:1.6}.hero .hero-product{position:relative;left:auto;right:auto;top:auto;width:calc(100% + 14px);height:300px;margin-top:40px}.hero .hero-camera{top:10%;width:114%;left:0}.hero .hero-photo-surface{width:33%;right:0;top:61%;border-width:3px}.hero .hero-product figcaption{bottom:-4%;left:0;font-size:9px}.hero .hero-foot{margin-top:35px}.hero::after{display:none}html[data-motion=source-world] .story-scene{min-height:180svh}html[data-motion=source-world] .scene-inner{padding:32px var(--gutter);justify-content:flex-start;gap:14px}html[data-motion=source-world] .scene-copy,html[data-motion=source-world] .source-visual{width:100%;max-width:600px}html[data-motion=source-world] .scene-copy h2{font-size:36px;line-height:1.08;margin-bottom:19px;max-width:500px}html[data-motion=source-world] .scene-copy p{font-size:16px;line-height:1.55}html[data-motion=source-world] .scene-copy .secondary{font-size:14px;line-height:1.55}html[data-motion=source-world] .scene-copy p+p{margin-top:15px}html[data-motion=source-world] .scene-copy .eyebrow{font-size:10px;margin-bottom:16px}html[data-motion=source-world] .scene-meter{margin-top:19px;width:90px}html[data-motion=source-world] .source-visual figcaption{font-size:8px;max-width:300px}.world-vignette{background:linear-gradient(180deg,#132a21 0%,#132a21fa 28%,#132a21d9 42%,#132a2120 67%,#132a2100 85%)}.world-orbit{width:145vw;height:110vw;left:-20%;top:43%;transform:rotate(-15deg)}.world-catalog{width:36%;right:2%;top:47%;border-width:3px}.world-photo{width:36%;right:1%;bottom:4%;border-width:3px}.world-folio{width:92%;left:53%;top:77%;border-width:6px}.world-track{right:9px;top:7%;height:86%}}
@media(max-width:760px) and (max-height:750px){html[data-motion=source-world] .scene-inner{padding-top:24px;padding-bottom:24px;gap:12px}html[data-motion=source-world] .scene-copy h2{font-size:31px;margin-bottom:14px}html[data-motion=source-world] .scene-copy p{font-size:15px;line-height:1.5}html[data-motion=source-world] .scene-copy .secondary{font-size:13px}html[data-motion=source-world] .scene-copy .eyebrow{font-size:9px;margin-bottom:11px}html[data-motion=source-world] .scene-copy .text-link{font-size:11px;margin-top:12px}html[data-motion=source-world] .scene-meter{margin-top:16px}.world-vignette{background:linear-gradient(180deg,#132a21 0%,#132a21fa 31%,#132a21c9 48%,#132a2100 78%)}.world-folio{top:80%;width:91%}}
@media(max-width:360px){.hero .hero-copy h1{font-size:51px}.hero .hero-copy>p{font-size:15px}.hero .hero-product{height:250px}html[data-motion=source-world] .scene-copy h2{font-size:30px}}
@media(max-width:760px) and (max-height:600px){html[data-motion=source-world] .story-scene{min-height:200svh}html[data-motion=source-world] .scene-copy h2{font-size:27px}html[data-motion=source-world] .scene-copy p{font-size:14px}html[data-motion=source-world] .scene-copy .secondary{font-size:12px}.world-paper{opacity:.35!important}.world-catalog,.world-photo{display:none}}
@media(max-width:760px){.hero .hero-copy::before{display:none}.hero .hero-product figcaption{top:auto}}
