/* Product Detail Page CSS Module */

.site-content > *,
.site-content > * > *,
.site-content > * > * > * {
    height: 100%;
}

.breadcrumbs {
    font-weight: 600;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0.875rem;
}

.breadcrumbs > * {
    color: #C7D9E34D;
    margin: 0;
}

.breadcrumbs .divider:after {
    content: '/';
}

.breadcrumbs > *:last-child {
    color: var(--light-blue);;
}

.product-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 1rem;
}

.phone-wrapper {
    position: relative;
    margin: auto;
    /* width: 75%; */
    max-width: 34.375rem;
    min-width: 15.625rem;
}

.phone-wrapper .phone-bg {
    width: 100%;
}

.product-content-wrapper {
    position: absolute;
    inset: 7.5% 5% 7% 5%;
    padding: 12% 6% 0 6%;
    overflow: hidden auto;
}

.content-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-bottom: 1.875rem;
}

.content-header .x {
    color: white;
    font-size: 2.125rem;
}

.page-title {
    color: var(--accent-orange);
}

.content-footer {
    position: relative;
    -webkit-isolation: isolate;
    isolation: isolate;
    padding-top: 11.25rem;
}

.cta-buttons {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.card-base-image {
    position: absolute;
    top: 30%;
    left: 25%;
    width: 26.875rem;
    max-width: unset;
    z-index: -1;
    -webkit-transform: rotate(-15deg);
        -ms-transform: rotate(-15deg);
            transform: rotate(-15deg);
}

@media screen and (max-width: 480px) {

    .phone-wrapper {
        max-width: 36.375rem;
    }

    .content-header .x {
        font-size: 3.125rem;
    }

    .content-main {
        font-size: 1.25rem;
    }

    .site-main {
        margin-top: 3vh;
    }

    .breadcrumbs {
        padding-bottom: 2rem;
    }

}