/* Hero overlays compiled outside Tailwind so they apply on the live WordPress theme. */

.pes-hero-home__photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 78% center;
}

.pes-hero-home__shade {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(to right, rgba(11, 31, 51, 0.92) 0%, rgba(11, 31, 51, 0.55) 45%, rgba(11, 31, 51, 0.18) 100%),
        linear-gradient(to top, rgba(11, 31, 51, 0.78) 0%, rgba(11, 31, 51, 0) 42%, rgba(11, 31, 51, 0.22) 100%);
}

.pes-hero-pipeline__photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 68% 42%;
}

.pes-hero-pipeline__shade {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: linear-gradient(
        to right,
        #0b1f33 0%,
        rgba(11, 31, 51, 0.94) 58%,
        rgba(11, 31, 51, 0.45) 100%
    );
}

@media (min-width: 1024px) {
    .pes-hero-pipeline__shade {
        background: linear-gradient(
            to right,
            #0b1f33 0%,
            #0b1f33 30%,
            rgba(11, 31, 51, 0.72) 46%,
            rgba(11, 31, 51, 0.18) 70%,
            rgba(11, 31, 51, 0) 100%
        );
    }

    .pes-hero-pipeline__copy {
        max-width: 32%;
    }
}
