/* Site-wide scroll / enter motion — subtle, automotive-product tone */
.ds-reveal {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
    transition:
        opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: var(--ds-reveal-delay, 0ms);
    will-change: opacity, transform;
}
.ds-reveal.is-in {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}
.ds-reveal--soft {
    transform: translate3d(0, 14px, 0);
}
.ds-reveal--left {
    transform: translate3d(-18px, 0, 0);
}
.ds-reveal--right {
    transform: translate3d(18px, 0, 0);
}
.ds-reveal--left.is-in,
.ds-reveal--right.is-in,
.ds-reveal--soft.is-in {
    transform: translate3d(0, 0, 0);
}

.ds-reveal-child {
    opacity: 0;
    transform: translate3d(0, 16px, 0);
}
.ds-reveal.is-in .ds-reveal-child {
    animation: ds-reveal-child-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: var(--ds-reveal-delay, 0ms);
}
@keyframes ds-reveal-child-in {
    from { opacity: 0; transform: translate3d(0, 16px, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
}

.ds-page-enter {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
    transition:
        opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: var(--ds-reveal-delay, 0ms);
}
.ds-page-enter.is-in {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

/* Content image loader — never paint a fill behind transparent PNGs */
.ds-img-frame {
    position: relative;
    display: block;
    background: transparent;
    line-height: 0;
}
.ds-img-frame--soft {
    height: auto;
    overflow: visible;
    background: transparent;
}
.ds-img-frame.is-loaded .ds-img-frame__skel {
    opacity: 0;
    visibility: hidden;
    animation: none;
}

@media (prefers-reduced-motion: reduce) {
    .ds-reveal,
    .ds-reveal-child,
    .ds-page-enter {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        animation: none !important;
        will-change: auto;
    }
}
