/* Original Blender renders, with the same bold Montserrat language as the story. */
.product-viewport{position:absolute;inset:0;z-index:1;visibility:hidden;pointer-events:none}
.product-viewport[data-visible="true"]{visibility:visible}
.product-viewport canvas{position:absolute;width:100%;height:100%;inset:0}
.product-poster{position:absolute;object-fit:contain;left:0;top:4%;width:61%;height:92%}
.product-viewport[data-product="core"] .product-poster{left:4%;width:58%}
.product-viewport canvas{opacity:0}
.product-viewport[data-ready="true"] canvas{opacity:1}
.product-viewport[data-ready="true"] .product-poster{opacity:0}
.product-ovl.ovl{left:auto;right:4%;width:35%;max-width:560px;top:50%;bottom:auto;transform:translateY(-50%);z-index:3;pointer-events:auto}
.product-copy{font-family:var(--font-display);color:var(--ink)}
.product-copy h2{font:700 clamp(36px,4.1vw,66px)/1.12 var(--font-display);letter-spacing:-.035em;margin:0 0 15px}
.product-rating{font:700 clamp(15px,1.4vw,20px)/1.5 var(--font-display);color:var(--mc-base);margin:0 0 30px}

.product-feature{border-bottom:1px solid var(--border-light)}
.product-feature button{width:100%;border:0;background:none;display:flex;align-items:center;text-align:left;justify-content:space-between;gap:16px;padding:19px 0;font:700 clamp(22px,2vw,29px)/1.4 var(--font-display);color:var(--ink);cursor:pointer}
.product-feature button:focus-visible,.product-reset:focus-visible{outline:2px solid var(--mc-base);outline-offset:4px}
.feature-sign{font-size:21px;font-weight:500;color:var(--mc-base)}
.product-feature button[aria-expanded="true"]{color:var(--mc-base)}
.product-feature p:empty{display:none}
.product-reset{border:0;background:transparent;padding:20px 0 0;color:var(--ink-dim);font:600 12px var(--font-display);cursor:pointer}
@media(min-width:861px) and (max-height:740px){.product-rating{margin-bottom:20px}.product-feature button{padding:13px 0}}
@media(max-width:860px){.product-poster,.product-viewport[data-product="core"] .product-poster{left:0;top:6%;width:100%;height:42%}.product-ovl.ovl{left:7%;right:7%;width:auto;max-width:none;top:48%;transform:translateY(var(--product-y,0px))!important}.product-copy h2{font-size:32px;margin-bottom:9px}.product-rating{font-size:13px;margin-bottom:15px}.product-feature button{font-size:18px;padding:10px 0;min-height:38px}.product-reset{font-size:11px;padding-top:12px}}
@media(max-width:860px) and (max-height:740px){.product-poster,.product-viewport[data-product="core"] .product-poster{height:34%}.product-ovl.ovl{top:40%}.product-copy{max-height:calc(60svh - 70px);overflow-y:auto;overscroll-behavior:contain;padding:3px}.product-copy h2{font-size:28px}.product-rating{margin-bottom:12px}}

@media(min-width:861px){.product-ovl.ovl[data-i="1"]{right:4%;width:36%;max-width:560px}}

@media(min-width:861px){
 .product-ovl.ovl,.product-ovl.ovl[data-i="1"]{right:calc(max(0px,(100% - 1680px)/2) + min(2.8vw,47.04px));width:min(33vw,517.44px);max-width:none}
 .product-poster{left:calc(max(0px,(100% - 1680px)/2) - min(1.5vw,25.2px));width:min(60vw,1008px)}
 .product-viewport[data-product="core"] .product-poster{left:calc(max(0px,(100% - 1680px)/2) - min(.5vw,8.4px));width:min(57vw,957.6px)}
}

.product-feature p:not(:empty){font:500 clamp(14px,1.1vw,17px)/1.65 var(--font-display);color:var(--ink-dim);margin:0 0 20px;max-width:34em}
@media(max-width:860px){.product-feature p:not(:empty){font-size:13px;line-height:1.55;margin-bottom:13px}}

.feature-description{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .32s cubic-bezier(.22,.61,.36,1),opacity .24s ease}
.feature-description[data-expanded="true"]{grid-template-rows:1fr;opacity:1}
.feature-description>div{min-height:0;overflow:hidden}
.feature-description p{transform:translateY(-6px);transition:transform .32s cubic-bezier(.22,.61,.36,1)}
.feature-description[data-expanded="true"] p{transform:translateY(0)}

.product-viewport[data-site-owned="true"],.product-ovl[data-site-owned="true"]{visibility:hidden!important;pointer-events:none}

/* Center the model and measured copy together on mobile Chrome. */
@media(max-width:860px){.product-ovl.ovl{top:var(--mobile-product-top,48%);max-height:none;overflow:visible;overscroll-behavior-y:auto}.product-ovl .product-feature button{min-height:44px}.product-poster,.product-viewport[data-product="core"] .product-poster{top:12%}}

/* Keep disclosure expansion below a stable model; short screens can read all copy. */
@media(max-width:860px){
 .product-ovl .product-copy{max-height:none;overflow:visible;padding:0}
 .product-ovl.ovl{max-height:calc(100svh - var(--mobile-product-top,48svh) - 28px - env(safe-area-inset-bottom,0px));overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;padding:3px}
}

/* A quick, shared spring for direct interactions. Scroll itself stays native. */
:root{--motion-spring:cubic-bezier(.2,1.45,.4,1);--motion-out:cubic-bezier(.16,1,.3,1)}
.product-feature button,.product-reset,.hero-order,.topnav a{
 transition:transform 280ms var(--motion-spring),color 160ms ease,background-color 160ms ease;
 transform-origin:center;
}
.product-feature button:active,.product-reset:active,.hero-order:active,.topnav a:active{transform:scale(.97)}
.feature-sign{transition:transform 320ms var(--motion-spring)}
.product-feature button[aria-expanded="true"] .feature-sign{transform:scale(1.18)}
.feature-description{transition:grid-template-rows 220ms var(--motion-out),opacity 140ms ease}
.feature-description p{transition:transform 280ms var(--motion-spring)}
@media(hover:hover) and (pointer:fine){
 .product-feature button:hover{transform:translateX(4px);color:var(--mc-base)}
 .hero-order:hover,.product-reset:hover{transform:translateY(-2px)}
 .product-feature button:active{transform:translateX(2px) scale(.97)}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .product-feature button,.product-reset,.hero-order,.topnav a,.feature-sign,.feature-description,.feature-description p{transition:none;transform:none!important}
}