.vpub{--vpub-l:300px;width:min(var(--vpub-l), 100%, calc(72svh * 9 / 16))}.vpub__legende{font-size:var(--t-micro);letter-spacing:.16em;text-transform:uppercase;opacity:.7;align-items:flex-start;gap:.6em;margin-bottom:1.1rem;line-height:1.5;display:flex}.vpub__point{background:var(--accent);width:6px;height:6px;box-shadow:0 0 10px var(--accent);border-radius:50%;flex:none;margin-top:.55em}.vpub__cadre{position:relative}.vpub__cadre:before{content:"";pointer-events:none;opacity:.55;--c:color-mix(in oklab, var(--accent) 80%, transparent);background:linear-gradient(var(--c), var(--c)) top left / 14px 1px, linear-gradient(var(--c), var(--c)) top left / 1px 14px, linear-gradient(var(--c), var(--c)) top right / 14px 1px, linear-gradient(var(--c), var(--c)) top right / 1px 14px, linear-gradient(var(--c), var(--c)) bottom left / 14px 1px, linear-gradient(var(--c), var(--c)) bottom left / 1px 14px, linear-gradient(var(--c), var(--c)) bottom right / 14px 1px, linear-gradient(var(--c), var(--c)) bottom right / 1px 14px;background-repeat:no-repeat;transition:inset .5s cubic-bezier(.2,.8,.2,1),opacity .5s;position:absolute;inset:-10px}.vpub:hover .vpub__cadre:before,.vpub[data-etat=lecture] .vpub__cadre:before{opacity:.9;inset:-14px}.vpub__ecran{aspect-ratio:9/16;border:1px solid color-mix(in oklab, var(--ink) 14%, transparent);box-shadow:0 40px 90px -40px #000000d9, 0 0 0 5px color-mix(in oklab, var(--ink) 4%, transparent);isolation:isolate;background:#050506;border-radius:22px;position:relative;overflow:hidden}.vpub__ecran video{object-fit:cover;width:100%;height:100%;transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .5s;position:absolute;inset:0}.vpub[data-etat=repos] .vpub__ecran video{filter:saturate(.85)brightness(.78)}.vpub[data-etat=repos]:hover .vpub__ecran video{filter:saturate()brightness(.88);transform:scale(1.035)}.vpub[data-etat=lecture] .vpub__ecran video{cursor:pointer}.vpub__voile{pointer-events:none;background:linear-gradient(#0000 55%,#0009);transition:opacity .4s;position:absolute;inset:0}.vpub[data-etat=lecture] .vpub__voile{opacity:.35}.vpub__lire{color:var(--ink);cursor:pointer;background:radial-gradient(circle,#05050673,#0000 60%);border:0;flex-direction:column;justify-content:center;align-items:center;gap:1.1rem;display:flex;position:absolute;inset:0}.vpub__bouton{place-items:center;width:96px;height:96px;display:grid;position:relative}.vpub__anneau{width:100%;height:100%;transition:transform .5s cubic-bezier(.2,.8,.2,1);animation:22s linear infinite vpub-tour;position:absolute;inset:0;overflow:visible}.vpub__anneau circle{fill:none;stroke:var(--accent);stroke-width:1.2px;stroke-linecap:round;stroke-dasharray:.5 6.04;opacity:.85;vector-effect:non-scaling-stroke}@keyframes vpub-tour{to{rotate:360deg}}.vpub__disque{-webkit-backdrop-filter:blur(12px)saturate(1.5);width:72px;height:72px;color:var(--accent);background:#0c0d0f6b;border:1px solid #ffffff47;border-radius:50%;place-items:center;font-size:28px;transition:background .35s,color .35s,border-color .35s,transform .45s cubic-bezier(.2,.8,.2,1);display:grid;box-shadow:inset 0 1px #ffffff2e,0 16px 40px -12px #000000b3}.vpub__disque svg{margin-left:.09em}.vpub[data-etat=fin] .vpub__disque svg{margin-left:0}.vpub__lire:hover .vpub__disque,.vpub__lire:focus-visible .vpub__disque{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);transform:scale(1.06)}.vpub__lire:hover .vpub__anneau{transform:scale(.9)}.vpub__lire:active .vpub__disque{transform:scale(.97)}.vpub__duree{-webkit-backdrop-filter:blur(10px);font-size:var(--t-micro);letter-spacing:.16em;text-transform:uppercase;background:#0a0b0d8c;border:1px solid #ffffff1f;border-radius:999px;align-items:baseline;gap:.7em;padding:.5em .95em;display:inline-flex}.vpub__temps{color:var(--accent);letter-spacing:.08em}.vpub[data-etat=fin] .vpub__lire{border:1px solid color-mix(in oklab, var(--accent) 45%, transparent);-webkit-backdrop-filter:blur(8px);background:#0a0b0db8;border-radius:999px;flex-direction:row;gap:.2em;padding:.3em;inset:auto 12px 14px auto}.vpub[data-etat=fin] .vpub__bouton{width:auto;height:auto}.vpub[data-etat=fin] .vpub__anneau{display:none}.vpub[data-etat=fin] .vpub__disque{background:var(--accent);width:32px;height:32px;color:var(--accent-ink);box-shadow:none;border-color:#0000;font-size:17px}.vpub[data-etat=fin] .vpub__duree{-webkit-backdrop-filter:none;background:0 0;border:0;padding:0 .7em 0 .4em}.vpub__son{border:1px solid color-mix(in oklab, var(--ink) 20%, transparent);-webkit-backdrop-filter:blur(8px);width:40px;height:40px;color:var(--ink);cursor:pointer;background:#0a0b0d99;border-radius:50%;place-items:center;transition:background .25s,color .25s,border-color .25s;display:grid;position:absolute;bottom:16px;left:12px}.vpub[data-muet=true] .vpub__son{color:var(--accent);border-color:color-mix(in oklab, var(--accent) 45%, transparent)}.vpub__son:hover{background:#0a0b0de6}.vpub__piste{opacity:0;background:#ffffff1a;height:3px;transition:opacity .3s;position:absolute;bottom:0;left:0;right:0}.vpub[data-etat=lecture] .vpub__piste,.vpub[data-etat=pause] .vpub__piste{opacity:1}.vpub__barre{background:var(--accent);transform-origin:0;height:100%;display:block;transform:scaleX(0)}.vpub button:focus-visible{outline:2px solid var(--accent);outline-offset:-4px}.vpub__lire:focus-visible{outline:none}.vpub--duo{--vpub-l:280px;margin-inline:auto}@media (min-width:1024px){.lp-duo.lp-duo--pub{--pub-l:min(clamp(300px, 24vw, 440px), calc((100svh - 220px) * 9 / 16));--scene-l:clamp(40rem, 50vw, 56rem);grid-template-columns:var(--pub-l) minmax(0, 1fr);grid-template-areas:"pub texte""pub scene";row-gap:clamp(1.5rem,3vh,2.5rem)}.lp-duo.lp-duo--pub>.vpub{grid-area:pub;align-self:center;width:100%;margin-inline:0}.lp-duo.lp-duo--pub>.lp-duo__texte{width:min(100%, var(--scene-l));grid-area:texte;place-self:end}.lp-duo.lp-duo--pub>.fen-station{--fen-largeur:var(--scene-l);grid-area:scene;align-self:start}}@media (prefers-reduced-motion:reduce){.vpub__anneau{animation:none}.vpub__ecran video,.vpub__cadre:before,.vpub__anneau,.vpub__disque{transition:none}.vpub[data-etat=repos]:hover .vpub__ecran video{transform:none}}
