/* demo chapter film (vchap-demo.js). Without JS or with reduced motion nothing here applies */
.vch-world{position:relative;margin-top:-100vh;z-index:5;pointer-events:none}
.vch-world>*{pointer-events:auto}
.vch-gap{height:100vh;pointer-events:none!important}
.vch-lead{height:150vh;pointer-events:none!important;position:relative}
.vch-stage{position:sticky;top:0;height:100vh;margin-bottom:-100vh;overflow:hidden;z-index:0;pointer-events:none!important;background:var(--bg);opacity:0;will-change:opacity,transform}
.vch-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.vch-stage:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(var(--veil),.35),rgba(var(--veil),0) 40%)}
.vch-world>section{position:relative;z-index:1;background:rgba(var(--veil),.84)!important;-webkit-backdrop-filter:blur(18px) saturate(1.1);backdrop-filter:blur(18px) saturate(1.1);border-radius:28px;box-shadow:0 30px 80px rgba(0,0,0,.18);width:min(1180px,calc(100% - 64px));margin:0 auto 14vh;padding:70px 0 80px;overflow:hidden}
.vch-world>section:last-child{margin-bottom:10vh}
.vch-world>.sweep{display:none}
.vch-world>section .wrap{padding:0 44px}
.vch-dots{position:fixed;right:22px;top:50%;transform:translateY(-50%);z-index:40;display:grid;gap:10px;opacity:0;transition:opacity .4s;pointer-events:none}
.vch-dots.on{opacity:1}.vch-dots i{width:6px;height:6px;border-radius:50%;background:rgba(127,127,127,.35);transition:background .3s,transform .3s}.vch-dots i.on{background:var(--acc);transform:scale(1.5)}
@media (max-width:819px){
  .vch-lead{height:130vh}
  .vch-world>section{width:calc(100% - 24px);border-radius:22px;padding:44px 0 50px;margin-bottom:10vh}
  .vch-world>section .wrap{padding:0 18px}
  .vch-dots{right:8px}
}

/* v2: no boxed panels on the film. Sections sit on a soft gradient band, text carries a shadow, headlines live on the film */
.vch .vch-world>section{background:linear-gradient(180deg,rgba(var(--veil),0) 0%,rgba(var(--veil),.72) 9%,rgba(var(--veil),.72) 91%,rgba(var(--veil),0) 100%)!important;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0;box-shadow:none;width:100%;padding:12vh 0;overflow:visible}
.vch .vch-world>section .wrap{max-width:1180px;margin:0 auto}
.vch .vch-world>section h2,.vch .vch-world>section h3,.vch .vch-world>section p,.vch .vch-world>section dd,.vch .vch-world>section li{text-shadow:0 1px 18px rgba(var(--veil),.9)}
.vch .vch-world .card{background:transparent!important;border:0;border-top:1px solid color-mix(in srgb,var(--ink) 22%,transparent);border-radius:0;padding:22px 4px 8px;box-shadow:none}
.vch .vch-world .card:hover{transform:none;border-top-color:var(--acc)}
.vch .vch-world .card .pr{font-size:1.5em}
.vch .vch-world .form{background:transparent;border:0;border-radius:0;padding:8px 0}
.vch .vch-world .form input,.vch .vch-world .form select{background:rgba(var(--veil),.55);border-color:color-mix(in srgb,var(--ink) 25%,transparent)}
.vch .vch-world .calc .res,.vch .vch-world .res{background:transparent!important;color:var(--ink);border-radius:0;border-left:3px solid var(--acc);padding:10px 0 10px 28px}
.vch .vch-world .res *{color:inherit}
.vch .vch-world .res #pay,.vch .vch-world .res b,.vch .vch-world .res strong{color:var(--acc)}
.vch .vch-world .track figcaption{background:none;text-shadow:0 1px 10px rgba(0,0,0,.8)}
/* headline copy set straight on the film inside each lead */
.vch-copy{position:sticky;top:calc(100vh - var(--ch,320px) - 70px);padding:0 52px;max-width:min(52rem,70vw);pointer-events:none}
.vch-copy h2{font-size:clamp(2.8rem,6.4vw,7rem);font-weight:760;line-height:.92;letter-spacing:-.055em;margin-top:14px;text-shadow:0 2px 40px rgba(var(--veil),.85);transform-origin:0 100%;will-change:transform}
.vch-copy .lede{margin-top:18px;max-width:32rem;font-size:17px;line-height:1.55;color:var(--body);text-shadow:0 1px 16px rgba(var(--veil),.95)}
.vch-copy .eyebrow{text-shadow:0 1px 12px rgba(var(--veil),.9)}
.vch-copy .wm{display:inline-block;overflow:hidden;vertical-align:top;padding:.04em .02em .1em;margin:-.04em -.02em -.1em}
.vch-copy .wm .w{display:inline-block;will-change:transform}
.vch-stage canvas{transform-origin:50% 55%;will-change:transform}
.vch-stage:before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse 80% 70% at 30% 85%,rgba(var(--veil),.55),rgba(var(--veil),0) 70%);pointer-events:none}
@media (max-width:819px){
  .vch .vch-world>section{padding:9vh 0}
  .vch-copy{padding:0 20px;max-width:none;top:calc(100vh - var(--ch,280px) - 90px)}
  .vch-copy h2{font-size:clamp(2.4rem,11vw,3.6rem)}
  .vch-copy .lede{font-size:15px}
}
