/* A typographic, scroll-led opening for the long-term product story. */
body.work-body .work-page:has(.product-opening){padding-top:0!important}
body.work-body .product-opening{position:relative;height:285svh;width:100vw;margin-left:calc(50% - 50vw);color:#242923;background:#f7f7f4;isolation:isolate}
.product-opening .po-stage{position:sticky;top:var(--project-nav-height,76px);height:calc(100svh - var(--project-nav-height,76px));min-height:530px;overflow:hidden}
.product-opening .po-axis{position:absolute;left:50%;top:0;bottom:0;width:1px;background:#2429231c;pointer-events:none}
.product-opening .po-meta{position:absolute;top:24px;left:calc(50% + 18px);font-size:12px;line-height:1.45;color:#6c7564;z-index:4}
.product-opening .po-signature{position:absolute;top:24px;left:6%;font-size:12px;color:#6c7564}
.product-opening .po-scene{position:absolute;inset:0;pointer-events:none;will-change:transform,opacity}
.product-opening h1,.product-opening h2,.product-opening p{margin:0;font-weight:400;font-family:'Inter Tight',Arial,sans-serif}
.product-opening .po-display{font-size:clamp(60px,7.3vw,128px);line-height:.96;letter-spacing:-.065em}
.product-opening .po-display em{font-family:'Instrument Serif',Georgia,serif;font-weight:400;letter-spacing:-.05em}
.product-opening .po-title{position:absolute;left:calc(50% + 18px);top:23%;width:46%;font-size:clamp(64px,8vw,138px);line-height:.94;letter-spacing:-.065em;overflow:visible}
.product-opening .po-title span{display:block}
.product-opening .po-title em{font-family:'Instrument Serif',Georgia,serif;font-weight:400}
.product-opening .po-years{position:absolute;left:14%;top:53%;font-size:clamp(57px,7vw,112px);line-height:.94;letter-spacing:-.065em}
.product-opening .po-years span{display:block}
.product-opening .po-note{position:absolute;left:calc(50% + 18px);bottom:13%;max-width:29ch;font-size:clamp(16px,1.4vw,21px);line-height:1.4;color:#737c6a;letter-spacing:-.02em}
.product-opening .po-from{position:absolute;left:15%;top:18%;width:36%}
.product-opening .po-to{position:absolute;left:calc(50% + 18px);top:43%;width:43%}
.product-opening .po-from small{display:block;font-size:12px;color:#727c69;letter-spacing:0;margin-bottom:22px;line-height:1.4}
.product-opening .po-number{position:absolute;left:20%;top:47%;font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:clamp(160px,23vw,370px);line-height:.8;color:#dde1d6;z-index:-1}
.product-opening .po-final{position:absolute;left:17%;right:8%;top:24%;font-size:clamp(50px,6.5vw,110px);line-height:1.04;letter-spacing:-.06em}
.product-opening .po-final span{display:block}.product-opening .po-final span:nth-child(2){margin-left:18%}.product-opening .po-final span:nth-child(3){margin-left:36%}
.product-opening .po-links{position:absolute;left:calc(50% + 18px);bottom:17%;display:flex;flex-direction:column;gap:12px;pointer-events:auto}
.product-opening .po-links a{font-size:16px;color:#515e45;text-decoration:none;display:flex;justify-content:space-between;gap:65px;border-bottom:1px solid #bec6b5;padding:0 0 8px}
.product-opening .po-links a:hover{color:#000}
.product-opening .po-bottom{position:absolute;left:6%;right:6%;bottom:24px;display:flex;justify-content:space-between;color:#68745c;font-size:12px;z-index:5}
.product-opening .po-bottom button{font:inherit;color:inherit;background:transparent;border:0;padding:10px 0;cursor:pointer}
.product-opening .po-pagination{display:flex;gap:12px;align-items:center}
.product-opening .po-pagination i{width:24px;height:2px;background:#c5cbbf}.product-opening .po-pagination i.active{background:#333e2a}
.product-opening .po-orbit{position:absolute;left:calc(50% - 185px);top:8%;width:135px;height:135px;perspective:600px;pointer-events:auto;z-index:3}
.product-opening .po-orbit-inner{height:100%;position:relative;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,.6,.2,1)}
.product-opening .po-orbit svg{width:100%;height:100%;overflow:visible;animation:po-turn 26s linear infinite}
.product-opening .po-orbit circle{fill:none;stroke:#242923;stroke-width:9;mix-blend-mode:multiply}
.product-opening .po-orbit .po-core{fill:#242923;stroke:0}
.product-opening .po-orbit::after{content:'Brand · Product · People';position:absolute;bottom:-20px;left:-20px;right:-20px;text-align:center;font-size:10px;color:#75806b}
@keyframes po-turn{to{transform:rotate(360deg)}}
body.work-body:has(.product-opening) #inside{margin-top:0;padding-top:85px}
@media(max-width:800px){.product-opening .po-stage{min-height:510px}.product-opening .po-axis{left:42%}.product-opening .po-meta{left:calc(42% + 14px);font-size:10px;top:20px}.product-opening .po-signature{font-size:10px;left:6%;top:20px;max-width:28%}.product-opening .po-title{left:calc(42% + 14px);top:24%;font-size:clamp(42px,8.8vw,70px);width:56%}.product-opening .po-years{left:8%;top:52%;font-size:clamp(54px,11vw,85px)}.product-opening .po-note{left:calc(42% + 14px);font-size:14px;max-width:20ch;right:6%;bottom:12%}.product-opening .po-orbit{width:78px;height:78px;left:calc(42% - 100px);top:19%}.product-opening .po-orbit::after{font-size:8px}.product-opening .po-display{font-size:clamp(43px,9vw,72px)}.product-opening .po-from{left:7%;top:19%;width:46%}.product-opening .po-to{left:calc(42% + 14px);top:48%;width:54%}.product-opening .po-number{left:8%;top:52%;font-size:180px}.product-opening .po-final{left:7%;right:5%;top:26%;font-size:clamp(44px,9.3vw,72px)}.product-opening .po-final span:nth-child(2){margin-left:9%}.product-opening .po-final span:nth-child(3){margin-left:18%}.product-opening .po-links{left:calc(42% + 14px);right:6%;bottom:17%}.product-opening .po-links a{font-size:13px;gap:15px}.product-opening .po-bottom{font-size:10px;bottom:16px}}
@media(max-height:600px) and (min-width:801px){.product-opening .po-stage{min-height:0}.product-opening .po-title{font-size:75px;top:20%}.product-opening .po-years{font-size:65px}.product-opening .po-display{font-size:65px}.product-opening .po-orbit{width:80px;height:80px;left:calc(50% - 120px)}.product-opening .po-final{font-size:65px;top:17%}.product-opening .po-links{bottom:12%;flex-direction:row;left:20%;gap:30px}.product-opening .po-links a{font-size:12px;gap:20px}}
@media(prefers-reduced-motion:reduce){body.work-body .product-opening{height:auto}.product-opening .po-stage{position:relative;top:0;height:auto;min-height:0;overflow:visible;padding:125px 7% 75px}.product-opening .po-axis,.product-opening .po-orbit,.product-opening .po-bottom,.product-opening .po-number{display:none}.product-opening .po-scene{position:relative!important;inset:auto;opacity:1!important;transform:none!important;margin-bottom:65px}.product-opening .po-title,.product-opening .po-years,.product-opening .po-from,.product-opening .po-to,.product-opening .po-note,.product-opening .po-final,.product-opening .po-links{position:static;width:auto;max-width:none;margin:0 0 25px}.product-opening .po-title{font-size:clamp(60px,8vw,130px)}.product-opening .po-years{font-size:clamp(42px,5vw,70px)}.product-opening .po-title span{display:inline}.product-opening .po-title span+span:before{content:' '}.product-opening .po-to{margin-left:20%}.product-opening .po-final span{margin-left:0!important}.product-opening .po-links{max-width:380px;pointer-events:auto}}
/* Keep the site's global heading scale from overruling the two-column composition. */
body.work-body .product-opening .po-display{font-size:clamp(54px,6.2vw,100px)!important;line-height:.97!important;letter-spacing:-.065em!important}
body.work-body .product-opening .po-final{font-size:clamp(50px,6.5vw,110px)!important;line-height:1.04!important;letter-spacing:-.06em!important}
body.work-body #inside .work-case{scroll-margin-top:165px}
@media(max-width:800px){body.work-body .product-opening .po-display{font-size:clamp(34px,8.3vw,65px)!important}body.work-body .product-opening .po-final{font-size:clamp(36px,9.3vw,72px)!important}.product-opening .po-orbit::after{display:none}}
@media(max-height:600px) and (min-width:801px){body.work-body .product-opening .po-display,body.work-body .product-opening .po-final{font-size:65px!important}}