/* Page de lecture large : sommaire ouvert, idée de la partie, début vivant */
.vl-som,.vl-dr{display:none}
.vl-k{margin:0 0 10px;font:600 .75rem/1.3 var(--mono,monospace);letter-spacing:.12em;text-transform:uppercase;color:color-mix(in srgb,var(--fg) 74%,transparent)}
.vl-ret,.vl-tir,.vl-r{font:600 .875rem/1 var(--body,inherit);min-height:40px;padding:0 14px;border:1.5px solid var(--fg);border-radius:999px;background:transparent;color:var(--fg);cursor:pointer;transition:background .2s,color .2s,transform .2s}
.vl-ret:hover,.vl-tir:hover,.vl-r:hover:not(:disabled){background:var(--fg);color:var(--bg)}
.vl-r:disabled{opacity:.6;cursor:default}

@media(min-width:1240px){
  .ar-layout.vl{display:grid;grid-template-columns:minmax(210px,260px) minmax(0,1fr) minmax(250px,310px);gap:clamp(28px,3.4vw,60px);max-width:1520px;align-items:start;overflow:visible}
  .ar-layout.vl .rail{display:none}
  .ar-layout.vl .ar-body{max-width:780px;margin:0;justify-self:center;width:100%}
  .ar-layout.vl .vv-promo-w{display:none!important}
  .vl-som,.vl-dr{display:block}
  .vl-som{position:sticky;top:96px;max-height:calc(100vh - 112px);overflow:auto;padding-right:6px;scrollbar-width:thin}
  .vl-ol{list-style:none;margin:0;padding:0;display:grid;gap:2px}
  .vl-a{position:relative;display:grid;grid-template-columns:28px 1fr auto;gap:2px 8px;align-items:baseline;padding:9px 10px 11px 12px;border-radius:12px;color:color-mix(in srgb,var(--fg) 78%,transparent);text-decoration:none;font-size:.9375rem;line-height:1.3;overflow:hidden;transition:background .2s,color .2s}
  .vl-a b{font:600 .75rem var(--mono,monospace);letter-spacing:.06em;opacity:.8}
  .vl-a small{font:.75rem var(--mono,monospace);opacity:.7;white-space:nowrap}
  .vl-a .vl-f{position:absolute;left:0;bottom:0;height:3px;width:calc(var(--f,0) * 100%);background:#DF6D2E;border-radius:0 3px 3px 0;opacity:.75}
  .vl-a:hover{background:color-mix(in srgb,var(--fg) 7%,transparent);color:var(--fg)}
  .vl-a.lu b::after{content:" ✓";color:#2f8f5b}
  .vl-a.act{background:var(--fg);color:var(--bg)}
  .vl-a.act b,.vl-a.act small{opacity:1}
  .vl-a.act .vl-f{background:#ffb89c}
  .vl-a:focus-visible{outline:3px solid #1D68DC;outline-offset:2px}
  .vl-tot{display:flex;justify-content:space-between;gap:8px;margin:14px 4px 0;font:.8125rem var(--mono,monospace);color:color-mix(in srgb,var(--fg) 72%,transparent)}
  .vl-sp{margin-top:18px}
  .vl-sp .vv-promo{position:static;box-shadow:4px 4px 0 var(--fg);padding:14px 14px 12px}
  .vl-sp .vv-promo__p{display:none}

  .vl-dr{position:relative;align-self:stretch}
  .vl-in{position:sticky;top:96px;display:grid;gap:18px;max-height:calc(100vh - 112px);overflow:auto;scrollbar-width:thin;padding:2px 6px 8px 2px}
  .vl-idee{padding:20px 20px 18px;border:2px solid var(--fg);border-radius:20px;background:var(--card,#fff);box-shadow:5px 5px 0 var(--fg)}
  .vl-idee blockquote{margin:0 0 16px;font:italic 500 1.25rem/1.4 var(--serif,Georgia,serif);letter-spacing:-.01em;min-height:6.2em;text-wrap:pretty}
  .vl-idee blockquote.in{animation:vlq .45s cubic-bezier(.2,.8,.2,1)}
  @keyframes vlq{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  .vl-ia{display:flex;flex-wrap:wrap;gap:8px}
  .vl-in .vv-promo{position:static}

}

/* début de page */
.vl-hero{margin:22px 0 0}
.vl-row{display:flex;flex-wrap:wrap;gap:10px}
.vl-go,.vl-es{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 20px;border-radius:999px;font:700 1rem/1 var(--body,inherit);cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s,color .2s}
.vl-go{border:2px solid var(--fg);background:#DF6D2E;color:#fff;box-shadow:3px 3px 0 var(--fg)}
.vl-go small{font:.8125rem var(--mono,monospace);opacity:.92}
.vl-go:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--fg)}
.vl-go b{display:inline-block;animation:vlb 1.8s ease-in-out infinite}
@keyframes vlb{50%{transform:translateY(4px)}}
.vl-es{border:2px solid var(--fg);background:transparent;color:var(--fg)}
.vl-es:hover,.vl-es.on{background:var(--fg);color:var(--bg)}
.vl-ess{margin-top:14px;border:2px solid var(--fg);border-radius:20px;background:var(--card,#fff);box-shadow:5px 5px 0 var(--fg);max-height:min(56vh,460px);overflow:auto;animation:vlq .4s cubic-bezier(.2,.8,.2,1)}
.vl-ess[hidden]{display:none}
.vl-ess ol{list-style:none;margin:0;padding:6px 18px}
.vl-ess li{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:12px 0;border-top:1.5px solid color-mix(in srgb,var(--fg) 16%,transparent)}
.vl-ess li:first-child{border-top:0}
.vl-ess li a{grid-column:1 / -1;display:flex;gap:10px;align-items:baseline;color:var(--fg);font-weight:700;text-decoration:none}
.vl-ess li a b{font:600 .75rem var(--mono,monospace);color:#DF6D2E}
.vl-ess li a:hover span{text-decoration:underline}
.vl-ess li p{margin:0;font-size:1rem;line-height:1.5;color:color-mix(in srgb,var(--fg) 82%,transparent)}
.vl-ess li .vl-r{align-self:end;min-height:34px;font-size:.8125rem}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .vl-go{background:#DF6D2E}}

.vl-w{display:inline-block;opacity:0;transform:translateY(.45em);animation:vlw .65s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(var(--i,0) * 55ms)}
@keyframes vlw{to{opacity:1;transform:none}}
html.decor-fige .vl-w{animation:none;opacity:1;transform:none}

.vl-tilt{transform:perspective(900px) rotateX(var(--rx,0)) rotateY(var(--ry,0));transition:transform .25s ease-out;will-change:transform}
.vl-tilt .card-illu__obj{transform:translate(var(--gx,0),var(--gy,0));transition:transform .25s ease-out}

@media(prefers-reduced-motion:reduce){.vl-w{animation:none;opacity:1;transform:none}.vl-go b{animation:none}.vl-idee blockquote.in,.vl-ess{animation:none}.vl-tilt,.vl-tilt .card-illu__obj{transition:none;transform:none}}
@media print{.vl-som,.vl-dr,.vl-hero{display:none!important}}


/* sommaire réduit */
.vl-red{display:none}
@media(min-width:1240px){
  .vl-red{display:inline-flex;align-items:center;gap:8px;min-height:36px;margin:0 0 10px;padding:0 12px;border:1.5px solid var(--fg);border-radius:999px;background:transparent;color:var(--fg);font:600 .8125rem/1 var(--body,inherit);cursor:pointer;transition:background .2s,color .2s}
  .vl-red:hover{background:var(--fg);color:var(--bg)}
  .ar-layout.vl{transition:grid-template-columns .3s ease}
  .ar-layout.vl.vl-min{grid-template-columns:64px minmax(0,1fr) minmax(250px,310px)}
  .vl-min .vl-som{overflow:visible}
  .vl-min .vl-som .vl-k,.vl-min .vl-tot,.vl-min .vl-sp,.vl-min .vl-a span,.vl-min .vl-a small,.vl-min .vl-red em{display:none}
  .vl-min .vl-red{padding:0;width:44px;justify-content:center}
  .vl-min .vl-a{grid-template-columns:1fr;justify-items:center;padding:10px 4px 12px;border-radius:12px}
}
@media(prefers-reduced-motion:reduce){.ar-layout.vl{transition:none}}

/* réduit : même largeur que l'entête de la page */
@media(min-width:1240px){
  .ar-layout.vl.vl-min{max-width:1360px}
}