/* Shared accessibility and interaction layer for star-map catalog landings. */
.stars-catalog-skip-link {
    position: fixed;
    z-index: 10000;
    top: 12px;
    left: 12px;
    padding: 11px 15px;
    color: #ffffff;
    background: #202838;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transform: translateY(-180%);
}

.stars-catalog-skip-link:focus {
    color: #ffffff;
    transform: translateY(0);
}

.star-map-category-page .stars-catalog-product-card {
    min-width: 0;
    transform: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.star-map-category-page .stars-catalog-product-card:hover {
    transform: none;
}

.star-map-category-page .smcp-btn,
.star-map-category-page .smcp-card-btn,
.star-map-category-page .smcp-show-more-btn {
    min-height: 44px;
    font-size: 14px;
    transform: none;
}

.star-map-category-page .smcp-btn:hover,
.star-map-category-page .smcp-card-btn:hover,
.star-map-category-page .smcp-show-more-btn:hover {
    transform: none;
}

.star-map-category-page .spr-slider-btn {
    width: 44px;
    height: 44px;
}

.star-map-category-page a:focus-visible,
.star-map-category-page button:focus-visible,
.star-map-category-page summary:focus-visible {
    outline: 3px solid #2d6cdf;
    outline-offset: 3px;
}

.star-map-category-page .smcp-badge,
.star-map-category-page .smcp-price-label,
.star-map-category-page .spm-hero-visual-label,
.star-map-category-page .smco-hero-label,
.star-map-category-page .sp-combo-layer-label,
.star-map-category-page .sp-combo-artwork-caption,
.star-map-category-page .sp-combo-photo-option small {
    font-size: 12px;
}

.star-map-category-page .smcp-price span,
.star-map-category-page .smcp-popular-format,
.star-map-category-page .sp-photo-card-value,
.star-map-category-page .sp-included-value--card .sp-included-value-copy strong,
.star-map-category-page .sp-included-value--card .sp-included-value-copy small,
.star-map-category-page .spm-format-row span,
.star-map-category-page .spm-format-row del,
.star-map-category-page .smco-card-type span,
.star-map-category-page .smco-catalog-intro-badges span,
.star-map-category-page .spm-hero-benefits span,
.star-map-category-page .sp-photo-service-copy > small {
    font-size: 12px;
}

.star-map-category-page .smcp-product-body p {
    font-size: 13px;
}

.star-map-category-page .smcp-product-img,
.star-map-category-page .smcp-product-body,
.star-map-category-page .sp-included-value-copy {
    min-width: 0;
}

/* Four alternative star-map types: two columns on phones, four on desktop. */
.star-map-category-page .smcp-related-grid {
    align-items: stretch;
}

.star-map-category-page .smcp-related-col {
    display: flex;
}

.star-map-category-page .smcp-related-card {
    width: 100%;
}

/* Photo landing: one compact explanation instead of two repeating sections. */
.star-map-photo-page .sp-photo-guide-panels {
    margin-right: -9px;
    margin-left: -9px;
}

.star-map-photo-page .sp-photo-guide-col {
    display: flex;
    padding-right: 9px;
    padding-left: 9px;
    margin-bottom: 18px;
}

.star-map-photo-page .sp-photo-guide-panel {
    width: 100%;
    padding: 25px;
    background: #ffffff;
    border: 1px solid rgba(32, 40, 56, .09);
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(32, 40, 56, .06);
}

.star-map-photo-page .sp-photo-guide-panel--story {
    background: linear-gradient(145deg, #202838, #2c3850);
    border-color: rgba(32, 40, 56, .16);
    color: #ffffff;
}

.star-map-photo-page .sp-photo-guide-label {
    margin-bottom: 7px;
    color: #9b7a35;
    font-size: 11px;
    line-height: 1.25;
    font-weight: 850;
    letter-spacing: .9px;
    text-transform: uppercase;
}

.star-map-photo-page .sp-photo-guide-panel--story .sp-photo-guide-label {
    color: #e3c37d;
}

.star-map-photo-page .sp-photo-guide-panel h3 {
    margin: 0 0 18px;
    color: #202838;
    font-size: 22px;
    line-height: 1.24;
    font-weight: 850;
}

.star-map-photo-page .sp-photo-guide-panel--story h3 {
    color: #ffffff;
}

.star-map-photo-page .sp-photo-guide-panel ul {
    display: grid;
    gap: 13px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.star-map-photo-page .sp-photo-guide-panel li {
    position: relative;
    padding-left: 20px;
}

.star-map-photo-page .sp-photo-guide-panel li::before {
    position: absolute;
    top: .42em;
    left: 0;
    width: 8px;
    height: 8px;
    content: "";
    background: #9b7a35;
    border-radius: 50%;
}

.star-map-photo-page .sp-photo-guide-panel li strong,
.star-map-photo-page .sp-photo-guide-panel li span {
    display: block;
}

.star-map-photo-page .sp-photo-guide-panel li strong {
    margin-bottom: 3px;
    color: #202838;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 850;
}

.star-map-photo-page .sp-photo-guide-panel li span {
    color: #606978;
    font-size: 13px;
    line-height: 1.48;
}

.star-map-photo-page .sp-photo-guide-panel--story li strong {
    color: #ffffff;
}

.star-map-photo-page .sp-photo-guide-panel--story li span {
    color: rgba(255, 255, 255, .74);
}

.star-map-photo-page .sp-photo-proof-chain {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
    padding: 12px;
    background: #f0ede7;
    border: 1px solid rgba(32, 40, 56, .07);
    border-radius: 15px;
    list-style: none;
}

.star-map-photo-page .sp-photo-proof-chain li {
    position: relative;
    min-width: 0;
    padding: 12px 10px;
    background: #ffffff;
    border-radius: 11px;
    text-align: center;
}

.star-map-photo-page .sp-photo-proof-chain li:not(:last-child)::after {
    position: absolute;
    z-index: 2;
    top: 50%;
    right: -11px;
    content: "›";
    color: #9b7a35;
    font-size: 20px;
    line-height: 1;
    font-weight: 900;
    transform: translateY(-50%);
}

.star-map-photo-page .sp-photo-proof-chain span,
.star-map-photo-page .sp-photo-proof-chain strong {
    display: block;
}

.star-map-photo-page .sp-photo-proof-chain span {
    margin-bottom: 4px;
    color: #9b7a35;
    font-size: 10px;
    font-weight: 850;
}

.star-map-photo-page .sp-photo-proof-chain strong {
    color: #202838;
    font-size: 12px;
    line-height: 1.3;
    font-weight: 800;
}

@media (max-width: 575.98px) {
    .star-map-category-page .smcp-related-grid {
        margin-right: -5px;
        margin-left: -5px;
    }

    .star-map-category-page .smcp-related-col {
        padding-right: 5px;
        padding-left: 5px;
        margin-bottom: 10px;
    }

    .star-map-category-page .smcp-related-card {
        border-radius: 12px;
    }

    .star-map-category-page .smcp-related-card strong {
        min-height: 3.5em;
        padding: 11px 10px 3px;
        font-size: 13px;
        line-height: 1.25;
    }

    .star-map-category-page .smcp-related-card-copy {
        display: -webkit-box;
        overflow: hidden;
        padding: 0 10px 12px;
        font-size: 11px;
        line-height: 1.35;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
    }

    .star-map-photo-page .sp-photo-guide-panel {
        padding: 18px 15px;
        border-radius: 14px;
    }

    .star-map-photo-page .sp-photo-guide-panel h3 {
        margin-bottom: 14px;
        font-size: 18px;
    }

    .star-map-photo-page .sp-photo-guide-panel ul {
        gap: 11px;
    }

    .star-map-photo-page .sp-photo-proof-chain {
        grid-template-columns: 1fr;
        gap: 6px;
        padding: 8px;
    }

    .star-map-photo-page .sp-photo-proof-chain li {
        display: grid;
        grid-template-columns: 28px minmax(0, 1fr);
        align-items: center;
        padding: 9px 11px;
        text-align: left;
    }

    .star-map-photo-page .sp-photo-proof-chain li:not(:last-child)::after {
        top: auto;
        right: auto;
        bottom: -10px;
        left: 21px;
        transform: rotate(90deg);
    }

    .star-map-photo-page .sp-photo-proof-chain span {
        margin: 0;
    }

    .star-map-category-page .smcp-badge {
        min-height: 25px;
        padding-right: 8px;
        padding-left: 8px;
        font-size: 11.5px;
    }

    .star-map-category-page .smcp-product-body p {
        display: block;
        margin-bottom: 10px;
        font-size: 12px;
        line-height: 1.45;
    }

    .star-map-category-page .smcp-price span,
    .star-map-category-page .sp-photo-card-value,
    .star-map-category-page .sp-included-value--card .sp-included-value-copy strong,
    .star-map-category-page .sp-included-value--card .sp-included-value-copy small {
        font-size: 12px;
    }

    .star-map-category-page .smcp-card-btn {
        min-height: 44px;
        font-size: 14px;
    }

    .star-map-category-page .smcp-hero-benefits span,
    .star-map-category-page .smcp-step span,
    .star-map-category-page .spm-feature-number {
        font-size: 12px;
    }

    .star-map-category-page .sp-combo-visual--card .sp-combo-layer-label,
    .star-map-category-page .sp-combo-visual--card .sp-combo-artwork-caption {
        font-size: 11.5px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .star-map-category-page *,
    .star-map-category-page *::before,
    .star-map-category-page *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }

    .star-map-category-page .smcp-product-img img {
        transform: none !important;
    }
}
