/* Shalev Madmoni — profile-specific quote photos.
   Shared layout: ../../css/profile-base.css */

/* Opening quote — photo backdrop */
.profile-quote.profile-quote--opening.profile-quote--opening-photo {
    background-image:
        linear-gradient(
            92deg,
            rgba(44, 44, 44, 0.93) 0%,
            rgba(44, 44, 44, 0.78) 22%,
            rgba(44, 44, 44, 0.5) 42%,
            rgba(44, 44, 44, 0.22) 62%,
            rgba(44, 44, 44, 0.06) 82%,
            rgba(44, 44, 44, 0) 100%
        ),
        image-set(
            url("images/quote-opening.webp") type("image/webp"),
            url("images/quote-opening.png") type("image/png")
        );
    background-size: cover, cover;
    background-position:
        center center,
        84% center;
}

/* Closing quote — mother's words over family photo */
.profile-quote.profile-quote--closing-photo {
    background-image:
        linear-gradient(
            90deg,
            rgba(44, 44, 44, 0.28) 0%,
            rgba(44, 44, 44, 0.06) 24%,
            transparent 48%
        ),
        image-set(
            url("images/quote-image.webp") type("image/webp"),
            url("images/quote-image.jpg") type("image/jpeg")
        );
    background-size: cover, cover;
    background-position:
        center center,
        68% center;
}

@media (max-width: 720px) {
    .profile-quote.profile-quote--opening.profile-quote--opening-photo {
        min-height: clamp(26rem, 88vw, 38rem);
        background-image:
            linear-gradient(
                185deg,
                rgba(44, 44, 44, 0.91) 0%,
                rgba(44, 44, 44, 0.72) 28%,
                rgba(44, 44, 44, 0.45) 55%,
                rgba(44, 44, 44, 0.2) 100%
            ),
            image-set(
                url("images/quote-opening.webp") type("image/webp"),
                url("images/quote-opening.png") type("image/png")
            );
        background-position:
            center center,
            82% 32%;
    }

    .profile-quote--opening-photo .profile-quote__text {
        max-width: none;
        text-shadow:
            0 2px 24px rgba(44, 44, 44, 0.78),
            0 1px 6px rgba(44, 44, 44, 0.9);
    }

    .profile-quote.profile-quote--closing-photo {
        background-image:
            linear-gradient(
                185deg,
                rgba(44, 44, 44, 0.91) 0%,
                rgba(44, 44, 44, 0.72) 28%,
                rgba(44, 44, 44, 0.45) 55%,
                rgba(44, 44, 44, 0.2) 100%
            ),
            image-set(
                url("images/quote-image.webp") type("image/webp"),
                url("images/quote-image.jpg") type("image/jpeg")
            );
        background-position:
            center center,
            38% 16%;
    }
}
