@supports (mask-composite:intersect) or (-webkit-mask-composite:source-in){.class-hero-art{--hero-art-under-header:linear-gradient(to bottom, transparent 0, transparent calc(var(--header-h-full) * .6), #000 calc(var(--header-h-full) + 2.5rem));-webkit-mask-image:linear-gradient(to right, transparent 0%, #000 58%), var(--hero-art-under-header);-webkit-mask-image:linear-gradient(to right, transparent 0%, #000 58%), var(--hero-art-under-header);mask-image:linear-gradient(to right, transparent 0%, #000 58%), var(--hero-art-under-header);-webkit-mask-composite:source-in;-webkit-mask-composite:source-in;mask-composite:intersect}}@media (max-width:639px){.class-hero-art{--hero-art-mask-sm:linear-gradient(to bottom, transparent 0, transparent calc(var(--header-h-full) + 2.5rem), #000 calc(var(--header-h-full) + 7rem), transparent 82%);-webkit-mask-image:var(--hero-art-mask-sm);-webkit-mask-image:var(--hero-art-mask-sm);mask-image:var(--hero-art-mask-sm);-webkit-mask-composite:source-over;-webkit-mask-composite:source-over;mask-composite:add}}