/* This treatment is isolated from the original, reversible ribbon design. */
.gradient-hero .v-hero{isolation:isolate}
.gradient-hero .v-hero::before{content:"";position:absolute;z-index:-1;inset:0 calc((1320px - 100vw)/2);pointer-events:none;background-image:linear-gradient(to right,rgba(90, 100, 114,.045) 1px,transparent 1px),linear-gradient(to bottom,rgba(90, 100, 114,.045) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(transparent,#000 20%,#000 65%,transparent 95%)}
.colour-wave{position:absolute;z-index:0;right:-3%;top:0;width:76%;height:630px;pointer-events:none;--wave-opacity:1}
.colour-wave canvas,.wave-fallback{position:absolute;inset:0;width:100%;height:100%}
.colour-wave canvas{opacity:0;transition:opacity 1.2s ease;pointer-events:none}
.colour-wave.has-webgl canvas{opacity:var(--wave-opacity)}
.wave-fallback{opacity:var(--wave-opacity);background:radial-gradient(ellipse 19% 29% at 65% 37%,#e94c22cc,transparent),radial-gradient(ellipse 18% 29% at 47% 56%,#3654e6a6,transparent);mask-image:linear-gradient(140deg,transparent 12%,#000 32%,#000 76%,transparent 92%)}
.has-webgl .wave-fallback{opacity:0}
.colour-wave .motion-toggle{right:6%;top:16px;color:#45494e;background:rgba(246, 246, 242,.65);backdrop-filter:blur(8px)}
.colour-wave .motion-toggle:hover{background:rgba(246, 246, 242,.92);color:var(--v-blue)}
.gradient-hero .hero-foot{position:relative;z-index:2}
@media(min-width:1600px){.colour-wave{height:720px;top:0}}
@media(max-width:1432px){.gradient-hero .v-hero::before{inset-inline:-56px}}
@media(max-width:1050px){.gradient-hero .v-hero::before{inset-inline:-32px}.colour-wave{right:-3%;width:76%;height:560px;--wave-opacity:.66}}
@media(max-width:700px){.gradient-hero .v-hero{padding-top:56px}.gradient-hero .v-hero::before{inset-inline:-20px}.colour-wave{left:-20px;right:auto;top:0;width:calc(100% + 40px);height:460px;margin:0;--wave-opacity:.32}.colour-wave .motion-toggle{top:0;right:20px}.gradient-hero .hero-foot{padding-top:24px}}
@media(max-width:360px){.gradient-hero .chapter-intro>*,.gradient-hero .editorial-pair>*{min-width:0}.gradient-hero .chapter-intro h2{font-size:39px}}
@media(prefers-reduced-motion:reduce){.colour-wave canvas{transition:none}}
@media print{.colour-wave,.gradient-hero .v-hero::before{display:none}}
