/**
 * CADMasters — Media Presentation Engine
 * Sliders, animated images, video, and Lottie wrappers.
 */

.media-presenter {
    position: relative;
    display: block;
    width: 100%;
    z-index: 1;
}

.media-presenter--hero-background {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
}

.media-presenter--hero-background .media-slider,
.media-presenter--hero-background .media-slider__track,
.media-presenter--hero-background .media-slide,
.media-presenter--hero-background .media-presenter__video,
.media-presenter--hero-background .media-presenter__lottie,
.media-presenter--hero-background .media-presenter__video-element,
.media-presenter--hero-background .media-presenter__lottie-player {
    width: 100%;
    height: 100%;
}

.media-presenter--hero-background .media-slide {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.media-presenter--hero-background .media-presenter__video-element,
.media-presenter--hero-background .media-presenter__lottie-player {
    object-fit: cover;
    display: block;
}

.media-presenter--inline .cm-media,
.media-presenter--card .cm-media {
    width: 100%;
}

.media-presenter--card .media-slider {
    aspect-ratio: 16 / 10;
}

.media-presenter--animated .media-presenter__animated-wrap img,
.media-presenter__image--animated {
    animation-duration: 18s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

.media-presenter--animated .hero-motion--ken_burns img,
.media-presenter__image--animated.hero-motion--ken_burns {
    animation-name: media-presenter-ken-burns;
}

.media-presenter--animated .hero-motion--slow_zoom img,
.media-presenter__image--animated.hero-motion--slow_zoom {
    animation-name: media-presenter-slow-zoom;
}

.media-presenter--animated .hero-motion--floating img,
.media-presenter__image--animated.hero-motion--floating {
    animation-name: media-presenter-float;
}

@keyframes media-presenter-ken-burns {
    0% { transform: scale(1) translate(0, 0); }
    100% { transform: scale(1.08) translate(-1.5%, -1%); }
}

@keyframes media-presenter-slow-zoom {
    0% { transform: scale(1); }
    100% { transform: scale(1.06); }
}

@keyframes media-presenter-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

.media-slider {
    position: relative;
    overflow: hidden;
}

.media-slider__track {
    position: relative;
    width: 100%;
    height: 100%;
}

.media-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.8s ease, transform 0.8s ease, visibility 0.8s ease;
    pointer-events: none;
}

.media-slide__image {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.media-presenter--hero-background .media-slide__image {
    position: absolute;
    width: 1px;
    height: 1px;
    clip: rect(0, 0, 0, 0);
}

.media-slide--active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    z-index: 1;
}

.media-slide:not(.media-slide--active) {
    animation: none !important;
}

.media-slide--active.media-slide--kenburns,
.media-slider--kenburns .media-slide--active {
    animation: media-presenter-ken-burns 18s ease-in-out infinite alternate;
}

.media-slide .cm-media,
.media-slide .cm-media__img,
.media-slide__media,
.media-slide__media .cm-media__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.media-slider--zoom .media-slide {
    transform: scale(1.04);
}

.media-slider--zoom .media-slide--active {
    transform: scale(1);
}

.media-slider--slide .media-slide {
    transform: translateX(4%);
}

.media-slider--slide .media-slide--active {
    transform: translateX(0);
}

.media-slider--kenburns .media-slide--active {
    animation: media-presenter-ken-burns 18s ease-in-out infinite alternate;
}

.media-slider--crossfade .media-slide {
    transition: opacity 1.2s ease, visibility 1.2s ease;
}

.media-presenter__video-element {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

.media-presenter--hero-background .media-presenter__video-element {
    height: 100%;
}

.media-presenter__lottie,
.media-presenter__lottie-player {
    width: 100%;
    height: 100%;
    display: block;
}

.media-presenter--card .cm-stat-card__media,
.media-presenter--card .quality-badge__media {
    width: auto;
}

.project-hero__media .media-presenter,
.project-hero__media .cm-media,
.project-hero__media img {
    width: 100%;
    display: block;
}

.quality-badge__media {
    width: 40px;
    height: 40px;
}

.quality-badge__media img,
.quality-badge__image {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

@media (prefers-reduced-motion: reduce) {
    .media-slide {
        transition: none;
    }

    .media-presenter--animated .media-presenter__animated-wrap img,
    .media-presenter__image--animated {
        animation: none !important;
    }
}

@media (max-width: 767.98px) {
    .media-presenter--hero-background .media-presenter__video {
        display: none;
    }
}