/* ACCMAA 20260814b — photographic pillar backgrounds + readable label scrims */

/* Stronger dark scrim so specialty labels stay readable on real photos */
html body .hero-photo-mini-grid--six .hero-photo-mini--themed::after,
html body #heroGuest .hero-photo-mini-grid--six .hero-photo-mini--themed::after,
body.premium-ui .hero-photo-mini--themed::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        linear-gradient(180deg, rgba(4, 18, 36, 0.12) 0%, rgba(4, 18, 36, 0.35) 42%, rgba(4, 18, 36, 0.88) 100%) !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

html body .hero-photo-mini-grid--six .hero-photo-mini img,
html body #heroGuest .hero-photo-mini-grid--six .hero-photo-mini img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    image-rendering: auto !important;
}

html body .hero-photo-mini-grid--six .hero-photo-mini-tag,
html body #heroGuest .hero-photo-mini-grid--six .hero-photo-mini-tag,
body.premium-ui .hero-photo-mini-tag {
    z-index: 2 !important;
    background: rgba(4, 18, 36, 0.82) !important;
    border: 1px solid rgba(232, 197, 71, 0.45) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}

html body .hero-photo-mini-grid--six .hero-photo-mini-tag i,
body.premium-ui .hero-photo-mini-tag i {
    color: var(--sector-color, #e8c547) !important;
    -webkit-text-fill-color: var(--sector-color, #e8c547) !important;
}

/* Sector photo pills — keep cover + readable overlay if rail re-enabled */
html body .hero-sector-pill.hero-sector-pill--photo,
html body #heroGuest .hero-sector-pill.hero-sector-pill--photo {
    background-image:
        linear-gradient(165deg, rgba(4, 18, 36, 0.35) 0%, rgba(4, 18, 36, 0.88) 100%),
        var(--sector-bg) !important;
    background-size: cover !important;
    background-position: center !important;
}

@media (max-width: 560px) {
    html body .hero-photo-mini-grid--six .hero-photo-mini,
    html body #heroGuest .hero-photo-mini-grid--six .hero-photo-mini {
        min-height: 100px !important;
    }
    html body .hero-photo-mini-grid--six .hero-photo-mini-tag {
        font-size: 0.68rem !important;
        padding: 5px 8px !important;
    }
}