.hotspots{position:absolute;inset:0;pointer-events:none}.hotspot{position:absolute;left:0;top:0;display:flex;align-items:center;gap:10px;padding:0;margin:0;border:0;background:none;color:#fff;font:inherit;cursor:pointer;pointer-events:auto;opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s}.hotspot{translate:0 -50%}.hotspot.visible{opacity:1;visibility:visible}.hotspot-dot{width:14px;height:14px;margin-left:-7px;border-radius:50%;background:#ffb340;box-shadow:0 0 0 2px #fff;position:relative}.hotspot-dot:before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid #ffb340;opacity:0;animation:pulse 2s ease-out infinite}.hotspot-label{padding:6px 12px;border-radius:999px;background:#0b0b14bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.25);font-size:14px;white-space:nowrap;transition:background .2s}.hotspot:hover .hotspot-label,.hotspot:focus-visible .hotspot-label{background:#ffb340;color:#0b0b14;border-color:#ffb340}.hotspot:focus-visible{outline:none}@keyframes pulse{0%{transform:scale(.6);opacity:.9}to{transform:scale(1.8);opacity:0}}#modal{border:0;padding:0;background:none;color:#eee;max-width:min(560px,calc(100vw - 32px))}#modal::backdrop{background:#000000b3;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}#modal{--ease-out: cubic-bezier(.16, 1, .3, 1);transform-origin:50% 50%;transition:opacity .4s var(--ease-out),transform .7s var(--ease-out),filter .45s var(--ease-out),overlay .7s allow-discrete,display .7s allow-discrete}#modal:not([open]){opacity:0;transform:scale(1.35);filter:blur(12px);transition-duration:.3s,.35s,.3s,.35s,.35s}@starting-style{#modal[open]{opacity:0;transform:scale(1.6);filter:blur(16px)}}#modal::backdrop{transition:background-color .5s ease,backdrop-filter .5s ease,overlay .5s allow-discrete,display .5s allow-discrete}#modal:not([open])::backdrop{background:#0000;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);transition-duration:.3s}@starting-style{#modal[open]::backdrop{background:#0000;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}.modal-card>:not(.modal-close){animation:modal-item .7s var(--ease-out) both}.modal-card>:nth-child(3){animation-delay:.06s}.modal-card>:nth-child(4){animation-delay:.11s}.modal-card>:nth-child(5){animation-delay:.16s}.modal-card>:nth-child(6){animation-delay:.21s}.modal-card>:nth-child(7){animation-delay:.26s}.modal-card>:nth-child(8){animation-delay:.31s}@keyframes modal-item{0%{opacity:0;transform:translateY(14px)}}@media(prefers-reduced-motion:reduce){#modal,#modal::backdrop{transition-duration:.15s}#modal:not([open]),#modal[open]{transform:none;filter:none}.modal-card>*{animation:none}}.modal-card{position:relative;padding:28px 32px;border-radius:12px;background:#15151f;border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 60px #0009;overflow:hidden}.modal-close{position:absolute;top:10px;right:12px;width:36px;height:36px;border:0;border-radius:50%;background:#00000059;color:#ddd;font:24px/1 system-ui;cursor:pointer;z-index:1}.modal-close:hover{background:#ffffff26;color:#fff}.modal-tag{display:inline-block;margin-bottom:10px;padding:3px 10px;border-radius:999px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;background:#ffb34026;color:#ffb340}.modal-title{margin:0 32px 4px 0;font-size:22px}.modal-subtitle{margin:0 0 16px;color:#ffb340}.modal-body p{margin:0 0 12px;line-height:1.55;color:#ccc}.modal-facts{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:16px 0 0;padding-top:14px;border-top:1px solid rgba(255,255,255,.1)}.modal-facts dt{color:#888}.modal-facts dd{margin:0}.modal-product{padding-top:0}.modal-visual{height:180px;margin:0 -32px 20px}.modal-features{margin:0 0 4px;padding-left:18px;color:#ccc;line-height:1.6}.modal-cta{display:inline-block;margin-top:20px;padding:10px 20px;border-radius:999px;background:#ffb340;color:#0b0b14;font-weight:600;text-decoration:none}.modal-cta:hover{background:#ffc466}html.modal-open{overflow:hidden}:root{color-scheme:dark}body{margin:0;background:#0b0b14;color:#eee;font:14px/1.4 system-ui,sans-serif}#track{height:400vh}#stage{position:fixed;inset:0;background:#000;overflow:hidden}canvas,video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}[hidden]{display:none!important}#loader{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#0b0b148c;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .3s}#loader.visible{opacity:1}#loader .spinner{width:36px;height:36px;border-radius:50%;border:3px solid rgba(255,255,255,.2);border-top-color:#ffb340;animation:spin .8s linear infinite}#loader.error .spinner{animation:none;border-color:#e5484d}#loader .label{font-variant-numeric:tabular-nums;letter-spacing:.02em;text-shadow:0 1px 2px #000}#loader .pbar{width:180px;height:3px;background:#ffffff26;border-radius:2px;overflow:hidden}#loader .pbar i{display:block;height:100%;width:0;background:#ffb340;transition:width .15s}@keyframes spin{to{transform:rotate(360deg)}}#stage.pointage{cursor:crosshair}#stage.pointage .hotspots{display:none}#markers{position:absolute;inset:0;pointer-events:none}#markers svg{position:absolute;inset:0;width:100%;height:100%}#markers path{fill:none;stroke:#ffb340;stroke-width:1.5;stroke-dasharray:4 3;opacity:.8}#markers .marker{position:absolute;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%;background:red}#markers .marker.current{box-shadow:0 0 0 3px #fff6}#markers .marker.other,#markers path.other{opacity:.45}#markers .marker.other{background:#8ab4ff}#markers path.other{stroke:#8ab4ff}#markers[data-frame]:before{content:attr(data-frame);position:absolute;left:12px;top:56px;padding:4px 8px;background:#0009;border-radius:4px;font-size:12px;font-variant-numeric:tabular-nums}#stage:not(.pointage) #markers:before{display:none}.lil-gui .lil-controller.lil-disabled{opacity:1}.lil-gui .lil-controller.lil-disabled input{color:var(--text-color)}#menu{position:fixed;top:12px;left:12px;z-index:10;display:flex;gap:4px;padding:4px;border-radius:999px;background:#0b0b14a6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.12)}#menu a{padding:6px 14px;border-radius:999px;color:#ddd;text-decoration:none;font-size:13px;transition:background .15s,color .15s}#menu a:hover{background:#ffffff1a;color:#fff}#menu a.active{background:#ffb340;color:#0b0b14;font-weight:600}#bar{position:fixed;left:0;bottom:0;height:3px;width:0;background:#ffb340}
