/* Self-contained cinematic scene. Native dialog/header and commerce are untouched. */
.product-cinematic{position:relative;isolation:isolate;background:radial-gradient(ellipse at 72% 48%,#24354a 0%,#15253a 34%,#0c1828 75%);color:#f1eee6;scroll-margin-top:0;overflow:clip;font-family:var(--font-sans,Diatype,Arial,sans-serif)}
.product-cinematic .cinematic-layout{position:relative;height:clamp(690px,calc(100svh - 76px),1080px)}
.product-cinematic .cinematic-stage{position:absolute;inset:46px 0 96px;background:transparent}
.product-cinematic canvas{width:100%;height:100%;display:block;touch-action:pan-y}
.product-cinematic .cinematic-index{position:absolute;inset:0;pointer-events:none}
.product-cinematic .cinematic-title{position:absolute;left:6%;top:35px;font-size:13px;letter-spacing:.01em;color:#b7a58a}
.product-cinematic .cinematic-parts{position:absolute;right:6%;top:20px;display:flex;gap:28px;pointer-events:auto}
.product-cinematic button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;padding:0}
.product-cinematic .cinematic-part{font-size:13px;min-height:44px;color:#9eb0c5;border-bottom:1px solid transparent}
.product-cinematic .cinematic-part[aria-pressed=true]{color:#f1eee6;border-bottom-color:#b6a589}
.product-cinematic .cinematic-controls{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:26px;pointer-events:auto}
.product-cinematic .cinematic-views{display:flex;gap:3px;border:1px solid #3d5b8860;border-radius:40px;padding:3px}
.product-cinematic .cinematic-views button{padding:12px 24px;min-height:44px;border-radius:30px;font-size:12px;color:#aabbd0}
.product-cinematic .cinematic-views button[aria-pressed=true]{background:#274665;color:#f2eee7}
.product-cinematic .cinematic-reset{font-size:12px;min-height:44px;border-bottom:1px solid #3d5b8870;color:#b7c5d6}
.product-cinematic .cinematic-hotspots{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .5s}
.product-cinematic[data-motion=open] .cinematic-hotspots{opacity:1}
.product-cinematic .cinematic-hotspot{position:absolute;width:44px;height:44px;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;display:grid;place-items:center}
.product-cinematic[data-motion=open] .cinematic-hotspot{pointer-events:auto}
.product-cinematic .cinematic-hotspot[hidden]{display:none}
.product-cinematic .cinematic-hotspot span{width:9px;height:9px;border-radius:50%;background:#52667b;box-shadow:0 0 0 5px #d4dce480;border:1px solid #ffffffaa}
.product-cinematic .cinematic-hotspot[aria-pressed=true] span{background:#bfa67a;box-shadow:0 0 0 5px #e7d8bb66}
.product-cinematic button:focus-visible,.product-cinematic canvas:focus-visible{outline:2px solid #bda782;outline-offset:5px}
@media(min-width:700px) and (max-width:1100px){.product-cinematic .cinematic-layout{height:900px}}
@media(max-width:699px){.product-cinematic{scroll-margin-top:0}.product-cinematic .cinematic-layout{height:calc(100svh - 64px);min-height:650px;max-height:900px}.product-cinematic .cinematic-stage{inset:88px 0 100px}.product-cinematic .cinematic-title{top:24px;left:26px;font-size:12px}.product-cinematic .cinematic-parts{top:48px;left:26px;right:auto;gap:28px}.product-cinematic .cinematic-part{font-size:12px;min-height:40px}.product-cinematic .cinematic-controls{bottom:26px;gap:23px}.product-cinematic .cinematic-views button{padding-inline:20px;font-size:11px}.product-cinematic .cinematic-reset{font-size:11px}}
@media(max-width:350px){.product-cinematic .cinematic-layout{min-height:620px}.product-cinematic .cinematic-controls{gap:18px}.product-cinematic .cinematic-views button{padding-inline:17px}}
@media(prefers-reduced-motion:reduce){.product-cinematic .cinematic-hotspots{transition:none}}

.product-cinematic [data-cinematic-auto]{min-height:44px;min-width:76px;font-size:14px;border-bottom:1px solid #62758a}
.product-cinematic [data-cinematic-auto][hidden]{display:none}
@media(max-width:699px){.product-inspector .product-cinematic .cinematic-controls{gap:12px}.product-cinematic [data-cinematic-auto]{min-width:64px;font-size:13px}}
.product-inspector .product-cinematic .cinematic-views button,.product-inspector .product-cinematic .cinematic-reset,.product-inspector .product-cinematic [data-cinematic-auto]{font-size:14px;min-height:44px}
@media(max-width:699px){.product-inspector .product-cinematic .cinematic-views button{padding:10px 12px}.product-inspector .product-cinematic .cinematic-controls{gap:12px}}
