/* VideoVault: article module (loaded only when it renders; tokens and shared parts are in base.css). */
/* Card shell (Editorial). */
.vvault-front .vvault-module--editorial:is(.vvault-article),.vvault-front .vvault-module--clean:is(.vvault-article),.vvault-front .vvault-module--cinema:is(.vvault-article){padding:var(--vv-pad);border:1px solid var(--vv-card-line);border-radius:var(--vv-radius);background:var(--vv-paper)}
.vvault-front :is(.vvault-article)>.vvault-section__head{margin:0 0 .5rem;padding:0;border:0}
.vvault-front :is(.vvault-article)>.vvault-section__head h2{font-size:var(--vv-title);line-height:1.08;letter-spacing:-.012em;font-weight:var(--vv-title-weight);margin:0}
.vvault-front .vvault-module--compact>.vvault-section__head h2{font-size:1.5rem}
/* VV-005 Article: display heading, contents list, prose. */
.vvault-front .vvault-article .vvault-prose{max-width:var(--vv-measure,57ch)}
.vvault-front .vvault-article .vvault-prose h2{font-size:clamp(1.35rem,1.1rem + 1cqi,1.7rem);line-height:1.15;margin:1.5rem 0 .5rem;scroll-margin-top:1.5rem}
.vvault-front .vvault-article .vvault-prose a{color:var(--vv-strong);text-decoration-thickness:1px;text-underline-offset:.18em}
.vvault-front .vvault-toc{margin:0 0 1rem;font-family:var(--vv-font-ui)}
.vvault-front .vvault-toc__title{margin:0 0 .25rem;font-family:var(--vv-font-display);font-weight:600;font-size:1.05rem}
.vvault-front .vvault-toc ol{list-style:none;margin:0;padding:0}
.vvault-front .vvault-toc li{margin:0;border-top:1px solid var(--vv-card-line)}
.vvault-front .vvault-toc a{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:2.6rem;padding:.25rem 0;font-size:.9rem;color:var(--vv-strong);text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:1px}
.vvault-front .vvault-toc__arrow{margin:0;opacity:.8}
.vvault-front .vvault-article--toc{display:flex;flex-direction:column}
.vvault-front .vvault-article--toc>.vvault-section__head{order:-1}
/* R33: the root rule asks the space around the module, the inner rules ask the module itself (narrower by its padding), so the inner rules start 80px earlier: whatever the padding, the float is on whenever the root is a block. */
@container vv (min-width:600px){.vvault-front .vvault-article--toc{display:block}}
@container vv (min-width:520px){.vvault-front .vvault-article--toc>.vvault-toc{float:right;width:min(15rem,38%);margin:0 0 1rem 2rem;padding-left:1.5rem;border-left:1px solid var(--vv-card-line)}.vvault-front .vvault-article--toc .vvault-prose{max-width:var(--vv-measure,57ch)}.vvault-front .vvault-article--toc>.vvault-ai-label{clear:both}}
/* VV-005 article: the heading and an inline numbered "In this article" panel; with a lead image
   (Clean, Cinema, away from the video's own page) the picture sits beside them. Prose runs full width. */
.vvault-front .vvault-module--clean.vvault-article>.vvault-toc,.vvault-front .vvault-module--cinema.vvault-article>.vvault-toc{float:none;width:auto;margin:.25rem 0 1rem;padding:var(--vv-s4);border:0;border-radius:calc(var(--vv-radius) - 2px);background:var(--vv-panel)}
.vvault-front :is(.vvault-module--clean,.vvault-module--cinema) .vvault-toc__title{margin:0 0 .25rem;font-family:var(--vv-font-ui);font-size:.88rem;font-weight:600}
.vvault-front :is(.vvault-module--clean,.vvault-module--cinema) .vvault-toc ol{display:flex;flex-wrap:wrap;gap:0 1.5rem;counter-reset:vvtoc}
.vvault-front :is(.vvault-module--clean,.vvault-module--cinema) .vvault-toc li{border:0;counter-increment:vvtoc}
.vvault-front :is(.vvault-module--clean,.vvault-module--cinema) .vvault-toc a{display:inline-flex;min-height:2rem;gap:.25rem;font-size:.875rem}
.vvault-front :is(.vvault-module--clean,.vvault-module--cinema) .vvault-toc a::before{content:counter(vvtoc) ".";text-decoration:none;display:inline-block}
.vvault-front :is(.vvault-module--clean,.vvault-module--cinema) .vvault-toc__arrow{display:none}
.vvault-front .vvault-article--media{display:grid;grid-template-columns:minmax(0,min(40%,16rem)) minmax(0,1fr);column-gap:var(--vv-gap,1.25rem);align-items:start}
.vvault-front .vvault-article--media>*{grid-column:1/-1}
.vvault-front .vvault-article--media>.vvault-article__media{grid-column:1;grid-row:1/span 2;aspect-ratio:4/3;margin:0 0 1rem}
.vvault-front .vvault-article--media>.vvault-section__head{grid-column:2;grid-row:1}
.vvault-front .vvault-article--media>.vvault-toc{grid-column:2;grid-row:2}
.vvault-front .vvault-module--clean.vvault-article .vvault-prose{font-size:max(1.0625rem,1em);line-height:1.6}
.vvault-front .vvault-module--clean.vvault-article .vvault-prose h2{font-size:1.1rem;margin:1rem 0 .25rem}
.vvault-front :is(.vvault-module--clean,.vvault-module--cinema).vvault-article:not(.vvault-article--media){display:flex;flex-direction:column}
.vvault-front :is(.vvault-module--clean,.vvault-module--cinema).vvault-article>.vvault-section__head{order:-2}
.vvault-front :is(.vvault-module--clean,.vvault-module--cinema).vvault-article>.vvault-toc{order:-1}
@container vv (max-width:560px){.vvault-front .vvault-article--media{display:flex;flex-direction:column}.vvault-front .vvault-article--media>.vvault-article__media{order:-3;aspect-ratio:16/9;margin:0 0 1rem}.vvault-front .vvault-article--media>:is(*,.vvault-article__media,.vvault-section__head,.vvault-toc){grid-column:1/-1;grid-row:auto}}
.vvault-front .vvault-module.vvault-module--cinema{background:var(--vv-paper);padding:var(--vv-pad);border:0;border-radius:var(--vv-radius)}
.vvault-front .vvault-module--cinema a:not([class*="btn"]){color:inherit}
.vvault-front .vvault-variant--none.vvault-article--media{display:block}
.vvault-front .vvault-variant--top.vvault-article--media{display:flex;flex-direction:column}
.vvault-front .vvault-variant--top.vvault-article--media>.vvault-article__media{order:-5;aspect-ratio:21/9}
@container vv (min-width:561px){.vvault-front .vvault-variant--right.vvault-article--media>.vvault-article__media{grid-column:2}.vvault-front .vvault-variant--right.vvault-article--media{grid-template-columns:minmax(0,1fr) minmax(0,min(40%,16rem))}.vvault-front .vvault-variant--right.vvault-article--media>:is(.vvault-section__head,.vvault-toc){grid-column:1}}
.vvault-front .vvault-article--media>.vvault-article__media{align-self:center}
@container vv (max-width:560px){.vvault-front .vvault-article--media>.vvault-article__media{width:100%;align-self:stretch}}
.vvault-front .vvault-module.vvault-module--editorial:is(.vvault-varticle){margin:0;padding:0;border:0;border-radius:0;background:transparent}
.vvault-front .vvault-varticle>.vvault-section__head h2.vvault-page-h2{margin:0;font-family:var(--vv-font-display);font-size:1.625rem;line-height:1.15;letter-spacing:-.01em;font-weight:var(--vv-title-weight)}
.vvault-front .vvault-varticle>.vvault-section__head{margin:0 0 var(--vv-s4);padding:0;border:0}
.vvault-front .vvault-varticle .vvault-prose{max-width:var(--vv-measure,57ch)}
.vvault-front .vvault-module.vvault-varticle .vvault-prose h2{font-family:var(--vv-font-display);font-size:1.5rem;line-height:1.25;font-weight:var(--vv-title-weight);margin:var(--vv-s6) 0 var(--vv-s2)}
.vvault-front .vvault-module.vvault-varticle .vvault-prose>h2:first-child{margin-top:0}
.vvault-front .vvault-module.vvault-varticle .vvault-prose h3{font-size:1.125rem;margin:var(--vv-s5) 0 var(--vv-s2)}
/* The Contents strip: one bordered line of jump links under the heading. */
.vvault-front .vvault-acstrip{display:block;margin:0 0 var(--vv-s5);padding:var(--vv-s3);border:1px solid var(--vv-vp-line,var(--vv-card-line));border-radius:var(--vv-radius-sm);background:var(--vv-vp-card,var(--vv-paper));font-family:var(--vv-font-ui);font-size:.9375rem;line-height:1.7}
.vvault-front .vvault-acstrip__title{display:inline;margin:0 var(--vv-s2) 0 0;font-weight:600}
.vvault-front .vvault-acstrip__title::after{content:":"}
.vvault-front .vvault-acstrip ol{display:inline;margin:0;padding:0;list-style:none}
.vvault-front .vvault-acstrip li{display:inline;margin:0}
.vvault-front .vvault-acstrip li+li::before{content:"·";margin:0 var(--vv-s2);color:var(--vv-muted)}
.vvault-front .vvault-acstrip a{color:var(--vv-vp-accent,var(--vv-strong));text-decoration:underline;text-underline-offset:3px}
.vvault-front .vvault-module--clean.vvault-article>.vvault-toc,.vvault-front .vvault-module--cinema.vvault-article>.vvault-toc{float:none;width:auto;margin:.25rem 0 1rem;padding:var(--vv-s4);border:0;border-radius:calc(var(--vv-radius) - 2px);background:var(--vv-panel)}
