.frama-film{display:none;position:absolute;inset:0;pointer-events:none;z-index:3}.product-stage[data-active=frama] .frama-film{display:block}.frama-film-heading{position:absolute;left:22px;top:16px;right:20px}.frama-film-heading>span{display:block;font:10px monospace;letter-spacing:.16em;color:#bacaa9}.frama-film-heading strong{display:block;font:400 clamp(19px,2vw,30px)/1.2 Manrope,Arial,sans-serif;letter-spacing:-.04em;margin:8px 0}.frama-film-heading small{font:11px Arial,sans-serif;color:#96a394}.frama-film-footer{position:absolute;bottom:22px;left:22px;right:22px;display:flex;align-items:center;justify-content:space-between;gap:12px}.frama-chapters{display:flex;gap:19px;font:10px monospace;color:#738575}.frama-chapters span{transition:color .8s}.frama-chapters .active{color:#e2efcd}.frama-film-actions{display:flex;gap:8px;pointer-events:auto}.frama-film-actions button{background:#15211bbf;border:1px solid #b5d0ae25;border-radius:4px;padding:7px 10px;color:#bcccae;font:10px monospace}.frama-film-actions button:hover{background:#354530;color:white}.frama-film-progress{position:absolute;bottom:12px;height:1px;left:22px;right:22px;background:#91b39420}.frama-film-progress i{display:block!important;height:1px!important;border-radius:0!important;background:#cbe7ae!important;transition:width .1s linear}.product-stage[data-active=frama] .annotation,.product-stage[data-active=frama] .coordinate{display:none}#model-canvas{touch-action:none}.product-stage[data-active=frama] #model-canvas{cursor:grab}.product-stage[data-active=frama] #model-canvas:active{cursor:grabbing}@media(max-width:600px){.frama-film-heading{top:8px;left:10px}.frama-film-heading small{font-size:9px}.frama-film-heading>span{font-size:8px}.frama-film-heading strong{font-size:20px}.frama-film-footer{left:10px;right:10px;bottom:20px}.frama-chapters{font-size:8px;gap:10px}.frama-film-actions button{font-size:9px;padding:6px}.frama-film-progress{left:10px;right:10px}}
@media(max-width:800px){.product-stage[data-active=frama]{align-self:start}.product-stage[data-active=frama] .scene{height:clamp(330px,100vw,480px);min-height:330px;max-height:480px}}
@media(max-width:800px){html:not(.embed-mode) body.portfolio-home:has(.product-stage[data-active=frama]){min-height:1000px}body.portfolio-home .product-stage[data-active=frama]{bottom:auto;grid-template-rows:auto auto auto auto;height:auto}}