@layer components{.c-overlay{position:relative;overflow:hidden}:is(.c-overlay):is(h1,h2,h3){z-index:1}:is(.c-overlay) img{transition:transform .3s}:is(.c-overlay):hover:after{background:hsl(0 0% 0% / .3)}:is(.c-overlay):hover img{transform:var(--hover-scale)}:is(.c-overlay):after{content:"";position:absolute;pointer-events:none;top:0;left:0;width:100%;height:100%;background:hsl(0 0% 0% / .5);transition:background .3s cubic-bezier(.47,0,.75,.72) 0s}.c-overlay__title{position:absolute;z-index:1;top:50%;left:50%;transform:translate(-50%,-50%);width:calc(100% - var(--spacing-l) * 2);padding:0;font-family:var(--font-family-main);font-size:calc(var(--font-size-s-2) - .25em);line-height:var(--font-size-s-2-line-height);color:#fff;font-weight:var(--font-family-main-weight-medium);text-align:center}.c-overlay__byline{display:block;padding-block-start:var(--spacing-4xs);font-size:var(--font-size-s-x);font-weight:var(--font-family-main-weight-light)}.c-overlay__strong{font-weight:var(--font-family-main-weight-semi-bold)}@media (min-width: 500px){.c-overlay__title{font-size:var(--font-size-s-2)}.c-overlay__title--s{font-size:var(--font-size-s-1)}}}@layer modifiers{.c-overlay--fade-to-black:after{background:transparent}.c-overlay--fade-to-black:hover:after{background:hsl(0 0% 0% / .8)}.c-overlay--reveal-on-hover .c-overlay__title{opacity:0}.c-overlay--reveal-on-hover:hover .c-overlay__title{animation-name:fade-in;animation-duration:.35s;animation-fill-mode:forwards}}
