/* Premium build page — hero slider (Ken Burns, matches homepage #homeheroslider) */

/* Preview + premium build: tall page for scroll prototyping */
body.sc-build-premium-preview {
    min-height: 2000px;
}

.sc-build-premium__top {
    position: relative;
    z-index: 1;
}

.sc-build-premium__scroll-test {
    min-height: 1200px;
}

/* Identity card — full-width children inside centered column */
.sc-build-premium-identity__card > .sc-build-premium-identity__body {
    width: 100%;
}

.sc-build-premium-identity__chrome {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: var(--sc-bp-chrome-opacity, 1);
}

/* Premium accent — SlickCars red (matches standard build header u-red-border-top) */
.sc-build-premium-identity__chrome.u-red-border-top::before {
    background: linear-gradient(90deg, #721314 0%, var(--primary, #d52020) 50%, #6e1112 100%);
}

.sc-build-premium-identity__gem {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background-color: var(--primary, #d52020);
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.sc-build-premium-identity__gem-img {
    display: block;
    width: 40px;
    height: 40px;
    margin-top: 3px;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.sc-build-premium__top.is-sc-bp-chrome-faded .sc-build-premium-identity__chrome,
.sc-build-premium__top.is-sc-bp-chrome-faded .sc-build-premium-identity__chrome.u-bg-gradient {
    opacity: 0 !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
}

.sc-build-premium__top.is-sc-bp-chrome-faded .sc-build-premium-identity__card {
    background-color: transparent !important;
}

.sc-build-premium-identity__body {
    z-index: 1;
}

.sc-build-premium-identity__head {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sc-build-premium-identity__head-row {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
}

@media (min-width: 768px) {
    .sc-build-premium-identity__thumb {
        display: none;
    }

    .sc-build-premium-identity__head {
        flex-wrap: nowrap;
    }

    .sc-build-premium-identity__head .sc-build-premium-actions-row {
        width: 100%;
        justify-content: center;
        transform: none;
    }

    .sc-build-premium-identity__head .sc-build-premium-actions-row .sc-build-premium-actions {
        transform: none;
    }

    .sc-build-premium-identity__titles {
        flex: 1 1 100%;
        align-items: center;
        transform: none;
    }

    .sc-build-premium-identity__name,
    .sc-build-premium-identity__meta-link {
        transform: none;
    }
}

.sc-build-premium-identity__thumb {
    display: block;
    width: 0;
    height: 0;
    opacity: 0;
    overflow: hidden;
    border: 0;
}

.sc-build-premium-hero__spacer {
    display: none;
    width: 100%;
    pointer-events: none;
}

@media (max-width: 767px) {
    /* Hero stays under identity + summary as you scroll (scale driven by build-premium-parallax.js). */
    .sc-build-premium-hero {
        position: relative;
        z-index: 1;
    }

    .sc-build-premium-hero[data-sc-build-premium-hero-scroll] {
        overflow: hidden;
    }

    .sc-build-premium-hero[data-sc-build-premium-hero-scroll] .sc-build-premium-hero__slider {
        will-change: transform;
    }

    .sc-build-premium-identity {
        position: relative;
        z-index: 2;
    }

    .sc-build-premium-identity__head {
        position: sticky;
        top: max(8px, env(safe-area-inset-top, 0px));
        z-index: 6;
        width: 100%;
    }

    .sc-build-premium-identity__titles {
        flex: 1 1 auto;
        min-width: 0;
        width: 100%;
    }

    .sc-build-premium-summary-wrap {
        position: relative;
        z-index: 3;
    }
}

.sc-build-premium-actions-row {
    padding-top: var(--space-4);
    box-sizing: border-box;
}

.sc-build-premium-actions-row .sc-build-premium-actions {
    flex-wrap: nowrap;
}

.sc-build-premium-actions__btn {
    display: inline-grid;
    place-items: center;
    box-sizing: border-box;
    width: 45px;
    height: 45px;
    padding: 0;
    margin: 0;
    line-height: 0;
    font-size: 0;
    vertical-align: middle;
    background-color: #2c1416 !important;
    border: 1px solid #8a3030 !important;
    transition: transform 0.15s ease, border-color 0.15s ease;
}

.sc-build-premium-actions__btn svg {
    display: block;
    width: 20px;
    height: 20px;
    margin: -1px 0 0 -0.5px;
}

.sc-build-premium-actions__btn:active {
    transform: scale(0.96);
}


@media (hover: hover) {
    .sc-build-premium-actions__btn:hover {
        border-color: #c04545 !important;
    }
}

/* Premium summary — wrap: u-px-16; bordered panel: u-py-10 u-px-6; uniform row gaps */
.sc-build-premium-recognition .sc-recognition__header {
    padding-left: 6px;
    padding-right: 6px;
}

.sc-build-premium-summary .sc-build-premium-summary__stack,
.sc-build-premium-summary .sc-build-badge-pills {
    gap: var(--space-1);
}

.sc-build-premium-summary .sc-build-badge-pills {
    margin-bottom: 0;
}

.sc-build-premium-summary .sc-build-summary__foot {
    margin-top: 0;
}

/* Stat strip — copied from single-car.css (stat footer); score + badges use single-car.css + sc-main.css */
.sc-build-summary__stats { color: #acb2ba; }
@media (min-width: 479px) {
    .sc-build-summary__stats { gap: 12px; }
}
.sc-build-summary__stamp { color: #8d8d93; }

.sc-build-premium-hero.u-fade-bottom-dark::after {
    z-index: 3;
    height: 58%;
    background: linear-gradient(
        to bottom,
        transparent 0%,
        rgb(22 22 22 / 12%) 35%,
        rgb(22 22 22 / 35%) 55%,
        rgb(18 18 18 / 75%) 75%,
        #121212 100%
    );
}

.sc-build-premium-hero__slider {
    position: absolute;
    left: 0;
    right: 0;
    top: -10%;
    height: 120%;
    overflow: hidden;
    --homehero-zoom-duration: 4800ms;
    will-change: transform;
    transform: translate3d(0, 0, 0);
    transform-origin: center center;
}

.sc-build-premium-hero__slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    opacity: 0;
    transition: opacity 850ms linear;
    pointer-events: none;
    z-index: 1;
}

.sc-build-premium-hero__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translateZ(0) scale(1);
    will-change: transform;
    backface-visibility: hidden;
}

.sc-build-premium-hero__slide.is-zoom-out img {
    animation: homeherozoomout var(--homehero-zoom-duration, 4800ms) ease-out forwards;
}

.sc-build-premium-hero__slide.is-zoom-in img {
    animation: homeherozoomin var(--homehero-zoom-duration, 4800ms) ease-out forwards;
}

.sc-build-premium-hero__slide:first-child img {
    animation: homeherozoomout var(--homehero-zoom-duration, 4800ms) ease-out forwards;
}

@media (prefers-reduced-motion: reduce) {
    .sc-build-premium-hero__slide img {
        animation: none !important;
        transform: scale(1);
    }

    .sc-build-premium-hero__slide {
        transition: opacity 200ms linear;
    }
}

/* Live single-car premium layout — desktop header stack + fewer duplicate chrome */
@media (min-width: 768px) {
    .single-car.sc-build-premium .sc-build-premium__top {
        order: -2;
    }

    .single-car.sc-build-premium .sc-build-premium-identity {
        margin-top: 0;
    }
}

.single-car.sc-build-premium .sc-actions-top,
.single-car.sc-build-premium .sc-actions-bar {
    display: none !important;
}
