


.vtitre{display:flex;align-items:center;justify-content:flex-start;gap:16px clamp(18px,2.4vw,32px)}
.vtitre>h1{min-width:0}
.vb{flex:none;display:flex;flex-direction:column;align-items:center;gap:7px;background:none;border:0;
  padding:0;cursor:pointer;color:inherit;font:inherit}
.vb-rond{position:relative;display:block;width:clamp(68px,6.4vw,92px);aspect-ratio:1;border-radius:50%;padding:3px;
  background:conic-gradient(from 210deg,var(--vb-a,var(--coral,#888)),var(--vb-b,var(--gold,#bbb)),var(--vb-a,var(--coral,#888)));
  transition:transform .25s}
.vb:hover .vb-rond,.vb:focus-visible .vb-rond{transform:translateY(-3px)}
.vb-in{position:relative;display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;box-sizing:border-box;
  border:3px solid var(--vb-fond,var(--fond,#fff));background:#ddd center/cover no-repeat}
.vb-in video,.vd-cadre video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s}
.vb-in video.on,.vd-cadre video.on{opacity:1}
.vb-lec{position:absolute;right:-2px;bottom:-2px;width:26px;height:26px;border-radius:50%;background:#fff;
  display:grid;place-items:center;box-shadow:0 1px 4px rgba(0,0,0,.2)}
.vb-lec svg,.vd-lec svg{width:10px;height:10px;margin-left:2px;fill:var(--ink,#111)}
.vb-t{font-size:12px;font-weight:700;line-height:1.1;text-align:center}
.vb-t small{display:block;font-weight:500;opacity:.75;margin-top:2px}


.vd .vd-tete{margin-bottom:18px}
.vd-row{display:flex;gap:clamp(10px,1.4vw,16px);overflow-x:auto;scroll-snap-type:x mandatory;
  padding:2px 2px 10px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.vd-tuile{flex:0 0 clamp(148px,19vw,212px);scroll-snap-align:start;cursor:pointer;
  background:none;border:0;padding:0;text-align:left;color:var(--ink,#111);font:inherit}
.vd-cadre{display:block;position:relative;aspect-ratio:9/16;border-radius:var(--arrondi,16px);overflow:hidden;
  background:#e9e3d6 center/cover no-repeat;transition:transform .25s}
.vd-tuile:hover .vd-cadre{transform:translateY(-3px)}
.vd-cadre:after{content:"";position:absolute;inset:auto 0 0 0;height:38%;
  background:linear-gradient(transparent,rgba(0,0,0,.45));pointer-events:none}
.vd-lec{position:absolute;left:10px;bottom:10px;z-index:1;width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.92);display:grid;place-items:center}
.vd-lec svg{width:13px;height:13px}
.vd-dur{position:absolute;right:10px;bottom:16px;z-index:1;color:#fff;font-size:12px;font-weight:600}
.vd-tuile b{display:block;margin-top:10px;font-size:var(--t-sm,14px);font-weight:600;line-height:1.3}
.vd-tuile small{display:block;margin-top:3px;color:var(--mute,#666);font-size:12px}


.vlb{position:fixed;inset:0;z-index:9990;background:rgba(12,12,16,.94)}
.vlb[hidden]{display:none}
html.vlb-on,html.vlb-on body{overflow:hidden}
.vlb-fil{height:100%;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;overscroll-behavior:contain}
.vlb-fil::-webkit-scrollbar{display:none}
.vlb-pan{height:100vh;height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;display:grid;place-items:center}

.vlb-scene{position:relative;height:min(100dvh,92vh,820px);aspect-ratio:9/16;max-width:100vw;
  border-radius:14px;overflow:hidden;background:#000}
@media (max-width:640px){.vlb-scene{height:100dvh;width:100vw;aspect-ratio:auto;border-radius:0}}
.vlb-scene video{width:100%;height:100%;object-fit:cover;display:block}
.vlb-prog{position:absolute;left:12px;right:12px;top:10px;height:3px;border-radius:2px;
  background:rgba(255,255,255,.3);z-index:2}
.vlb-prog i{display:block;height:100%;width:0;background:#fff;border-radius:2px}
.vlb-haut{position:absolute;left:14px;right:64px;top:22px;z-index:2;color:#fff;font-size:13px;font-weight:600;
  text-shadow:0 1px 3px rgba(0,0,0,.5)}
.vlb-bt{width:40px;height:40px;border-radius:50%;border:0;background:rgba(0,0,0,.4);color:#fff;
  display:grid;place-items:center;cursor:pointer;font-size:17px;line-height:1;padding:0}
.vlb-bt svg{width:18px;height:18px;fill:#fff}
.vlb-son{position:absolute;right:12px;top:62px;z-index:2}
.vlb-son .on{display:none}
.vlb.sonore .vlb-son .on{display:block}
.vlb.sonore .vlb-son .off{display:none}
.vlb-fermer{position:fixed;top:16px;right:16px;z-index:3}
.vlb-nav{position:fixed;right:24px;top:50%;transform:translateY(-50%);z-index:3;display:flex;
  flex-direction:column;gap:10px}
.vlb-nav[hidden]{display:none}
@media (max-width:640px){.vlb-nav{display:none}.vlb-fermer{top:20px;right:12px}}
.vlb-pause{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:1}
.vlb-pause span{width:72px;height:72px;border-radius:50%;background:rgba(0,0,0,.4);display:grid;
  place-items:center;opacity:0;transition:opacity .2s}
.vlb-pause svg{width:28px;fill:#fff;margin-left:4px}
.vlb-scene.pause .vlb-pause span{opacity:1}
.vlb-bas{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:60px 12px 14px;
  background:linear-gradient(transparent,rgba(0,0,0,.6))}
.vlb-bas .tt{color:#fff;font-size:15px;font-weight:600;margin:0 4px 10px}
.vlb-prods{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.vlb-prods::-webkit-scrollbar{display:none}
.vlb-prod{flex:0 0 auto;width:min(100%,300px);display:flex;align-items:center;gap:10px;margin:0;
  background:#fff;color:var(--ink,#111);border-radius:12px;padding:8px;box-sizing:border-box}
.vlb-prods .vlb-prod:only-child{width:100%}
.vlb-prod img{width:48px;height:48px;border-radius:8px;object-fit:cover;flex:none;background:#f1ece2;display:block}
.vlb-prod .nm{flex:1;min-width:0;font-size:13px;line-height:1.3}
.vlb-prod .nm a{color:inherit;text-decoration:none}
.vlb-prod .nm b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vlb-prod .nm span{color:var(--mute,#666);font-size:12px}
.vlb-prod .px{font-weight:700;font-size:13px;white-space:nowrap}
.vlb-prod button{flex:none;border:0;background:var(--ink,#111);color:#fff;font:inherit;font-size:13px;
  font-weight:600;padding:10px 12px;border-radius:var(--btn-r,0);cursor:pointer}
.vlb-prod button[disabled]{opacity:.45;cursor:default}

.vlb-voir{text-decoration:none}
.vlb-voir .go{flex:none;width:36px;height:36px;border-radius:50%;background:var(--ink,#111);color:#fff;
  display:grid;place-items:center;font-weight:700}


.vd-accueil .av-rail>*{flex:0 0 clamp(150px,18vw,232px)}
.vd-accueil .vd-sous{margin:8px 0 0;color:var(--mute,#666);font-size:var(--t-sm,14px)}
